Tenzin kabsang

So I needed to implement a drop down list in my project and dynamically change the values and the action of this drop down asynchronously.  First I used the code based approach to fill the drop down list with default values/actions and then based on certain selectors on the page changed its values/actions using jQuery.

So here I am calling an Action Method that returns a collection of JSON data with ID and Name properties for a Person.    Then I select my drop-down list  and remove all of its previous values, finally loop through ‘each’ returned value and populate new option parameter with it.  The action method for this $getJSON call is as follows:

One thing to note here is the “JsonRequestBehavior.AllowGet” is necessary and if you don’t put it, your code will still run but won’t send any data.  This is the default behavior for security reasons and thus by explicitly stating “AllowGet” you are taking responsibility and telling the framework that you are aware of it. 

Now to attach the action functionality when they select a value from the drop-down list use the following script:

In this case every time the user selects a new person I am outputting a list of cars they have.  And here is the method that handles this call:

Just like in the previous method I am allowing this action method to send JSON data for HTTP GET request.  – Don’t forget (JsonRequestBehavior.AllowGet)

And finally I have a working drop-down list that works asynchronously