Javascript implements the listbox left and right movement implementation code

1. Html section:
Copy codeThe Code is as follows:
<Table cellSpacing = "0" borderColorDark = "# ffffff" cellPadding = "3" width = "460"
Align = "left" borderColorLight = "#000000" border = "1">
<Tr bgColor = "# cccccc">
<Td align = "center" width = "180"> <B> all regions </B> <asp: hiddenField ID = "HidDistrictId" runat = "server"/> </td>
<Td align = "center" width = "60"> </td>
<Td align = "center" width = "180"> <B> selected region </B> </td>
</Tr>
<Tr>
<Td bgcolor = "# cccccc" style = "height: 200px; width: 180px;">
<Asp: listbox id = "listNewEmp" runat = "server" Height = "200px" Width = "180px" SelectionMode = "Single"> </asp: listbox> </td>
<Td valign = "top" align = "center" bgcolor = "# cccccc" style = "height: 200px; width: 60px;">
<Asp: Panel ID = "Panel1" runat = "server" Height = "180px">
<Br>
<% -- <Asp: Button style = "WIDTH: 48px; HEIGHT: 24px; font-family: "" Text = "→" ID = "btnReceSendToRight" runat = "server" OnClick = "btnReceSendToRight_Click"/> -- %>
<INPUT type = "button" value = "→" onclick = "add ('listnewemp', 'listright', 'hiddistrictid ') "Text =" select → "style =" WIDTH: 48px; HEIGHT: 24px; font-family: ">
<Br>
<Br>
<INPUT type = "button" value = "inline Delete" onclick = "move ('listright')" style = "WIDTH: 48px; HEIGHT: 24px; font-family: "" Text = "← Delete">
<% -- <Asp: Button style = "WIDTH: 48px; HEIGHT: 24px; font-family: "" Text = "← Delete" ID = "btnReceSendToLeft" runat = "server" OnClick = "btnReceSendToLeft_Click"/> -- %>
</Asp: Panel>
</Td>
<Td bgcolor = "# cccccc" style = "height: 200px;">
<Asp: listbox id = "listright" runat = "server" Height = "200px" Width = "180px" SelectionMode = "Multiple"> </asp: listbox>
</Td>
</Tr>
</Table>

2. Javascript section:
Copy codeThe Code is as follows:
<Script language = "Javascript">
Function add (sourlist, deslist, hidId)
{// Add
Var objres = document. getElementById (sourlist );
Var objsel = document. getElementById (deslist );
Var customOptions;
For (var I = objres. options. length-1; I> = 0; I --)
{
If (objres. options [I]. selected)
{
CustomOptions = document. createElement ("OPTION ");
CustomOptions. text = objres. options [I]. text;
CustomOptions. value = objres. options [I]. value;
If (objsel. options. length> 0)
Objsel. remove (objsel. options. length-1 );
Document. getElementById (hidId). value = customOptions. value;
Objsel. add (customOptions, 0 );
}
}
Return false;
}
Function move (deslist) {// Delete
Var objres = document. getElementById (deslist );
Objres. remove (objres. options. length-1 );

}
</Script>


3 .. Cs Section
Storage is the Value stored in HidDistrictId. Value. The specific part is adjusted when used.
4. :