user1356185
user1356185

Reputation: 86

jquery datatables add checkbox with ajax server side response

I am using C# ASP .NET MVC and ajax calls. I am able to get the display of the table along with all features.

But, I don't understand how do I add a checkbox and button. I have tried dom-checkbox as well but can't get it to work.

Any help is appreciated.

My code looks like this:

$(document).ready(function () {

$('#personTable').dataTable({
            "bJQueryUI": true,
            "sPaginationType": "full_numbers",
            "bProcessing": true,
            "bServerSide": true,
            "sAjaxSource": "/Home/GetCustomData",
            "aoColumns": [
                         { "sSortDataType": "dom-checkbox", "sTitle": "Select", 
                                     sName": "" },
                         { "sName": "ID", "sTitle": "ID" },
             { "sName": "FirstName", "sTitle": "First Name" },
             { "sName": "Email", "sTitle": "Email"}]
        });
    });

My Html is : [table border="1" id="personTable" class="display"] [/table]

Upvotes: 2

Views: 7385

Answers (3)

Nava Ruban
Nava Ruban

Reputation: 95

ColumnDefs:[
            { 'targets': [0],
              'render': function (data, type, full, meta)
                        {
                          return '<input type="checkbox" name="id[]" value="' + 
                          $('<div/>').text(data).html() + '">';
                        }
             }
           ]

Upvotes: 0

Davorin Ruševljan
Davorin Ruševljan

Reputation: 4392

If you do not fancy returning html in json response as described in Lukasz Dziedzia's answer, you can override fnRowCallback function, on the client side, to do the checkbox inserting in the row before it is displayed.

Upvotes: 3

dzida
dzida

Reputation: 8981

Simply you need to return checkbox html code in your response. In your json response add something like this:

...
"aaData":[
[
...
    "<input type=\"checkbox\" />",
...
]

(You can also use html as type for this column, but probably sorting and other features like that will be disabled for columns with checkboxes, so this has no impact at all.)

Upvotes: 0

Related Questions