Hi, I posted this in another forum, and I am hopping I'll get more response here.
I have two list boxes that I use for dual list box functionality, and there are four buttons that allow movement of the items from one box to another. All this is performed using javascript functions attached to buttons those 4 buttons. There is one more button that is supposed to get values from the right box and print reports. All controls are in update panel. In Pre-Reneder method I am checking to see if there are any items in the right box, and there aren't ever any. Is there something that I need to do so state of the controls would be maintained?
Here is the javascript
function MoveDualList( srcListId, destListId, moveAll ){
var srcList = document.getElementById(srcListId);
var destList = document.getElementById(destListId);// Do nothing if nothing is selected
if ( ( srcList.selectedIndex == -1 ) && ( moveAll ==false ) ){
return;}
newDestList =new Array( destList.options.length );var len = 0;
for( len = 0; len < destList.options.length; len++ ){
if ( destList.options[ len ] !=null ){
newDestList[ len ] =new Option( destList.options[ len ].text, destList.options[ len ].value, destList.options[ len ].defaultSelected, destList.options[ len ].selected );}
}
for(var i = 0; i < srcList.options.length; i++ ){
if ( srcList.options[i] !=null && ( srcList.options[i].selected ==true || moveAll ) ){
// Statements to perform if option is selected
// Incorporate into new list
newDestList[ len ] =new Option( srcList.options[i].text, srcList.options[i].value, srcList.options[i].defaultSelected, srcList.options[i].selected );len++;
}
}
// Populate the destination with the items from the new array
for (var j = 0; j < newDestList.length; j++ ){
if ( newDestList[ j ] !=null ){
destList.options[ j ] = newDestList[ j ];
}
}
// Erase source list selected elements
for(var i = srcList.options.length - 1; i >= 0; i-- ){
if ( srcList.options[i] !=null && ( srcList.options[i].selected ==true || moveAll ) ){
// Erase Source
srcList.options[i] =null;}
}
//sort destinantion list box
SortListBox(destList,compareText)
}// End of moveDualList()
function compareText (opt1, opt2){
return opt1.text.toLowerCase() < opt2.text.toLowerCase() ? -1 :opt1.text.toLowerCase() > opt2.text.toLowerCase() ? 1 : 0;
}
function SortListBox (pListBox, compareFunction){
if (!compareFunction){
compareFunction = compareText;
}
var options =new Array (pListBox.options.length);for (var i = 0; i < options.length; i++){
options[i] =new Option ( pListBox.options[i].text,pListBox.options[i].value,
pListBox.options[i].defaultSelected,
pListBox.options[i].selected );
}
options.sort(compareFunction);
pListBox.options.length = 0;
for (var i = 0; i < options.length; i++){
pListBox.options[i] = options[i];
}
}
Hi,
ListBoxes do not post their values when HTML form is submitted. ListBoxes do only post their selected values. Therefore, any items added to the list box on the client are not available on the server. Your page restores list boxes from the viewstate encoded in the hidden field at the server and it doe not know anything about changes made to your listboxes on the lcient.
As a simple solution, I can suggest you placing a hidden field for your list box on the client and every time you change list box on the client, place a comma separated list of value into that hidden field. Then at the server, you can retrieve coma seperated list of values and populate your list (if you still need to render the same page) or process items.
-yuriy
http://couldbedone.blogspot.com
