Move a value from one list to another using javascript and then read the value using C #

Question

I have two lists (listbox 1 and listbox2). I used the following javscript code to move a value from one list to another.

<script language="javascript" type="text/javascript"> function fnMoveItems(lstbxFrom,lstbxTo) { var varFromBox = document.all(lstbxFrom); var varToBox = document.all(lstbxTo); if ((varFromBox != null) && (varToBox != null)) { if(varFromBox.length < 1) { alert('There are no items in the source ListBox'); return false; } if(varFromBox.options.selectedIndex == -1) // when no Item is selected the index will be -1 { alert('Please select an Item to move'); return false; } while ( varFromBox.options.selectedIndex >= 0 ) { var newOption = new Option(); // Create a new instance of ListItem newOption.text = varFromBox.options[varFromBox.options.selectedIndex].text; newOption.value = varFromBox.options[varFromBox.options.selectedIndex].value; varToBox.options[varToBox.length] = newOption; //Append the item in Target Listbox varFromBox.remove(varFromBox.options.selectedIndex); //Remove the item from Source Listbox } } return false; } </script> 

This code moves the value from one list to another, but actually, when I try to read the values ​​of the second list, the one for which the values ​​are copied, I can not read these values. when I check this, it shows that ListBox2.Items.Count is 0

Answer 1

As Amar Palsapure noted in the comments, changes to clientide with javascript do not reflect on the server side without any hacking on your part (add values ​​to hidden fields, etc. see here ), so you won’t be able to see the server with the changes. I assume that the ListBox2.Items.Count line is server-side.

It would be much better and easier for you if you execute an ajax request and do it on the server side in the update panel.

Answer 2

Make sure you do not overwrite the values ​​on page load by placing the list setting code in the if statement, making sure that this is not a postback.

Answer 3

The server-side process (C) cannot be read from the client, without an HTTP request - reloading the page (which is probably not what you want to do). Your javascript looks good, but you probably need to use the AJAX technique, which allows your client code to talk to your server code without reloading the page in the traditional HTTP request model.

Try using the jQuery library to help customize your server request. http://api.jquery.com/jQuery.ajax/

Answer 4

As suggested by TBohnen.jnr, I recommend using the update panel and then Asynchrounous Postback Trigger to update the update panel. You will need to place the list fields inside the panel, and then add the event that you raise when moving content.