Bootstrap Table
by jimkennelly
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" data-toggle="table">
<thead>
<tr>
<th data-field="name">Name</th>
<th data-field="stargazers_count">Stars</th>
<th data-field="forks_count">Forks</th>
<th data-field="description">Description</th>
</tr>
</thead>
</table>
<button onclick="addRow()">
Add Row JIM </button>
<button onclick="removeRow()">
remove Row</button>
</button>
JavaScript
var data = [{
"name": "bootstrap-table",
"stargazers_count": "526",
"forks_count": "122",
"description": "An extended Bootstrap table with radio, checkbox, sort, pagination, and other added features. (supports twitter bootstrap v2 and v3) "
},
{
"name": "multiple-select",
"stargazers_count": "288",
"forks_count": "150",
"description": "A jQuery plugin to select multiple elements with checkboxes :)"
},
];
var dataAdd = [{
"name": "scutech-redmine",
"stargazers_count": "6",
"forks_count": "3",
"description": "Redmine notification tools for chrome extension."
}];
$(function() {
$('#table').bootstrapTable('load', data);
});
function addRow() {
$('#table').bootstrapTable('append', dataAdd);
}
function removeRow() {
forks = ["3"];
$('#table').bootstrapTable('remove', {
field: 'forks_count',
values: forks,
});
}