select 左右多选 demo js

<script type="text/javascript">
// submit
$(function(){
$("#id_save").click(function(){
if(chkform()){
// alert('submit()');
$("form").attr("action","<%=request.getContextPath()%>/tmlportal/tml_saveUserDefinedTmlGroupMember.action");
$("form").submit();
}
else{
return false;
}
});
});
//check the input value;
function chkform() {
var selFlag = false;
$("#rightmodel option").each(function(){
if($(this).val() != ""){
// if this value is not null, attr this selected to selected;
$(this).attr("selected","selected");
selFlag = true;
}
});
//
if(!selFlag) {
alert("必须选择一个终端！");
return false;
}
return selFlag;

}
// remove left option to right;
function leftToRight(){
//leftmodel
var leftmodel = document.getElementById("leftmodel");
//rightmodel
var rightmodel = document.getElementById("rightmodel");
if(leftmodel.length>0){
// 判读 有没有被选中一个 option。
var leftSelectedIndex = leftmodel.selectedIndex;
if(leftSelectedIndex<0){
option = leftmodel.options(0);
rightmodel.appendChild(option);
}

if(leftSelectedIndex>=0){
//leftmodel length
var leftLength = leftmodel.length;
var i=0;
for(i;i<leftLength;i++){
if(leftmodel[i].selected){
option = leftmodel.options(i);
rightmodel.appendChild(option);
repeat();
// 当移除 选中时，对象长度减少一个。
leftLength--;
i--;
}

}

}//if leftSelectedIndex>=0

// rightmodel.selectedIndex=-1;
this.repeat();

}// 长度 大于0


}
// remove all left options to right sw
function leftToRightAll(){
var leftmodel = document.getElementById("leftmodel");
var rightmodel = document.getElementById("rightmodel");
while(leftmodel.length>0){
rightmodel.appendChild(leftmodel.options(0));
}
this.repeat();
}
// remove right option to left;
function rightToLeft(){

var leftmodel = document.getElementById("leftmodel");
var rightmodel = document.getElementById("rightmodel");
if(rightmodel.length>0){

var rightSelectedIndex = rightmodel.selectedIndex;
if(rightSelectedIndex<0){
rightSelectedIndex=0;
option = rightmodel.options(rightSelectedIndex);
leftmodel.appendChild(option);
}
if(rightSelectedIndex>=0){
//leftmodel length
var rightLength = rightmodel.length;
var i=0;
for(i;i<rightLength;i++){
if(rightmodel[i].selected){
option = rightmodel.options(i);
leftmodel.appendChild(option);
repeat2();
// 当移除 选中时，对象长度减少一个。
rightLength--;
i--;
}

}
}

// leftmodel.selectedIndex=-1;
this.repeat2();

}// rightmodel.length>0

}
// remove all right options to left;
function rightToLeftAll(){
var leftmodel = document.getElementById("leftmodel");
var rightmodel = document.getElementById("rightmodel");
while(rightmodel.length>0){
leftmodel.appendChild(rightmodel.options(0));
}
repeat2();
}

// remove repets
function repeat(){
var middlemodel = document.getElementById("rightmodel");
var ops=middlemodel.options;
for(var i=0;i<ops.length;i++){
for(var j=i+1;j<ops.length;j++){
if(ops[i].value==ops[j].value){
middlemodel.removeChild(ops[j]);
j=j-1;
}
}
}
}

// remove repets two
function repeat2(){
var middlemodel = document.getElementById("leftmodel");
var ops=middlemodel.options;
for(var i=0;i<ops.length;i++){
for(var j=i+1;j<ops.length;j++){
if(ops[i].value==ops[j].value){
middlemodel.removeChild(ops[j]);
j=j-1;
}
}
}
}

// back
$(function(){
$("#id_back").click(function(){
window.history.back();
});
});

// tml by brand
$("#id_brand").change(function(){
var brandindex = $(this).val();
$.post("<%=request.getContextPath()%>/tmlportal/tml_queryTmlBybrand.action",{brandindex:brandindex},function(data){
var $tmlObj = $("#leftmodel").empty();
$.each(data,function(index,content){
var $terminalindex = content['terminalindex'];
var $terminalmodelname = content['terminalmodelname'];
var option = $("<option value="+$terminalindex+">"+$terminalmodelname+"</option>").appendTo($tmlObj);;
//
// tmlObj.appendChild(option);
});
},'json');
});
// form's history value;
$(document).ready(function(){
var brandindex = $("#brandindexBak").val();
$("#id_brand option[value = "+brandindex+"]").attr("selected","selected");
var status = ${mtmlGroup.status}
$("#id_status option[value = "+status+"]").attr("selected","selected");
//
if(!clearNullOption()){
$("#rightmodel").empty();
}
});
//query by tmlName
$("#query").click(function(){
var terminalmodelname = $("#id_terminalmodelname").val();
$.post("<%=request.getContextPath()%>/tmlportal/tml_queryTmlByName.action",{terminalmodelname:terminalmodelname},function(data){
var $tmlObj = $("#leftmodel").empty();
$.each(data,function(index,content){
var $terminalindex = content['terminalindex'];
var $terminalmodelname = content['terminalmodelname'];
var option = $("<option value="+$terminalindex+">"+$terminalmodelname+"</option>").appendTo($tmlObj);;
});
},'json');
});
// clear form
$("#clear").click(function(){
$("input[name='terminalmodelname']").val('');
});
// 加载时，判断 此终端组 是否有终端，如果没有则将 空的option 给清空了。
function clearNullOption() {
var selFlag = false;
$("#rightmodel option").each(function(){
if($(this).val() != ""){
$(this).attr("selected","selected");
selFlag = true;
}
});
//
if(!selFlag) {
return false;
}
return selFlag;
}
// 回车事件 查询 功能。
// 回车事件 查询 功能。
$(document).keydown(function(e){
if(e.keyCode==13){ //当按键是回车
var act = document.activeElement.id;//获得当前获得焦点控件的ID
switch(act)
{
case 'id_terminalmodelname': $("#query").click(); break;
// default : $("#id_query").click(); break;
}
}
});
</script>