How to de-serialize JSON data of check box values?

Question

I have multiple check box values in a form. I am serializing the form and send to mvc controller as JSON data. How can i de-serialize the check box values?

This is my html -

@using (Html.BeginForm("SaveOfficeConfiguration", "Offices", FormMethod.Post, new { Id = "frmOfficeConfigSave" }))
{  
<div id="divOfficeForm">
    <div style="width: auto; height: auto; border: 3px outset silver;">
        <table class="mainsectionable" width="100%">
            <thead>
                <tr>
                    <th style="text-align: center;">
                        <center>KCCM Profile Access</center>
                    </th>
                </tr>
                <tr>
                    <td>
                        @using (Html.BeginForm())
                        {
                            IEnumerable<SelectListItem> Brands = ViewBag.GetBrands;
                            foreach (var item in Brands)
                            {
                            @Html.CheckBox("KCCM_Brands", false, new
                                                        {
                                                            value = item.Value
                                                        });
                            <label>@item.Text</label><br />
                                            }
                                        }
                    </td>
                </tr>
            </thead>
        </table>
    </div>
</div>
}

This is my javascript function-

function SaveOfficeConfigNew() {
    var officeID = $('input[name="hdnOfficeID"]').val();
    var url = "/OfficeManagement/Offices/SaveOfficeConfiguration?officeID=" + officeID;
    ShowWait();
    $.ajax({
        type: "POST",
        url: url,
        data: frmOfficeConfigSave.$('input').serialize(),
        success: function (data) {
            HideWait();
            alert(data.msg);
        },
        error: function (data) {
            HideWait();
            alert(data.msg);
        }
    });
    applyFilter();
    return false;
}

This is my gonna be controller action -

[HttpPost]
    public ActionResult SaveOfficeConfiguration(int ? officeID, FormCollection form)
    {
        try
        {
            */..............
              ..............*/
            return Json(new
            {
                success = true,
                msg = String.Empty,
                id = 1

            }, JsonRequestBehavior.AllowGet);
        }
        catch (Exception error)
        {
            return Json(new
            {
                success = false,
                msg = error.Message,
                id = -1
            }, JsonRequestBehavior.AllowGet);

        }
    }

score 0 · Answer 1 · edited May 23 '17 at 12:28

0

You simply have to receive a List<string> parameter, with the same name you're giving the checkboxes, i.e., KCM_Brands. The Model Binder will deserialize it directly for you.

[HttpPost]
public ActionResult SaveOfficeConfiguration(int ? officeID, FormCollection form,
  List<string> KCM_Brands)
{
    ....
}

To serialize your form data to post it, use the function suggedted in this post:

JSON object post using form serialize not mapping to c# object

edited May 23 '17 at 12:28

Community

1
1

answered Sep 20 '13 at 07:35

JotaBe

38,030
8
98
117

Its `null`, any issues in my javascript function? – Sandy Sep 20 '13 at 08:07
I didn't check your js. And yes, it's wrong. I thoght you had checked what was being sent with the alerts. Look ad the reference I've added – JotaBe Sep 20 '13 at 08:19

Jatin patil · Answer 2 · 2013-09-20T09:47:39.343

0

You can use the FormsCollection to retrieve the check box values:

Controller:

[HttpPost]
public ActionResult SaveOfficeConfiguration(int ? officeID, FormCollection form) 
{
var CheckBoxValues = form["KCCM_Brands"].Split(new char[] { ',' }, StringSplitOptions.RemoveEmptyEntries).Select(x=>int.Parse(x));
}

For More info Have a look here : http://www.mindstick.com/Articles/2ee905ba-aea1-4d83-a49d-d8d8fb10c747/?Checkbox%20control%20in%20MVC

edited Sep 20 '13 at 09:47

answered Sep 20 '13 at 07:38

Jatin patil

4,252
1
18
27

I have 3 check boxes, I checked first and last and then submitted the form. I controller when I used your code, I got the values as `"1","false","false","3","false"` – Sandy Sep 20 '13 at 07:49
you will have to remove those false from your list. your results is giving you the selected checboxes. – Jatin patil Sep 20 '13 at 08:01
How do I know the selected check boxes from this values? – Sandy Sep 20 '13 at 08:04
Im confused here, I couldnt found any value here. – Sandy Sep 20 '13 at 09:30
@sandy visit the link in answer. – Jatin patil Sep 20 '13 at 09:48

Ovidiu · Answer 3 · 2013-09-20T10:12:03.080

0

Instead of

@Html.CheckBox("KCCM_Brands", false, new
{
    value = item.Value
});

use this code to generate checkboxes

<input type="checkbox" name="KCCM_Brands" value="@item.Value" />

The action on your controller should look like this

public ActionResult SaveOfficeConfiguration(int? officeID, List<string> KCCM_Brands)

When you post your form, List<string> KCCM_Brands will be populated only with the values of selected checkboxes.

Also, I don't know if your javascript is correct, but I had to make the following change for it to work

data: $('#frmOfficeConfigSave input').serialize()

edited Sep 20 '13 at 10:12

answered Sep 20 '13 at 08:04

Ovidiu

1,407
12
11

I have to follow Json serialization – Sandy Sep 20 '13 at 08:06
`List KCCM_Brands` is `null`! – Sandy Sep 20 '13 at 09:10

How to de-serialize JSON data of check box values?

3 Answers3