テーブル構造
第 2 レベルまたはマルチレベルのリンクは主にデータベース内の親番号を持つテーブルに基づいており、これも例外ではありません
id、parent_id、name の 3 つの列。
js オペレーションの使用
まず、js にデータがどのように格納されるかについて説明します。
データの保存には主に 2 次元配列を使用します。構造は次のとおりです:
a[親番号]=[[子番号 1, 子名 1], [子番号 2, 子名 2], [子番号 3, 子名 3],…]; 🎜> まず、親番号を使用してすべての子データを取得し、ドロップダウンで子データの番号と名前をバインドします。
最初のステップは、第 2 レベルのリンケージ データです (方法これらのデータは後で取得します)
var都市=新しい配列();
都市['00000000-0000-0000-0000-000000000000']=[['028db215-8bd7-45ab-bbaa-1efa175c35ca','長春'],['bcb32195-2a46- 4cd1-9472-6383e8fa55cc',' 瀋陽'] ];
var school=new Array();
schools['028db215-8bd7-45ab-bbaa-1efa175c35ca']=[['5f22403a- 7a59-4b7f-b62d-9451298cbd00','長春 1'],['e8f0f665-9a9a-4c44-83fd-598e8a28dcd7','長春 2']]; -a44e-8d169d715664','瀋陽 1']]; 🎜 >
第 1 レベルは都市データ、第 2 レベルは学校データです。
2 番目のステップは、ドロップダウンに表示されるデータを設定することです
コードをコピーします
コードは次のとおりです: //親の番号に基づいて対応する子のデータを取得し、obj コントロールに表示します
//type=0 city, 1 school
// pid 親番号
//obj データを表示するドロップダウンへ
function SetRegions(type,pid,obj)
{
var text="
コードをコピー
SetRegions (1,$("#cities").val(),"#schools");
4 番目のステップは、もちろん、初期化が必要な変更を行う場合です。これは、
をコピーする前の最大の悩みでもありました。 code
function InitRegions(cityId,schoolId)
{
//都市データを初期化します
//SetRegions(0,"00000000-0000-0000-0000-000000000000","#cities"); /都市を検索し、デフォルト値として設定します
$("#cities option[value =" cityId "]").attr("selected","selected");
if(schoolId!=" 00000000-0000-0000-0000-000000000001"){
//学校データを初期化します
SetRegions(1,cityId,"#schools");
//学校を検索し、デフォルト値として設定します
$("#schools option[value=" schoolId "]").attr("選択済み", "選択済み")
}
}
フロントエンドコード
コピーコード