Listbox loses values

[Janaka]

Help! I have two ListBox controls on my web form. The first one gets
populated on entry with values from the DB. I then use JavaScript to copy
options from this ListBox to my second one. (I have also tried changing the
second ListBox to an HtmlSelect control) using bog standard JavaScript code
like so where "used" is the name of my <select> control:

used.options[used.options.length] = new Option(name, typeId);

This all works fine and I can move across the values and names of my items
in the first select box to the second one. The problem is that when I
postback the entire contents of the second select box are lost! Is this a
known problem using ListBoxes? Is there a way around it?

Regards,

Janaka

 

[Karl Seguin]

Janaka:
The reason listboxes (and other controls) maitain their values is because
these values are saved in the viewstate when the page is first rendered to
the client. Since you are populating your 2nd listbox using javascript,
these values are never stored in the viewstate, meaning the listbox can't
automatically be repopulated on postback. You can use the good'ol
Request.Form to get the selected typeId's of the 2nd listbox, or instead of
populating the 2nd listbox in the client, you can do so on the server (by
posting back and doing what you do in javascript in server-code)...but those
are your only choices.

Karl

 

[William F. Robertson, Jr.]

This is not a known problem, or even a problem at all, well, for you it
seems to be.

The server sends the second listbox to the browser with no items in the
collection, and places zero items into ViewState.

Client side you add options to the second list box.

The page posts back with only the value from the second list box.

The second list box control loads its items collection from ViewState
(remember there are zero items).

So there are no items in the second list box. This is the way server side
controls work.

Two ways around it. Either you can post back with each movement of the
item, or post a list of the values from the first list box and on postback
manually move a copy of the items for the lbFirst.Items collection into the
lbSecond.Items collection.

HTH,

bill

 

[Janaka]

That doesn't seem accurate to me Karl. I placed a TextBox on the form as
well and when I used the javascript code to copy items I also got it to
update the text value of the control. This DID retain its value on postback
and was done through client-side script.

Janaka:
The reason listboxes (and other controls) maitain their values is because
these values are saved in the viewstate when the page is first rendered to
the client. Since you are populating your 2nd listbox using javascript,
these values are never stored in the viewstate, meaning the listbox can't
automatically be repopulated on postback. You can use the good'ol
Request.Form to get the selected typeId's of the 2nd listbox, or instead
of
populating the 2nd listbox in the client, you can do so on the server (by
posting back and doing what you do in javascript in server-code)...but
those
are your only choices.

Karl

--
MY ASP.Net tutorials
http://www.openmymind.net/

Help! I have two ListBox controls on my web form. The first one gets
populated on entry with values from the DB. I then use JavaScript to
copy
options from this ListBox to my second one. (I have also tried changing the
second ListBox to an HtmlSelect control) using bog standard JavaScript code
like so where "used" is the name of my <select> control:

used.options[used.options.length] = new Option(name, typeId);

This all works fine and I can move across the values and names of my
items
in the first select box to the second one. The problem is that when I
postback the entire contents of the second select box are lost! Is this
a
known problem using ListBoxes? Is there a way around it?

Regards,

Janaka

 

[Karl Seguin]

Textboxes don't need viewstate to retain their state....that's because they
are single valued controls. When you put text in textbox and submit the
form, the value that was entered in the textbox is available via
Request.Form. When you put a bunch of values in a listbox, and submit the
form, the SELECTED values are available via Request.Form but the other
values are not...in either case, the text of the listbox (Even those
selected) isn't persisted in REquest.Form...

The way it works is

(a) the page is rendered to the browser
(b) Every listitem object is serialized to the viewstate (namely, their
value and text are stored there)
(c) items are selected
(d) the form is submitted

at this point the page framework:
(e) restores all ListItems frm the viewstate
(f) uses Request.Form to see which items were selected
(g) selects the appropriate ListItems


as you can see, Request.Form and viewstate are playing off of each
other....Request.Form is used to track what was selected....Viewstate to
track everything (except you don't know which was selected). The value
entered in a textbox IS the selected value...so all you need is Request.Form
to preserve the state...which, in your example you have...

Hope that cleared it up.
Karl

--
MY ASP.Net tutorials
http://www.openmymind.net/

That doesn't seem accurate to me Karl. I placed a TextBox on the form as
well and when I used the javascript code to copy items I also got it to
update the text value of the control. This DID retain its value on postback
and was done through client-side script.

Janaka:
The reason listboxes (and other controls) maitain their values is because
these values are saved in the viewstate when the page is first rendered to
the client. Since you are populating your 2nd listbox using javascript,
these values are never stored in the viewstate, meaning the listbox can't
automatically be repopulated on postback. You can use the good'ol
Request.Form to get the selected typeId's of the 2nd listbox, or instead
of
populating the 2nd listbox in the client, you can do so on the server (by
posting back and doing what you do in javascript in server-code)...but
those
are your only choices.

Karl

--
MY ASP.Net tutorials
http://www.openmymind.net/

Help! I have two ListBox controls on my web form. The first one gets
populated on entry with values from the DB. I then use JavaScript to
copy
options from this ListBox to my second one. (I have also tried

changing
the

second ListBox to an HtmlSelect control) using bog standard JavaScript code
like so where "used" is the name of my <select> control:

used.options[used.options.length] = new Option(name, typeId);

This all works fine and I can move across the values and names of my
items
in the first select box to the second one. The problem is that when I
postback the entire contents of the second select box are lost! Is this
a
known problem using ListBoxes? Is there a way around it?

Regards,

Janaka

 

[Janaka]

Hi Karl,

Thanks for your response that clears things up, I wish someone could of
explained that to me rather than saying "its the viewstate".

I managed a workaround to get this running. I placed the values comma
delimited into an HTMLInputHidden control and then binding the data back to
the ListBox in Page_Load and the Request.Form took care of what was
selected.

After thinking about it, would it make sense to override the SaveViewstate()
event on the Page and implement some custom code to add the new items to the
ListBox? I haven't tried monkeying about with Viewstate in the past but it
seems to make sense.

Janaka