Datatables server side adding column with parameter

Question

I've a problem when using datatables serverside adding column with parameter. when create datatables serverside without additional column (just query list form database) it is works fine. But i've difficulty when I want add one column that has value ID.

My script (JS) :

  var dataTable = $('#mytablex').DataTable( {
        "processing": true,
        "serverSide": true,
        "ajax":{
            url :"<?php echo base_url();?>admin/ap_invoice/getPOs", // json datasource
            type: "post",  // method  , by default get
             "data": {
                  "posupplier_id": $('#vendor_id').val()
              },
            error: function(){  // error handling
                $(".employee-grid-error").html("");
                $("#mytablex").append('<tbody class="employee-grid-error"><tr><th colspan="3">No data found in the server</th></tr></tbody>');
            }
        },
       "columnDefs": [ {
        "targets": -1,
        "data": null,
        "defaultContent": "<input type='checkbox'  id='supid[]' name='supid[]'>"
    } ]
    } );

when i'm adding

<input type='checkbox'  id='supid[]' name='supid[]'>

how to fill with value each rowid , i want become like this

<input type='checkbox'  id='supid[]' name='supid[]' value='row->po_id'>

just adding 'render' property to columnDefs like this post: stackoverflow.com/questions/21051203/… — toshi
– toshi, Commented Jan 18, 2016 at 4:32

Thxopen · Accepted Answer · 2019-05-05 03:49:39Z

or you can use select ext.

$(document).ready(function () {
    var events = $('#events');
    var table = $('#example').DataTable({
    //you can change data to ajax, there is an example 
        data: [{
            "id": 1,
            "name": "datatables",
            "position": "anywhere",
            "office": "stackoverflow",
            "age": 18,
            "salary": 341
        }],
        dom: 'Bfrtip',
        columns: [
            {
                "data": "id"
            },
            {
                "data": "name"
            },
            {
                "data": "position"
            },
            {
                "data": "office"
            },
            {
                "data": "age"
            },
            {
                "data": "salary"
            }
     ],
        columnDefs: [{
            orderable: false,
            className: 'select-checkbox',
            targets: 0
        }],
        select: {
            style: 'os',
            selector: 'td:first-child'
        },
        order: [[1, 'asc']],
        buttons: [
            {
                text: 'Get selected data',
                action: function () {
                    var count = table.rows({
                        selected: true
                    }).count();
                    events.prepend('<div>' + count + ' row(s) selected</div>');
                    
                    var data = table.rows({
                        selected: true
                    }).data().toArray();
                    //print whole row data
                    console.log(data);
                    //print id
                    console.log(data[0].id);
                   
                }
            }
        ]
    });
});

#events {
        margin-bottom: 1em;
        padding: 1em;
        background-color: #f6f6f6;
        border: 1px solid #999;
        border-radius: 3px;
        height: 100px;
        overflow: auto;
    }

<link href="https://cdn.datatables.net/select/1.3.0/css/select.dataTables.min.css" rel="stylesheet"/>
<link href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet"/>
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/select/1.3.0/js/dataTables.select.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.5.6/js/dataTables.buttons.min.js"></script>
<table id="example" class="display" style="width:100%">
        <thead>
            <tr>
                <th>ID</th>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Age</th>
                <th>Salary</th>
            </tr>
        </thead>
        <tbody>
           
        </tbody>
    </table>

Collectives™ on Stack Overflow

Datatables server side adding column with parameter

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related