How to fix Checkbox value always give 'false' in jquery.serializeJSON plugin

By FoxLearn 2/18/2024 1:05:19 AM   79
This post shows you how to de-serialize JSON data of check box values or how to fix 'checkbox value always give 'false' in jquery.serializeJSON plugin'


<input type="checkbox" asp-for="Active" class="form-control" />


@Html.CheckBoxFor(m => m.Active)

Your html should be generated as shown below.

<input type="checkbox" class="form-control" data-unchecked-value="false" data-val="true" data-val-required="The Active field is required." id="Active" name="Active" value="true">

You can de-serialize by using serializeJSON as shown below.

var obj = $('form').serializeJSON();

For example

function addEdit(form) {
    if ($(form).valid()) {
        var model = $(form).serializeJSON();
            type: 'POST',
            url: '/api/todo',
            data: JSON.stringify(model),
            contentType: 'application/json',
            success: function (response) {
                if (response.success) {
                   //do something

    return false;

You will get true when checked and false (from data-unchecked-value attribute) when you using $('form').serializeJSON();