js書き込み双方向セレクタケース(jspページ、json取得データ)
3969 ワード
1.双方向選択器、若干の修正、効果は添付図、jspページを参照:
2.jsコード:(同じjspページ)
ダブルクリックで選択
ajaxでオプションとオプションを取得し、json戻りフォーマットを選択しました:
2.jsコード:(同じjspページ)
ダブルクリックで選択
ajaxでオプションとオプションを取得し、json戻りフォーマットを選択しました:
[{"name":" ","id":1,"description":" ","status":1,"createDatetime":"2011-12-08 15:20:15","createBy":1,"updateDatetime":"2011-12-08 15:20:19","updateBy":1}]
<br> $("#s1").html("");<br> $("#s2").html("");<br> // <br> $.ajax({<br> url: "services/sys/sel-wait.do",<br> data: {"operid":id},<br> success: function(data) {<br> for(var i=0;i<data.length;i++){<br> $("#s1").append("<option value='"+data[i].id+"'>"+data[i].name+"</option>");<br> } <br> },<br> error: function() {<br><br> }<br> });<br> // <br> $.ajax({<br> url: "services/sys/sel-select.do",<br> data: {"operid":id},<br> success: function(data) {<br> for(var i=0;i<data.length;i++){<br> $("#s2").append("<option value='"+data[i].id+"'>"+data[i].name+"</option>");<br> } <br> },<br> error: function() {<br><br> }<br> });<br><br>//$("#s1 option:first,#s2 option:first").attr("selected",true);<br>$("#s1").dblclick(function(){<br>$("option:selected",this).clone().appendTo("#s2");<br>$("option:selected",this).remove();<br>//$("#s1 option:first,#s2 option:first").attr("selected",true);<br>});<br><br>$("#s2").dblclick(function(){<br>$("option:selected",this).clone().appendTo("#s1");<br>$("option:selected",this).remove();<br>//$("#s1 option:first,#s2 option:first").attr("selected",true);<br>});<br><br>$("#add").click(function(){<br>$("#s1 option:selected").clone().appendTo("#s2");<br>$("#s1 option:selected").remove();<br>//$("#s1 option:first,#s2 option:first").attr("selected",true);<br>});<br><br>$("#remove").click(function(){<br>$("#s2 option:selected").clone().appendTo("#s1");<br>$("#s2 option:selected").remove();<br>//$("#s1 option:first,#s2 option:first").attr("selected",true);<br>});<br><br>$("#addall").click(function(){<br>$("#s1 option").clone().appendTo("#s2");<br>$("#s1 option").remove();<br>//$("#s1 option:first,#s2 option:first").attr("selected",true);<br>});<br><br>$("#removeall").click(function(){<br>$("#s2 option").clone().appendTo("#s1");<br>$("#s2 option").remove();<br>//$("#s1 option:first,#s2 option:first").attr("selected",true);<br>});<br><br>