表单在提交时不执行GET

Question

My model contains:

public class Person
{
    public int Id { get; set; }
    public string Name { get; set; }
}

My controller contains:

public ActionResult Index(int? personId)
{
    var people = db.People; // all people in my database
    ViewBag.People = new SelectList(people, "Id", "Name", personId);
    return View();
}

My view contains:

@using (Html.BeginForm(null, null, FormMethod.Get, new { @class = "form-inline" }))
{
    @Html.DropDownList("personId", ViewBag.People as SelectList, "All people", new { @class = "form-control select-submit" })
}

And I have this piece of Javascript:

<script type="text/javascript">
    (function ($) {
        $(".select-submit").change(function () {
            $(this).parents("form").submit();
            alert("form submitted!");
        });

    })(jQuery);
</script>

When I select a person from the DropDownList , I see the alert popup, and the page refreshes. When I select the default option ( "All People" ), I also see the popup, but the page does not refresh.

I want "personId" to be set to "" on selecting the default option. How can I achieve this?

Answer 1

Ah, I found it. After inspecting the html, I noticed the form was using data validation. These html attributes were getting added after selecting a person:

data-val="true" data-val-number="The field Int32 must be a number." data-val-required="The Int32 field is required."

The form couldn't be submitted because "" is not valid for an Int32 . Adding this html attribute to the DropDownList solved it:

data_val = false