CheckBox always returns null in ASP.NET MVC

Question

When clicking on the checkbox, form is submitted using jQuery, but checkbox always return null.

I have the following Razor code:

@using (Html.BeginForm("Index", "HumanResource", new { type = ViewBag.CurrentType }, FormMethod.Post, new { id = "form1" }))
{
 <label class="custom-control custom-checkbox" for="Filter">
        @Html.CheckBox("Filter", new { @class = "custom-control-input" })
        <span class="custom-control-indicator"></span>
        Choose
 </label>
}

// Scripts

<script>
$('#form1 :checkbox').change(function() {
            $("#form1").submit();
   });
</script>

Controller

public async Task<ActionResult> Index(FormCollection fc,int? Filter)
{
    // leftFilter is always null
}

@Andrei I didn't have problem regarding if it's boolean or not, after I changed theme's files, that's happened. — Hisham Aburass
– Hisham Aburass, Commented Aug 13, 2018 at 14:28
That is exactly your problem, when model binder cannot parse the value it sets variable to null instead. 'true' and 'false' cannot be parse to int — Andrei
– Andrei, Commented Aug 13, 2018 at 15:19

Shyju · Accepted Answer · 2018-08-13 14:55:48Z

3

When the form is submitted, the browser will send either true or false for filter input in form data, to the form action URL( the action method which handles the form submit). You are using a nullable int(int?) as the parameter to accept the value of filter. The model binder cannot map a boolean value to a nullable int. How does it know what value to assign in the numeric parameter for true /false ? It can map the incoming boolean value to only a boolean parameter.

So change your parameter type to bool.

[HttpPost]
public async Task<ActionResult> Index4(FormCollection fc, bool filter)
{
    //to so : return something
}

Now when the form is submitted, the filter parameter will be populated with a value.

Suggestion: Submitting a form when user clicks on the checkbox seems like a bad user experience IMHO, what if user wants to change ? How about adding a separate "search" button and submit the form when user clicks on that after making the checkbox selections ? Or perhaps consider some client side/ajax sort of filtering.

answered Aug 13, 2018 at 14:55

Shyju

220k106 gold badges421 silver badges499 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Joshua K Over a year ago

I agree with @Shyju about the checkbox being used for submitting the form. It's bad UX.

Collectives™ on Stack Overflow

CheckBox always returns null in ASP.NET MVC

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related