Datatables - passing one data of the selected row to a modal

2582 views datatables

I have a datatable that has an edit button on each row. When I click the edit button, a function opens a modal to display the data of the selected record. Initially, I just want to get the id(which I referred to as PID) of the selected record. However according to my code, I am not sure how to extract the value passed. I kept on getting undefined response.

Please advise on any errors in my code or is there a better way to do this.


    select: true,
ajax: {
    url: "people-grid-data.php", 
    type: "POST", 

columnDefs: [{
    "targets": [3, 4, 6, 7, 8, 9],
    "visible": false,
    "searchable": true
columns: [
        "render": function (data, type, full, meta) {
           return    "<button type='button' class='btn btn-xs' data-toggle='modal'  data-target='#editPersonModal'>Edit </button>";
        "data": "PID",
        render: getImg
        "data": "PID"
        "data": "personName"
        "data": "PeopleRemarks"
"order": [
    [2, 'asc']


$('#editPersonModal').on('', function (data, type, full, meta) { console.log("Data ID---"+data['PID']);


answered question

1 Answer


i have a button in my grid , you open your modal with this, using data atributes

render: function (data, type, row) {<a data-info="' + row.IdUser + '" data-toggle="modal" data-target="#modalGridTable" ...

in row.IdUser i have my id. now when i click in $('#modalGridTable').on('', function (event)...

        var button = $(event.relatedTarget);
        var id ='info');
        var data = Grid.ajax.json().data;
        function getDataJson(IdUsuario) {
            return data.filter(
                function (data) {
                    return data.IdUser === IdUser;

        var result = getDataJson(id);

so you can read this example:


posted this

Have an answer?


Please login first before posting an answer.