根据下拉列表项选择更改MVC中的视图

Question

I have a dropdownlist on a View as:

<p>
@Html.DropDownList("Status", new List<SelectListItem>
    {
    new SelectListItem{ Text = "Show Active", Value = "0" },
    new SelectListItem{ Text = "Show Deleted", Value = "1" }},
    new
         {
             onchange = @"
        var form = document.forms[0];
        form.action='deletedDistricts';
        form.submit();"
         })

and I am referring it to action as:

[HttpPost]
    [ActionName("deletedDistricts")]
    public ActionResult deletedDistricts()
    {
        var d = hc.deletedDistricts.ToList();
        return View(d);
    }

but JavaScript is giving a runtime error as:

0x800a138f - JavaScript runtime error: Unable to set property 'action' of undefined or null reference

I am not very good at JavaScript. Any idea why this code is throwing Null reference?

Answer 1

Well I can't see that you would have a form associated with a dropdown, make sure that it's wrapped with:

@using(Html.BeginForm("deletedDistricts", controllerName, FormMethod.Post)) {
    // drowpdown here
}

And remove

form.action='deletedDistricts';

conrollerName should be name of your controller as a string.

Answer 2

Let's read the error you are getting once again:

0x800a138f - JavaScript runtime error: Unable to set property 'action' of undefined or null reference

OK, now let's read your code once again to see where you are attempting to set an action property. Looks like that's happening right over here:

form.action='deletedDistricts';

Alright, so it seems like the form instance is undefined at this stage. So the obvious next step you would like to look at is where is this form instance coming from. And you wouldn't be surprised to find this line of code of yours:

var form = document.forms[0];

Cool, you seem to be attempting to retrieve the first <form> element in your DOM. But do you have such element? Did you ever use the Html.BeginForm helper to render an HTML form? Answering those simple questions would definitely put you on the right track. Don't hesitate to inspect the markup you are generating in the browser. I am sure this would help you figure out the missing bits.