Comments (1)
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
.
from bootstrap-data-table.
Related Issues (20)
- How to apply options.filter values HOT 2
- About sorting HOT 1
- Question about rerender table in onClick event HOT 12
- Demo of data table? HOT 1
- Reload Data
- Sort Option HOT 1
- Bootstrap 3 and pagination
- Filter input disappears HOT 1
- Seems can not reload/refresh table HOT 3
- Strange filter icon HOT 1
- Multi Row Select HOT 2
- Dynamically update the table HOT 5
- Bootstrap 3.1.1Patch
- min file out of sync
- allowExport HOT 3
- Can't get it to work HOT 5
- Clickable rows HOT 2
- Sorting bug, after desc there is null HOT 1
- Question about sortOrder HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from bootstrap-data-table.