function s_change(){ OptionDelete(); //消す id = $('select1').value;//valueの値を取得 //alert(id); //デバグ用 //連想配列を作成 //var arryVB={vb1:'VB1',vb2:'VB2',vb3:'VB3',vb4:'VB4',vb5:'VB5',vb6:'VB6'}; //var arryJS={js1:'JS1',js2:"JS2",js3:"JS3",js4:"JS4",js5:'JS5',js6:'JS6'}; //配列を作成 var arryVB=['VB1','VB2','VB3','VB4','VB5','VB6']; var arryJS=['JS1','JS2','JS3','JS4','JS5','JS6']; switch (id) { case "vb": var x=0; for (x=$('select2').length; x <= arryVB.length-1; x++){ $('select2').options[x] =new Option(arryVB[x],arryVB[x]); } break; case "js": var x=0; for (x=$('select2').length; x <= arryJS.length-1; x++){ $('select2').options[x] =new Option(arryJS[x],arryJS[x]); } break; } } //オプションの中身を削除する function OptionDelete(){ var select = $('select2'); var options = select.options; for (var i = options.length - 1; 0 <= i; --i) { $('select2').options[i]=null; } }
<script type="text/javascript"> //二级联动 Event.observe(window, 'load', function() { Event.observe('alarm_type', 'change', resetOption); resetOption(); }); function resetOption(){ {% autoescape off %} var orginals = {{AIDC_FILTER_ALARM_TYPE_LIST}} ; {% endautoescape %} var alarm_type = $("alarm_type").getValue(); for(var i in orginals){ for(var key in orginals[i]){ if(key == alarm_type){ var subObjs = orginals[i][key] resetOption2(subObjs); } } } } function resetOption2(subObjs){ var arr = []; for(var j in subObjs){ for(var name in subObjs[j]){ if(subObjs[j].hasOwnProperty(name)){ arr.push(name); } } } //delete old var options = $('sub_alarm_type').options; for(var index_d = options.length; index_d >=0; index_d--){ $('sub_alarm_type').options[index_d] = null; } //add new for(var index = 0; index < arr.length; index++){ $('sub_alarm_type').options[index] =new Option(arr[index],arr[index]); } } </script> <select id="alarm_type" name="alarm_type"> {% for alarm_type in AIDC_FILTER_ALARM_TYPE_LIST %} {% for key, value in alarm_type.items %} <option value="{{ key }}">{{ key }}</option> {% endfor %} {% endfor %} </select> -<select id="sub_alarm_type" name="sub_alarm_type"></select>