ListBox problem in ASP.NET

May be it's the same question i have i asked before but the issue is the same and i didn't find any resolution so i have to write it again with the expectation that it would be solved this time. My question is i am using two list boxes and one list box is populated by putting the list the list item tag in listBox1 on aspx page and i want to implement functionality like add and remove between two list boxes i mean removing an i开发者_C百科tem from listBox1 should be added to second and removing an item from second should be added to first. While i tried my own but the problem is that on post back it come to same condition. I have implemented the add remove functionality by using the jQuery but the problem is that on post back it come to same condition so i want a good solution for this ow should i implement this so that on post back it retain it's value please ris me off from this issue. I found some solutions for this on Google that i should make some other class which will extend ListBox base class but i couldn't understand that and how should i code for that so please explain me that code if possible.

No jQuery involved, but all the swapping takes place on the client, any moved item will still be moved after a postback.

<select id="ListBox1" name="ListBox1" runat="server" size="5" >
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
<br />
<input class="button" onclick="moveSelectedItems(document.getElementById('ListBox1'), document.getElementById('ListBox2'));"                                         type="button" value="<"/>&nbsp;<br/>
<input class="button" onclick="moveSelectedItems(document.getElementById('ListBox2'), document.getElementById('ListBox1'));"                                         type="button" value=">"/><br/>
<select id="ListBox2" name="ListBox2" runat="server" size="5">
<option>a</option>
<option>b</option>
<option>c</option>
<option>d</option>
<option>e</option>
</select>
<asp:HiddenField runat="server" ID="ListOneHiddenField" />
<asp:HiddenField runat="server" ID="ListTwoHiddenField" />

<script type="text/javascript">
function moveSelectedItems(oListFrom, oListTo) 
{
        var oNewOption;

        // Move the item from one list to another
        oNewOption = document.createElement("OPTION");
        oListTo.options.add(oNewOption);
        oNewOption.innerText = oListFrom.options(oListFrom.selectedIndex).innerText;
        oNewOption.value = oListFrom.options(oListFrom.selectedIndex).value;
        oListFrom.options.remove(oListFrom.selectedIndex);

        // Persist the pipe-separated set of items in each listbox to a hidden field
        document.getElementById('ListOneHiddenField').value = "";

        for (var j = 0; j < document.getElementById('ListBox1').options.length; j++)
            document.getElementById('ListOneHiddenField').value += document.getElementById('ListBox1').options(j).value + "|";

        document.getElementById('ListTwoHiddenField').value = "";

        for (var j = 0; j < document.getElementById('ListBox2').options.length; j++)
            document.getElementById('ListTwoHiddenField').value += document.getElementById('ListBox2').options(j).value + "|";
}
</script>


protected void Page_Load(object sender, EventArgs e)
{
    string[] listItems;

    if (IsPostBack)
    {
        // Clear the ListBox
        ListBox1.Items.Clear();

        // Split the set of items into an array
        listItems = ListOneHiddenField.Value.Split("|".ToCharArray());

        // Rebuild the set of list items
        foreach (string listItem in listItems)
        {
            if (!string.IsNullOrEmpty(listItem))
            {
                ListBox1.Items.Add(new ListItem(listItem, listItem));
            }
        }

        // Rinse and repeat
        ListBox2.Items.Clear();

        listItems = ListTwoHiddenField.Value.Split("|".ToCharArray());

        foreach (string listItem in listItems)
        {
            if (!string.IsNullOrEmpty(listItem))
            {
                ListBox2.Items.Add(new ListItem(listItem, listItem));
            }
        }
    }
}