Question

I’m well versed in ASP.NET WebForms, and was considering switching my code to MVC 3.

I am learning MVC, and have some understanding in it, but, there’s one issue I haven’t come to understand yet.

It goes like this:

With WebForms code, I was able to have a DropDownList, that when selected, would’ve triggered a Button press through Javascript, and that button would’ve triggered a Method that would’ve populated another DropDown, but both DropDown’s were part of the same form, and the actual Button that is visible to the user (and is to be manually pressed by the user) triggers a Method that gets values from both those DropDowns as well as other fields.

The thing is, I don’t know how to do this with MVC. From my current understanding, if I wanted to send form data to the app, it has to follow a Model. That is what makes it so confusing to me (from my current understanding), how do I get the first DropDown to send only the data from inside the first DropDown? Also populating the other dropdown is a little bit of a foggy idea with MVC as well, but especially the point I made about the first DropDown is what makes me confused the most.

If anyone can help me in any way on this it would be greatly appreciated.

Answer 1

The big difference to get your head around here is that there are non of the old style postbacks in ASP.NET MVC.

In this case, you get to be in control of how you obtain the new data for your dropdown box.

When the form is complete and we’re ready to send the data to the server, we’ll be sending it back as a spcific type to our controller method but until that point, we can access the data we need from any other controller method.

Personally I’d use jQuery to do this using an ajax request to a controller method that returns a JsonResult type.

Something like:

$.getJSON("/MyController/GetSecondDropdownValues", function(result) {
 $.each(result, function() {
    $('#mySecondDropdown').append($("<option />").val(this.Name));
});

C#

public JsonResult GetSecondDropdownValues(string initialDropdownValue)
{
   /* Do the work to obtain the values here */
   return Json(returnedValues);
}