extending bootstrap-data-table.

[jeffdupont]

extending bootstrap-data-table.

[jeffdupont]

I haven't done any examples of a subgrid, but I would've done it as you had
in the rowCallback function.
On Jun 26, 2013 6:14 AM, "depakyadav" [email protected] wrote:

Hi Mr. jeffdupont,

can you please provide the code snippet to extend the data-table plugin,
as i need to add subgrid functionality.

i tried with below code but its not working:
;(function() {
$.datatable.extend({});
})(Jquery)

though i managed it with the below code from your example.html :
$("#table-container_1").datatable({
perPage: 5
, url: 'example-data.php'
, sort: '1'
, filter: '1'
// , url: 'example-data.json'
, showPagination: true
, showFilter: true
, filterModal: $("#table-container_1-filter")
, columns: [
{
title: ""

  , field: "id"
  , callback: function ( data, cell ) {
      return data[cell.field];
    }

}

, {
title: "Column 1"
, sortable: true
, field: "column_0"
, callback: function ( data, cell ) {
return data[cell.field];
}
, filter: true
}
, {
title: "Column 2"
, sortable: true
, field: "column_1"
}
, {
title: "Column 3"
, sortable: false
, field: "column_2"
, filter: true
, css: {
textAlign: 'right'
}
}
, {
title: "Column 4"
, sortable: false
, field: "column_3"
, css: {
textAlign: 'right'
}
, hidden: true
}
]
, rowCallback : function (row, rowdata) {

$(row).on("click", function() {
    if($('#tr_subgrid_' + rowdata.id).length == 0) {


        $('<tr/>', {
            "id" : 'tr_subgrid_' + rowdata.id,
            "html" : $('<td/>', {
                "id" : 'td_subgrid_' + rowdata.id,
                'colspan': $(this).children().length,
                "html" : $('<div/>', {
                    "id" : 'div_subgrid_' + rowdata.id
                })
            })
        }).insertAfter($(this));

        $('#div_subgrid_' + rowdata.id).datatable({
            showPagination : false,
            //url: 'example-data-subgrid.php?id=' + rowdata.id,
            title : '',
            url: 'example-data-subgrid.php',
            post: {
                checkparam1 : $("#checkparam1").val(),
            },
             sort: '1',
            filter: '1',
            columns : [
                {
                    title: "Column 1"
                  , sortable: true
                  , field: "column_0"
                  , callback: function ( data, cell ) {
                      return data[cell.field];
                    }
                  , filter: true
                }
              , {
                    title: "Column 2"
                  , sortable: true
                  , field: "column_1"
                }
              , {
                    title: "Column 3"
                  , sortable: false
                  , field: "column_2"
                  , filter: true
                  , css: {
                        textAlign: 'right'
                    }
                }
              , {
                    title: "Column 4"
                  , sortable: false
                  , field: "column_3"
                  , css: {
                        textAlign: 'right'
                    }
                  , hidden: true
                }
            ]

        });
    } else if($('#tr_subgrid_' + rowdata.id + ":visible").length > 0) {
        $('#tr_subgrid_' + rowdata.id).hide();
    } else {
        $('#tr_subgrid_' + rowdata.id).show();
    }

});
//console.log(rowdata);
//console.log(row);

return row;

}

});

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/16
.