Bootstrap Table - subtable example
Bootstrap Table - subtable example with real data, forked from http://jsfiddle.net/myvykf24/1/ and created for https://github.com/wenzhixin/bootstrap-table/issues/2121
HTML
<link rel="stylesheet" href="https://rawgit.com/wenzhixin/bootstrap-table/master/src/bootstrap-table.css">
<script src="https://rawgit.com/wenzhixin/bootstrap-table/master/src/bootstrap-table.js"></script>
<table id="table">
</table>
JavaScript
// Bootstrap Table - subtable example with real data, forked from http://jsfiddle.net/myvykf24/1/ and created for https://github.com/wenzhixin/bootstrap-table/issues/2121
var data = [{
'col1': '1.1',
'col2': '1.2',
'nested': [
'1.3',
'1.4',
]
}, {
'col1': '2.1',
'col2': '2.2',
'nested': [{
'col1':'2.3',
'col2':'2.4',
}
]
}, {
'col1': 'lucy',
'col2': 'ivan',
'nested': [
'garry',
'jules',
]
}]
var $table = $('#table');
$(function() {
$table.bootstrapTable({
columns: [{
field: 'col1',
title: 'Col1'
}, {
field: 'col2',
title: 'Col2'
}],
data: data,
detailView: true,
onExpandRow: function(index, row, $detail) {
console.log(row)
$detail.html('<table></table>').find('table').bootstrapTable({
data: row.nested,
// Simple contextual, assumes all entries have further nesting
// Just shows example of how you might differentiate some rows, though also remember row class and similar possible flags
});
}
});
});