Try this example:
<title>Untitled Page</title>
<script type="text/javascript">
/*
- Function MoveItems()
- Direction: Specifies direction i.e. L = Left, R = Right
- All: Move All items 1 = All, 0 = Selected
*/
function MoveItems(Direction, All)
{
var LstLeft;
var LstRight;
var Removed = '';
var i;
if (Direction == 'R')
{
var LstLeft = document.getElementById("<%=LstLeft.ClientID %>");
var LstRight = document.getElementById("<%=LstRight.ClientID %>");
}
else
{
var LstLeft = document.getElementById("<%=LstRight.ClientID %>");
var LstRight = document.getElementById("<%=LstLeft.ClientID %>");
}
for (i=0; i<LstLeft.length; i++)
{
if (LstLeft.options[i].selected || All == 1)
if(ItemExists(LstRight, LstLeft.options[i].value) == 0)
{
LstRight[LstRight.length] = new Option(LstLeft.options[i].text, LstLeft.options[i].value, true);
Removed = Removed + LstLeft.options[i].value + ',';
}
}
RemoveFromList(LstLeft, Removed);
return false;
}
function RemoveFromList (Lst, Items)
{
var Removed = Items.split(',');
var j;
var x;
for (j=0; j<Removed.length; j++)
{
for (x=0; x<Lst.length; x++)
{
if (Lst.options[x] != null && Lst.options[x].value == Removed[j])
{
Lst.options[x] = null;
}
}
}
}
function ItemExists(Lst, value)
{
var Flag = 0;
var i = 0;
for (i=0; i<Lst.length; i++)
{
if (Lst.options[i].value == value)
{
Flag = 1;
break;
}
}
return Flag;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ListBox ID="LstLeft" runat="server" SelectionMode="multiple" Width="200px" Rows="5" >
<asp:ListItem Value="0" Text="Farhan"></asp:ListItem>
<asp:ListItem Value="1" Text="Moin"></asp:ListItem>
<asp:ListItem Value="2" Text="Haroon"></asp:ListItem>
<asp:ListItem Value="3" Text="Khurram"></asp:ListItem>
<asp:ListItem Value="4" Text="Mansur"></asp:ListItem>
</asp:ListBox>
<asp:ListBox ID="LstRight" runat="server" SelectionMode="multiple" Width="200px" Rows="5">
</asp:ListBox>
<br />
<asp:Button ID="BtnRight" runat="server" Text=">" OnClientClick="return MoveItems('R', 0);" />
<asp:Button ID="BtnLeft" runat="server" Text="<" OnClientClick="return MoveItems('L', 0);"/>
<asp:Button ID="BtnRightAll" runat="server" Text=">>" OnClientClick="return MoveItems('R', 1);" />
<asp:Button ID="BtnLeftAll" runat="server" Text="<<" OnClientClick="return MoveItems('L', 1);" />
</div>
</form>
</body>
</html>
Good Luck
Good blog and wonderful articles!
Comment by Lance Zhang — December 25, 2008 @ 4:45 am
Thank you Lance Zhang for your comment and hope this blog can help
Best Regards
Comment by yasserzaid — December 25, 2008 @ 8:18 am