Using JSON or postback method?

Question

I need to develop a page which has 2 dropdownlist.

Options of dropdownlist 2 are based on selection of dropdownlist 1.

I have 2 methods to change the dropdownlist 2. What will you choose?

1: Postback when users select dropdownlist 1 and change dropdownlist 2.
Pros:
Can use the postback feature, can use the asp.net validator
Cons:
Need to communicate with server (more traffic)
Users will see the page loading in the status bar.

2:
Get all the data (not very much data) in a JSON object when loading the page and change the dropdownlist 2 using javascript.
Pros:
Don't need to communicate with server(less traffic)
Cons:
Can't use the postback feature and validator and more troublesome to write server validation.

Also, I usually write the JSON object to the page as follows:

var locations = <asp:Literal runat="server" id="litLocation" text="[]" />

And then set the "litLocation" in page_load after the data is processed by datacontractjsonserializer. Do you do it in the same way?

Answer 1

Why not have your javascript call the server when the select box is clicked on, using a GET method, and fill in the select box, using json as the response, then, when an option is picked then fill in the second select box with another ajax request.

This would be scalable, in that if you want to add more options you just change the server, and everything is centralized.

You will need to validate when the form is submitted anyway, as it is possible to change a value of a form to something illegal using some debugging tools, such as Firebug, so never trust anything from a webpage until you have validated it.

So, no point worrying about the validation until the form is actually submitted.

Answer 2

I prefer the second option, no need to reload the whole page just to refresh one dropdown list. I'd also do the client side dev in jQuery, much easier. You can do the client side validation for the change event of the first dropdown in jQuery as well, and keep the form submit validation in ASP.NET.

Have a look at the selectChain plugin for jQuery (demo's etc here).