CODEWITHSUNDEEP
asp.net-mvcrazorcheckbox
anonymous1110
anonymous1110

Reputation: 885

MVC Checkbox value not working

Hi i have a check box for a checklist program that i am making, its type is bool? so that i can pass a null value if the answer is not applicable (they should leave the yes and no blank), otherwise they should tick yes or no..my problem now is how can i save the answer to my answer property.

View:

   YES
              @Html.CheckBox("chkYes", Model.questionnaires[itemindex].Answer.HasValue  ? bool.Parse(Model.questionnaires[itemindex].Answer.ToString()):false)
   NO
               @Html.CheckBox("chkNo", Model.questionnaires[itemindex].Answer.HasValue ? !bool.Parse(Model.questionnaires[itemindex].Answer.ToString())  : false)

Model:

public bool? Answer { get; set; }

Changed my view from checkbox to radiobutton:

  YES
                  @Html.RadioButtonFor(modelItem => modelItem.questionnaires[itemindex].Answer,true, new { id = "rbYes"}) 
                 NO
                    @Html.RadioButtonFor(modelItem => modelItem.questionnaires[itemindex].Answer,false, new { id = "rbNo"}) 
                 Not Applicable
                    @Html.RadioButtonFor(modelItem => modelItem.questionnaires[itemindex].Answer,null, new { id = "rbNotApp"})

my problem now is how to pass a null value when not applicable?

Upvotes: 1

Views: 14316

Answers (5)

Jokin Celemin
Jokin Celemin

Reputation: 1

In MVC, we can not change de model value because MVC generates a hidden input of your checkbox, but we can obtain the value by jquery and change the model.

With this example:

@Html.CheckBoxFor(model => model.Option1)

In js use this (in onchange event or whatever you need):

var checked = $("#Option1").is(':checked'); $("#Option1").val(checked);

Upvotes: 0

messed-up
messed-up

Reputation: 533

Yes, the HTML is rendered with two input for same properties like #Stephen Muecke said in his answer. Because both of the input has the same name, the form post doesn't take either one. I didn't find the hidden input very useful so i removed it on page load using JS like below.

 @Html.CheckBoxFor(model => model.IsRFD, new { @class = "checkbox" })
 @Html.LabelFor(model => model.IsRFD)

JS:

 $('input[name="IsRFD"][type="hidden"').remove();

Now it is working perfectly with no problem so far...

Upvotes: 1

user3559349
user3559349

Reputation:

You 2 checkboxes (and the associated hidden inputs) will be rendered as

<input type="checkbox" name="chkYes" ...>
<input type="hidden" name="chkYes" ...>
<input type="checkbox" name="chkNo" ...>
<input type="hidden" name="chkNo" ...>

which will post back to properties named chkYes and chkNo (which don't exist) but you property name is Answer. You can use @Html.EditorFor(m => m.questionnaires[itemindex].Answer) which will render a dropdown with 3 values (True/False/Not Set) or you could use 3 radio button to indicate the state.

Note also you cannot use a checkbox for a nullable bool. A checkbox has 2 states only (checked = true or unchecked = false) whereas a nullable bool has 3 states (true, false and null). In addition a checkbox does not post back a value if its unchecked

If you use radio buttons, then

YES
@Html.RadioButtonFor(modelItem => modelItem.questionnaires[itemindex].Answer, true, new { id = "rbYes"}) 
NO
@Html.RadioButtonFor(modelItem => modelItem.questionnaires[itemindex].Answer, false, new { id = "rbNo"}) 
Not Applicable
@Html.RadioButtonFor(modelItem  => modelItem.questionnaires[itemindex].Answer, string.Empty, Model.questionnaires[itemindex].Answer.HasValue ? (object)new { id = "rbNotApp" } : (object)new { id = "rbNotApp", @checked = "checked" })

Upvotes: 2

Saket Kumar
Saket Kumar

Reputation: 4845

I don't understand one thing. If the answer is just 'Yes' or 'No', why use checkbox? Shouldn't Radio buttons be used for the purpose? You can implement in the simpler way as:

@Html.RadioButtonFor(m=>m.Answer , new{ Name="Answer"}) Yes
@Html.RadioButtonFor(m=>m.Answer , new{ Name="Answer"}) No

If you still want to go with your method you can directly bind it to model I think:

YES  @Html.CheckBoxFor(m=>m.Answer)
NO @Html.CheckBoxFor(m=>m.Answer)

Make model field as:

public bool Answer { get; set; }

Handle null request in controller after postback..

Upvotes: 0

Razvan Dumitru
Razvan Dumitru

Reputation: 12472

Why doesn't my checkbox map to an MVC model member?

Here you have an example of how you must map the checkbox to your mvc model. Checkboxes are trashy, but there is always a workaround.

Model : 

namespace TestAppMVC2.Models
{
    public class MyModel
    {
       public bool Option1 { get; set; }
    }
}

View : 

<fieldset>
    <legend>Fields</legend>

    <div class="editor-label">
        @Html.LabelFor(model => model.Option1)
    </div>
    <div class="editor-field">
         @Html.CheckBoxFor(model => model.Option1)
         @Html.ValidationMessageFor(model => model.Option1)
    </div>

    <p>
        <input type="submit" value="Save" />
    </p>
</fieldset>

Upvotes: 0

Related Questions