Bootstrap 3 Template
This is a simple Twitter Bootstrap 3 template. You can fork it to get a ready to use Bootstrap 3 fiddle.
by jimkennelly
HTML
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://github.com/wenzhixin/bootstrap-table/blob/master/dist/bootstrap-table.min.css">
<script src="https://cdn.rawgit.com/wenzhixin/bootstrap-table/master/dist/bootstrap-table.min.js"></script>
<input type="button" id="btn" value="change data">
<table id="table" data-toolbar="#toolbar" data-search="true" data-show-refresh="true" data-show-toggle="true" data-show-columns="true" data-show-export="true" data-show-pagination-switch="true" data-pagination="true" data-show-footer="true" data-side-pagination="server">
<thead>
<tr>
<th data-field="id" data-sortable="true">id</th>
<th data-field="name" data-sortable="true">id</th>
<th data-field="isDel" data-checkbox="true">del</th>
<th data-field="isAlt" data-checkbox="true">alt</th>
</tr>
</thead>
</table>
<br><br><br>
CSS
/* Latest compiled and minified CSS included as External Resource*/
/* Optional theme */
@import url('//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css');
body {
margin: 10px;
}
JavaScript
/* Latest compiled and minified JavaScript included as External Resource */
var data = [{
"id":"1","name":"joe","isDel":"1","isAlt":"0"}, {
"id":"2","name":"fred","isDel":"0","isAlt":"1"}];
var $table = $('#table')
$(function () {
data[0].name="xxx";
$( "#btn" ).click(function() {alert("test");});
$table.bootstrapTable({
data: data
});
$table.on('check.bs.table uncheck.bs.table ' +
'check-all.bs.table uncheck-all.bs.table', function () {
alert("aaa");
//data[0].name="yyy";
$table.bootstrapTable("updateRow", {index:1, row: { "id":"1","name":"joxe","isDel":"1"}})
});
$table.on('all.bs.table', function (e, name, args) {
console.log(name, args);
});
});