Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Trình đơn xổ dọc » Di chuyển giữa hai danh sách
URL: https://www.javascriptbank.com/passing-and-sorting-values-between-lists.html
Hiệu ứng JavaScript này có chức năng di chuyển">di chuyển các giá trị giữa hai danh sách listbox.
Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Trình đơn xổ dọc » Di chuyển giữa hai danh sách
URL: https://www.javascriptbank.com/passing-and-sorting-values-between-lists.html
<SCRIPT language=Javascript>// Author: Dmitry Shkolnik<!-- function ClearList(OptionList, TitleName) { OptionList.length = 0; } function move(side){ var temp1 = new Array(); var temp2 = new Array(); var current1 = 0;var current2 = 0; var attribute;//assign what select attribute treat as attribute1 and attribute2 if (side == "right"){ attribute1 = document.rep.left; attribute2 = document.rep.right;}else{ attribute1 = document.rep.right; attribute2 = document.rep.left; }//fill an array with old valuesfor (var i = 0; i < attribute2.length; i++){ temp1[current1++] = attribute2.options[i].value;}//assign new values to arraysfor (var i = 0; i < attribute1.length; i++){ if ( attribute1.options[i].selected ) { temp1[current1++] = attribute1.options[i].value;}else{ temp2[current2++] = attribute1.options[i].value;}}//generating new options for (var i = 0; i < temp1.length; i++) { attribute2.options[i] = new Option(); attribute2.options[i].value = temp1[i]; attribute2.options[i].text = temp1[i]; }//generating new optionsClearList(attribute1,attribute1);if (temp2.length>0){ for (var i = 0; i < temp2.length; i++) { attribute1.options[i] = new Option(); attribute1.options[i].value = temp2[i]; attribute1.options[i].text = temp2[i]; }}if (side == "right") {sort('R')} else {sort('L')}}function sort(side) {var iRowInsertRow, iRowWalkRow, current, insert;if (side =='L') { for ( iRowInsert = 0 + 1 ; iRowInsert <= document.all.left.length-1;iRowInsert++ ) {textRowInsert = document.all.left.options[iRowInsert].text;for ( iRowWalk = 0; iRowWalk <= iRowInsert ; iRowWalk++ ){textRowCurrent = document.all.left.options[iRowWalk].text;// We save our values so we can manipulate the numbers for// comparisoncurrent = textRowCurrent;insert = textRowInsert;// If the value is not a number, we sort normally, else we evaluate// the value to get a numeric representation//But first we check if value is not an empty space.if (current.charAt(0) != " " && insert.charAt(0) != " ") {if (!isNaN(current) && !isNaN(insert)){current= eval(current);insert= eval(insert);}else{current= current.toLowerCase();insert= insert.toLowerCase();}}if ((insert < current) && (iRowInsert != iRowWalk) && (document.all.left.options[iRowWalk].value != 'null') ){var optionWName = new Option( document.all.left.options[iRowWalk].text,document.all.left.options[iRowWalk].value, false, false );var optionIName = new Option( document.all.left.options[iRowInsert].text,document.all.left.options[iRowInsert].value, false, false );document.all.left.options[iRowInsert] = optionWName;document.all.left.options[iRowWalk] = optionIName;}} } } else {for ( iRowInsert = 0 + 1 ; iRowInsert <= document.all.right.length-1; iRowInsert++ ){textRowInsert = document.all.right.options[iRowInsert].text;for ( iRowWalk = 0; iRowWalk <= iRowInsert ; iRowWalk++ ){textRowCurrent = document.all.right.options[iRowWalk].text;//// We save our values so we can manipulate the numbers for// comparison//current = textRowCurrent;insert = textRowInsert;// If the value is not a number, we sort normally, else we evaluate// the value to get a numeric representation// But first we check if value is not an empty space.if (current.charAt(0) != " " && insert.charAt(0) != " ") {if (!isNaN(current) && !isNaN(insert)){current= eval(current);insert= eval(insert);}else{current= current.toLowerCase();insert= insert.toLowerCase();}} if ((insert < current) && (iRowInsert != iRowWalk) && (document.all.right.options[iRowWalk].value != 'null') ) {var optionWName = new Option( document.all.right.options[iRowWalk].text,document.all.right.options[iRowWalk].value, false, false );var optionIName = new Option( document.all.right.options[iRowInsert].text,document.all.right.options[iRowInsert].value, false, false );document.all.right.options[iRowInsert] = optionWName;document.all.right.options[iRowWalk] = optionIName; }} }}}//--></SCRIPT><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
<BODY onload="sort('L')"><FORM name=rep method=post><TABLE> <TBODY> <TR> <TD><SELECT style="WIDTH: 150px" multiple size=5 name=left width="150px"> <OPTION value=UCLA>UCLA</OPTION> <OPTION value=LAPL>LAPL</OPTION> <OPTION value=SMPL>SMPL</OPTION> <OPTION value=Burbank>Burbank</OPTION> <OPTION value=Tarzana>Tarzana</OPTION> <OPTION value=Encino>Encino</OPTION></SELECT></TD> <TD><INPUT onclick="move('right')" type=button value=">>"><BR><INPUT onclick="move('left')" type=button value="<<"></TD> <TD><SELECT style="WIDTH: 150px" multiple size=5 name=right width="150px"></SELECT></TD></TR></TBODY></TABLE></FORM></BODY><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->