Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Trình đơn xổ dọc » Thêm các mục chọn vào listbox
URL: https://www.javascriptbank.com/user-management.html
Hiệu ứng có thể thêm các item do người dùng chọn vào một listbox, các item này người dùng có thể tự đặt được.
Phiên bản đầy đủ: jsB@nk » Biểu mẫu » Trình đơn xổ dọc » Thêm các mục chọn vào listbox
URL: https://www.javascriptbank.com/user-management.html
<SCRIPT LANGUAGE="JavaScript">// Sergei Kouzminiov ([email protected])<!-- Beginvar delimiter = ":";function MoveOption (MoveFrom, MoveTo, ToDo) { var SelectFrom = eval('document.main_form.'+MoveFrom); var SelectTo = eval('document.main_form.'+MoveTo); var SelectedIndex = SelectFrom.options.selectedIndex; var container; if (ToDo=='Add') { container=eval('document.main_form.'+ToDo+MoveTo); } if (ToDo=='Remove') { container=eval('document.main_form.'+ToDo+MoveFrom); } if (SelectedIndex == -1) { alert("Please select a person(s) to move."); } else { for (i=0; i<SelectFrom.options.length; i++) { if(SelectFrom.options[i].selected) { var name = SelectFrom.options[i].text; var ID = SelectFrom.options[i].value; SelectFrom.options[i] = null; SelectTo.options[SelectTo.options.length]=new Option (name,ID); i=i-1; if(ToDo=='Add'||ToDo=='Remove') { container.value=container.value+name+delimiter; //container.value=container.value+ID+delimiter; } } }}}function CheckDuplicates (AddListContainer, RemoveListContainer) {var AddList = eval('document.main_form.'+AddListContainer);var RemoveList = eval('document.main_form.'+RemoveListContainer);var TempAddList = AddList.value;var TempRemoveList = RemoveList.value;if (TempAddList>''&&TempRemoveList>'') { TempAddList = TempAddList.substring(0,TempAddList.length-1); TempRemoveList = TempRemoveList.substring(0,TempRemoveList.length-1); var AddArray = TempAddList.split(delimiter); var RemoveArray = TempRemoveList.split(delimiter); for (i=0; i<AddArray.length; i++) { for (j=0; j<RemoveArray.length; j++) { if (AddArray[i]==RemoveArray[j]) { AddArray[i]=''; RemoveArray[j]=''; break; } } } AddList.value=''; for (i=0; i<AddArray.length; i++) { if (AddArray[i]>'') { AddList.value = AddList.value + AddArray[i] + delimiter; } } RemoveList.value=''; for (i=0; i<RemoveArray.length; i++) { if (RemoveArray[i]>'') { RemoveList.value = RemoveList.value + RemoveArray[i] + delimiter; } }}}function LockChanges() {CheckDuplicates('AddAdmins','RemoveAdmins');CheckDuplicates('AddUsers','RemoveUsers');}// End --></script><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->
<table align="center"><tr><td><FORM name=main_form action="" method=post><INPUT type=hidden name=AddAdmins><INPUT type=hidden name=RemoveAdmins> <INPUT type=hidden name=AddUsers> <INPUTtype=hidden name=RemoveUsers><div align="center"><table cellspacing="0" cellpadding="5" border="0"><tbody><tr><td valign="top" align="middle" rowspan="2">Employees<br><select multiple size="12" name="Employees"><option>Employee_01<option>Employee_02<option>Employee_03<option>Employee_04<option>Employee_05<option>Employee_06<option>Employee_07<option>Employee_08<option>Employee_09<option>Employee_10</option></select></td><td><p align="center"><input onclick="MoveOption('Employees','Admins','Add');" type="button" value="Admin >>" name=add_admin></p><p align="center"><input onclick="MoveOption('Admins','Employees','Remove');" type="button" value="<< Admin" name="remove_admin"></p></td><td valign="top" align="middle">Administrators<br><select multiple size="5" name="Admins"><option>Admin_01<option>Admin_02<option>Admin_03<option>Admin_04<option>Admin_05</option></select></td></tr><tr><td><p align="center"><input onclick="MoveOption('Employees','Users','Add');" type="button" value=" User >> " name=add_user></p><p align="center"><input onclick="MoveOption('Users','Employees','Remove');" type="button" value=" << User " name="remove_user"></p></td><td valign="top" align="middle">Users<br><select multiple size="5" name="Users"><option>User_01<option>User_02<option>User_03<option>User_04<option>User_05</option></select></td></tr></tbody></table></div></FORM></td></tr><tr><td><div align="center"><input onclick="LockChanges();" type="button" value="Submit"></div><BR><div align="center">Click on "Submit" button to lock all changes<BR>and save results in appropriate hidden fields.<BR>To browse content click below on field's name:</div><BR><div align="center"><a href="javascript:alert(document.main_form.AddAdmins.value);">Add Admins</a><br><a href="javascript:alert(document.main_form.RemoveAdmins.value);">Remove Admins</a><br><a href="javascript:alert(document.main_form.AddUsers.value);">Add Users</a><br><a href="javascript:alert(document.main_form.RemoveUsers.value);">Remove Users</a></div></td></tr></td></tr></table><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->