Rendering Nullable Bool as CheckBox

问题:

I'm new from WebForms to MVC. I have view model field with the type bool? and, by default, EditorFor() renders this field as a DropDownList with a "Not Set" option. I would prefer to render it as a CheckBox and, if the value is null, just set it to unchecked.

The field name is RFP.DatesFlexible and so I wrote the following markup in my view:

<input type="checkbox" id="RFP_DatesFlexible" name="RFP.DatesFlexible" />
<label for="RFP_DatesFlexible">My Dates are Flexible</label>

But this doesn't work. The result is always null and ModelState.IsValid is false.

Can anyone say how I could make this work?

EDIT

This is the code I ended up with, which appears to work fine.

@Html.CheckBox("RFP.DatesFlexible", Model.RFP.DatesFlexible ?? false)
@Html.Label("RFP.DatesFlexible", "My Dates are Flexible")

The label is correctly associated with the checkbox so that clicking the text will toggle the checkbox.

回答1:

Something like this?

Models:

public class MyViewModel
{
    public ViewModel2 RDP { get; set; }
}

public class ViewModel2
{
    public bool? DatesFlexible { get; set; }
}

Controller:

    public ActionResult TestBool()
    {
        return View(new MyViewModel { RDP = new ViewModel2() });
    }

    [HttpPost]
    public ActionResult TestBool(MyViewModel vm)
    {
        return View();
    }

View:

@model mvc_testing_2.Models.MyViewModel

@using (Html.BeginForm())
{
    @Html.CheckBox("RDP.DatesFlexible", 
        Model.RDP.DatesFlexible != null && (bool)Model.RDP.DatesFlexible)

    <input type="submit" value="go" />
}

回答2:

First, I think it would help to understand how Html.CheckBox works. It's not quite what you'd expect. Take a look at HTML.CheckBox Behaviour

To answer your question, the reason your code doesn't work is because your <input /> requires a value='true' to bind correctly. For example:

<input type='checkbox' name='RFP.DatesFlexible' value='true' />

And add a checked='checked' property if it should be checked.

That's why I usually override the Html.CheckBoxmethod with my own. The default implementation is just confusing.

回答3:

I know it's marked as accepted however I had the similar problem but I was iterating over sub items so I had problem with the name parameter bool? isOpen

When I used this is did bind to the ViewModel on post but rendered the dropdown:

@Html.EditorFor(model => model.Days[i].isOpen) 

This rendered the checkbox but values where null in the post:

@Html.EditorFor("isOpen", model.Days[i].isOpen ?? false) 

By looking at the rendered html I did this in the view which solved it:

@Html.CheckBox("Days[" + i +"].isOpen", Model.Days[i].isOpen ?? false)

I know it's know it's a bit quick n dirty but it worked

Hope this helps someone somewhere.