How to bind checkbox value dynamically from database using jQuery Datatables plugin

Question

I am using jQuery DataTables plugin for displaying data. Here I have a column with checkbox which should be checked or unchecked according to the values from the database, i.e. if the value from the db is true checkbox should be checked and if value from db is false checkbox should be unchecked.

Here is what I have tried so far.

table = $("#dataTableMenuRole").dataTable({
        "ajax": {
            "url": "@Url.Action("LoadGridView", "MenuSettings")",                
            "method": "POST",
            "dataType": "json",
            "data": function (d) {
                d.roleId = $("#ddlRoles").val()
            }
        },
        columns: [
            { "data": "MenuName" },
            { "data": "CanAdd" }               

        ],            
        "bProcessing": true,
        "aoColumnDefs": [{
            "targets": 1,
            "bSortable": false,
            "mRender": function (data, type, full, meta) {
                return '<input type="checkbox" class="minimal" checked="'+data+'"/>'
            }
        }]
    });

The JSON returned from the db is

{"data":[{"MenuName":"Roles","CanAdd":true},{"MenuName":"Menu","CanAdd":true},{"MenuName":"ServiceTax","CanAdd":false}]}

Gyrocode.com · Accepted Answer · 2015-09-24 14:03:38Z

1

CAUSE

You define checked attribute despite the value in data and checkboxes will be always checked.

SOLUTION

Use the following code instead:

"mRender": function (data, type, full, meta) {
    return '<input type="checkbox" class="minimal"' + (data ? ' checked' : '') + '/>';
}

DEMO

See this jsFiddle for code and demonstration.

answered Sep 24, 2015 at 14:03

Gyrocode.com

59k16 gold badges157 silver badges192 bronze badges

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

6 Comments

ksg Over a year ago

Thanks for the reply.I think it should work and will vote after implementing it.Meanwhile if possible please clarify my another concern which is raised in StackOverflow regarding using href attribute dynamically using JqueryDatatables

Gyrocode.com Over a year ago

@ksg, your another question already has a correct answer so I just voted it up.

ksg Over a year ago

Thanks for your answer mate.I am curious to know what is the importants of brackets() here .(data ? ' checked' : '')

Gyrocode.com Over a year ago

@ksg, brackets allow clause surrounded to be executed first, see grouping operator.

Khalid Over a year ago

@Gyrocode.com does this two way binding? so if i submit my form i could get the value of binded checkbox ?

|

Collectives™ on Stack Overflow

How to bind checkbox value dynamically from database using jQuery Datatables plugin

1 Answer 1

6 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related