HELP!!! JavaScript client and server side DropDownList

[Shawshank]

I am nearly desperate. Hope anyone of you can help.

In my web application, I need to use several interdependent DropDownLists,
which means contents and selections of one dropdownlist depends on slection
in another. Initially I used server side OnSelectionChange event handler of
one dropdownlist to populate the other dropdownlist . it workded well
functionally but the postback is really distracting.
So I used client side javascript to populate the client control of the
dropdownlist (( of course with a little pain by getting the ClientId on
server side and pass it to the Javascript so that JS knows which control to
insert options). It worked fine on the client side, but the server cannot
pick up the changes (new Items, and SelectedValue, SelectedIndex, etc. It
seems server is ignoring any change JavaScript makes. ) user made on the
client after user click "submit".

I have been stuck on this for two days, and please help!

Thanks!

 

[John Saunders]

I am nearly desperate. Hope anyone of you can help.

In my web application, I need to use several interdependent DropDownLists,
which means contents and selections of one dropdownlist depends on
slection in another. Initially I used server side OnSelectionChange event
handler of one dropdownlist to populate the other dropdownlist . it
workded well functionally but the postback is really distracting.
So I used client side javascript to populate the client control of the
dropdownlist (( of course with a little pain by getting the ClientId on
server side and pass it to the Javascript so that JS knows which control
to insert options). It worked fine on the client side, but the server
cannot pick up the changes (new Items, and SelectedValue, SelectedIndex,
etc. It seems server is ignoring any change JavaScript makes. ) user made
on the client after user click "submit".

I have been stuck on this for two days, and please help!

If you turn on page tracing, and look at the values posted back by the form,
you'll notice that the added values are not posted back. In fact, HTML never
posts back anything from a <select> other than the selected value. There's
nothing for the server side to look at.

The only workaround to this is to put the added stuff somewhere the server
side _can_ see. For instance, you can create a hidden input field and put
the added values there. The server side can then look in the hidden field
(which will be posted back) to see what got added.


The other thing you may be able to do depending on the nature of your data
is to send all of the possible values to the client side and to allow the
client side to choose which values will be used. As an example, I once had a
dropdownlist of US states and one of Canadian provinces, and displayed one
or the other (or neither) depending on the Country chosen in another
dropdown list.

John Saunders

 

[aidan.s.marcuss]

Another possibility is that you are running into the same problem I
had: the events are very sensitive to the ViewState of the control.
Many of them depend on not only the Form data but the ViewState data.
For example, if you disable ViewState for the drop down, the drop down
will cause a post back, but the SelectedIndexChange event will never
fire, because it would appear to need the ViewState to check and see if
the index has really changed since the last time it was posted back.

Additionally, if you leave ViewState turned on you can encounter
problems. I had to write a page that had 4 drop downs. Each one
controls the list of possible things for the next. I use client-side
web services to fill in each dependent drop down after its parent has
been changed (I've also got a web control which encapsulates the
JScript to do so - I would suggest considering something similar). The
last drop down posts back and reloads a list on the page (as well as
all of the other drop downs, only server side this time). I ran into a
problem where if I changed the one of the parents, and then worked back
to the point where I was going to select the same item in the last one,
the post back would occur but the SelectedIndexChanged event wouldn't
fire - because it really is too smart - the value hadn't changed and it
determined this by comparing ViewState and Form data. I got around this
by adding a check in the Page_Load event to see what ID was in the
__EVENTTARGET form element, and then comparing that to the ID of the
last drop down - I would then manually load the list.
Hope this helps,
Aidan