Initial import from local backup (Documents-Playground/pakerpale)
This commit is contained in:
37
public/assets/bt/extensions/cookie.html
Normal file
37
public/assets/bt/extensions/cookie.html
Normal file
@@ -0,0 +1,37 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Cookie</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="../assets/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/bootstrap-table.css">
|
||||
<link rel="stylesheet" href="../assets/examples.css">
|
||||
<script src="../assets/jquery.min.js"></script>
|
||||
<script src="../assets/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/bootstrap-table.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/extensions/cookie/bootstrap-table-cookie.js"></script>
|
||||
<script src="../ga.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Cookie</h1>
|
||||
<table id="table"
|
||||
data-toggle="table"
|
||||
data-show-columns="true"
|
||||
data-cookie="true"
|
||||
data-cookie-id-table="saveId"
|
||||
data-pagination="true"
|
||||
data-search="true"
|
||||
data-url="/examples/bootstrap_table/data"
|
||||
data-side-pagination="server">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-field="id" data-sortable="true">ID</th>
|
||||
<th data-field="name" data-sortable="true">Item Name</th>
|
||||
<th data-field="price" data-sortable="true">Item Price</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
35
public/assets/bt/extensions/editable.html
Normal file
35
public/assets/bt/extensions/editable.html
Normal file
@@ -0,0 +1,35 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Editable</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="../assets/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/bootstrap-table.css">
|
||||
<link rel="stylesheet" href="//rawgit.com/vitalets/x-editable/master/dist/bootstrap3-editable/css/bootstrap-editable.css">
|
||||
<link rel="stylesheet" href="../assets/examples.css">
|
||||
<script src="../assets/jquery.min.js"></script>
|
||||
<script src="../assets/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/bootstrap-table.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/extensions/editable/bootstrap-table-editable.js"></script>
|
||||
<script src="//rawgit.com/vitalets/x-editable/master/dist/bootstrap3-editable/js/bootstrap-editable.js"></script>
|
||||
<script src="../ga.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Editable</h1>
|
||||
<table id="table"
|
||||
data-toggle="table"
|
||||
data-pagination="true"
|
||||
data-show-export="true"
|
||||
data-url="../json/data1.json">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-field="id">ID</th>
|
||||
<th data-field="name" data-editable="true">Item Name</th>
|
||||
<th data-field="price" data-editable="true">Item Price</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
54
public/assets/bt/extensions/export.html
Normal file
54
public/assets/bt/extensions/export.html
Normal file
@@ -0,0 +1,54 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Export</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="../assets/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/bootstrap-table.css">
|
||||
<link rel="stylesheet" href="../assets/examples.css">
|
||||
<script src="../assets/jquery.min.js"></script>
|
||||
<script src="../assets/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/bootstrap-table.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/extensions/export/bootstrap-table-export.js"></script>
|
||||
<script src="//rawgit.com/hhurz/tableExport.jquery.plugin/master/tableExport.js"></script>
|
||||
<script src="../ga.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Export</h1>
|
||||
<div id="toolbar">
|
||||
<select class="form-control">
|
||||
<option value="">Export Basic</option>
|
||||
<option value="all">Export All</option>
|
||||
<option value="selected">Export Selected</option>
|
||||
</select>
|
||||
</div>
|
||||
<table id="table"
|
||||
data-toggle="table"
|
||||
data-show-export="true"
|
||||
data-pagination="true"
|
||||
data-click-to-select="true"
|
||||
data-toolbar="#toolbar"
|
||||
data-url="../json/data1.json">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-field="state" data-checkbox="true"></th>
|
||||
<th data-field="id">ID</th>
|
||||
<th data-field="name">Item Name</th>
|
||||
<th data-field="price">Item Price</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
<script>
|
||||
var $table = $('#table');
|
||||
$(function () {
|
||||
$('#toolbar').find('select').change(function () {
|
||||
$table.bootstrapTable('destroy').bootstrapTable({
|
||||
exportDataType: $(this).val()
|
||||
});
|
||||
});
|
||||
})
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
33
public/assets/bt/extensions/filter-control.html
Normal file
33
public/assets/bt/extensions/filter-control.html
Normal file
@@ -0,0 +1,33 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Filter Control</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="../assets/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/bootstrap-table.css">
|
||||
<link rel="stylesheet" href="../assets/examples.css">
|
||||
<script src="../assets/jquery.min.js"></script>
|
||||
<script src="../assets/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/bootstrap-table.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/extensions/filter-control/bootstrap-table-filter-control.js"></script>
|
||||
<script src="../ga.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Filter Control</h1>
|
||||
<table id="table"
|
||||
data-toggle="table"
|
||||
data-url="../json/data1.json"
|
||||
data-filter-control="true"
|
||||
data-filter-show-clear="true">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-field="id">ID</th>
|
||||
<th data-field="name" data-filter-control="input">Item Name</th>
|
||||
<th data-field="price" data-filter-control="select">Item Price</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
87
public/assets/bt/extensions/fixed-columns.html
Normal file
87
public/assets/bt/extensions/fixed-columns.html
Normal file
@@ -0,0 +1,87 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Fixed Columns</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="../assets/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/bootstrap-table.css">
|
||||
<link rel="stylesheet" href="//rawgit.com/wenzhixin/bootstrap-table-fixed-columns/master/bootstrap-table-fixed-columns.css">
|
||||
<link rel="stylesheet" href="http://bootstrap-table.wenzhixin.net.cn/assets/css/docs.min.css">
|
||||
<link rel="stylesheet" href="../assets/examples.css">
|
||||
<script src="../assets/jquery.min.js"></script>
|
||||
<script src="../assets/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/bootstrap-table.js"></script>
|
||||
<script src="//rawgit.com/wenzhixin/bootstrap-table-fixed-columns/master/bootstrap-table-fixed-columns.js"></script>
|
||||
<script src="../ga.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Fixed Columns</h1>
|
||||
<ul class="bs-docs-social-buttons">
|
||||
<li>
|
||||
if you like bootstrap-table-fixed-columns - help:
|
||||
</li>
|
||||
<li>
|
||||
<iframe class="github-btn"
|
||||
src="http://ghbtns.com/github-btn.html?user=wenzhixin&repo=bootstrap-table-fixed-columns&type=watch&count=true"
|
||||
width="100" height="20" title="Star on GitHub"></iframe>
|
||||
</li>
|
||||
<li>
|
||||
<iframe class="github-btn"
|
||||
src="http://ghbtns.com/github-btn.html?user=wenzhixin&repo=bootstrap-table-fixed-columns&type=fork&count=true"
|
||||
width="102" height="20" title="Fork on GitHub"></iframe>
|
||||
</li>
|
||||
<li>
|
||||
<iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=wenzhixin&type=follow&count=true"
|
||||
width="175" height="20" title="Follow on GitHub"></iframe>
|
||||
</li>
|
||||
</ul>
|
||||
<hr>
|
||||
<div class="toolbar form-inline">
|
||||
<span>Fixed Number: </span>
|
||||
<input class="form-control" id="fixedNumber" type="number" value="1" min="1" max="5">
|
||||
</div>
|
||||
<table id="table" data-height="400" data-show-columns="true"></table>
|
||||
</div>
|
||||
<script>
|
||||
var $table = $('#table');
|
||||
|
||||
$(function () {
|
||||
buildTable($table, 20, 20);
|
||||
|
||||
$('#fixedNumber').change(function () {
|
||||
buildTable($table, 20, 20);
|
||||
});
|
||||
});
|
||||
|
||||
function buildTable($el, cells, rows) {
|
||||
var i, j, row,
|
||||
columns = [],
|
||||
data = [];
|
||||
|
||||
for (i = 0; i < cells; i++) {
|
||||
columns.push({
|
||||
field: 'field' + i,
|
||||
title: 'Cell' + i,
|
||||
sortable: true
|
||||
});
|
||||
}
|
||||
for (i = 0; i < rows; i++) {
|
||||
row = {};
|
||||
for (j = 0; j < cells; j++) {
|
||||
row['field' + j] = 'Row-' + i + '-' + j;
|
||||
}
|
||||
data.push(row);
|
||||
}
|
||||
$el.bootstrapTable('destroy').bootstrapTable({
|
||||
columns: columns,
|
||||
data: data,
|
||||
search: true,
|
||||
toolbar: '.toolbar',
|
||||
fixedColumns: true,
|
||||
fixedNumber: +$('#fixedNumber').val()
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
34
public/assets/bt/extensions/flat-json.html
Normal file
34
public/assets/bt/extensions/flat-json.html
Normal file
@@ -0,0 +1,34 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Flat Json</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="../assets/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/bootstrap-table.css">
|
||||
<link rel="stylesheet" href="../assets/examples.css">
|
||||
<script src="../assets/jquery.min.js"></script>
|
||||
<script src="../assets/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/bootstrap-table.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/extensions/flat-json/bootstrap-table-flat-json.js"></script>
|
||||
<script src="../ga.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Flat Json</h1>
|
||||
<table id="table"
|
||||
data-toggle="table"
|
||||
data-flat="true"
|
||||
data-search="true"
|
||||
data-url="../json/data3.json">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-field="github.name" data-sortable="true">Name</th>
|
||||
<th data-field="github.count.stargazers" data-sortable="true">Stargazers</th>
|
||||
<th data-field="github.count.forks" data-sortable="true">Forks</th>
|
||||
<th data-field="github.description" data-sortable="true">Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
69
public/assets/bt/extensions/i18n-enhance.html
Normal file
69
public/assets/bt/extensions/i18n-enhance.html
Normal file
@@ -0,0 +1,69 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>i18n Enhance</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="../assets/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/bootstrap-table.css">
|
||||
<link rel="stylesheet" href="../assets/examples.css">
|
||||
|
||||
<script src="../assets/jquery.min.js"></script>
|
||||
<script src="../assets/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/bootstrap-table.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/extensions/i18n-enhance/bootstrap-table-i18n-enhance.js"></script>
|
||||
<script>
|
||||
$(function() {
|
||||
var $table = $("#table"),
|
||||
$buttons = $("button");
|
||||
|
||||
$("#tw_Btn").click(function() {
|
||||
$buttons.removeClass("active");
|
||||
$(this).addClass("active");
|
||||
|
||||
$table.bootstrapTable("changeLocale", "zh-TW");
|
||||
$table.bootstrapTable("changeTitle", {
|
||||
id: "代碼",
|
||||
name: "項目名稱",
|
||||
price: "項目金額"
|
||||
});
|
||||
});
|
||||
|
||||
$("#us_Btn").click(function() {
|
||||
$buttons.removeClass("active");
|
||||
$(this).addClass("active");
|
||||
|
||||
$table.bootstrapTable("changeLocale", "en_US");
|
||||
$table.bootstrapTable("changeTitle", {
|
||||
id: "ID",
|
||||
name: "Item Name",
|
||||
price: "Item Price"
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>i18n Enhance</h1>
|
||||
<label>Language:</label>
|
||||
<div class="btn-group" role="group" style="margin-bottom: 4px">
|
||||
<button id="tw_Btn" type="button" class="btn btn-default btn-sm active">zh_TW</button>
|
||||
<button id="us_Btn" type="button" class="btn btn-default btn-sm">en_US</button>
|
||||
</div>
|
||||
|
||||
<table id="table" data-toggle="table" data-url="../json/data1.json" data-pagination="true">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-field="id">代碼</th>
|
||||
<th data-field="name">項目名稱</th>
|
||||
<th data-field="price">項目金額</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
38
public/assets/bt/extensions/key-events.html
Normal file
38
public/assets/bt/extensions/key-events.html
Normal file
@@ -0,0 +1,38 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Key Events</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="../assets/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/bootstrap-table.css">
|
||||
<link rel="stylesheet" href="../assets/examples.css">
|
||||
<script src="../assets/jquery.min.js"></script>
|
||||
<script src="../assets/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/bootstrap-table.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/extensions/key-events/bootstrap-table-key-events.js"></script>
|
||||
<script src="../ga.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Key Events</h1>
|
||||
<table id="table"
|
||||
data-toggle="table"
|
||||
data-show-columns="true"
|
||||
data-show-toggle="true"
|
||||
data-show-pagination-switch="true"
|
||||
data-show-refresh="true"
|
||||
data-search="true"
|
||||
data-pagination="true"
|
||||
data-key-events="true"
|
||||
data-url="../json/data1.json">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-field="id" data-sortable="true">ID</th>
|
||||
<th data-field="name" data-sortable="true">Item Name</th>
|
||||
<th data-field="price" data-sortable="true">Item Price</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
35
public/assets/bt/extensions/mobile.html
Normal file
35
public/assets/bt/extensions/mobile.html
Normal file
@@ -0,0 +1,35 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Mobile</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="../assets/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/bootstrap-table.css">
|
||||
<link rel="stylesheet" href="../assets/examples.css">
|
||||
<script src="../assets/jquery.min.js"></script>
|
||||
<script src="../assets/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/bootstrap-table.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/extensions/mobile/bootstrap-table-mobile.js"></script>
|
||||
<script src="../ga.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Mobile</h1>
|
||||
<table id="table"
|
||||
data-toggle="table"
|
||||
data-show-columns="true"
|
||||
data-search="true"
|
||||
data-url="../json/data1.json"
|
||||
data-mobile-responsive="true"
|
||||
data-check-on-init="true">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-field="id" data-sortable="true">ID</th>
|
||||
<th data-field="name" data-sortable="true">Item Name</th>
|
||||
<th data-field="price" data-sortable="true">Item Price</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
39
public/assets/bt/extensions/multiple-sort.html
Normal file
39
public/assets/bt/extensions/multiple-sort.html
Normal file
@@ -0,0 +1,39 @@
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Multiple Sort</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="../assets/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/bootstrap-table.css">
|
||||
<link rel="stylesheet" href="../assets/examples.css">
|
||||
<script src="../assets/jquery.min.js"></script>
|
||||
<script src="../assets/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/bootstrap-table.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/extensions/flat-json/bootstrap-table-flat-json.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/extensions/multiple-sort/bootstrap-table-multiple-sort.js"></script>
|
||||
<script src="../ga.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Multiple Sort</h1>
|
||||
<table id="table"
|
||||
data-toggle="table"
|
||||
data-flat="true"
|
||||
data-search="true"
|
||||
data-show-columns="true"
|
||||
data-show-multi-sort="true"
|
||||
data-sort-priority='[{"sortName": "github.count.forks","sortOrder":"desc"},{"sortName":"github.count.stargazers","sortOrder":"desc"}]'
|
||||
data-url="../json/data3.json">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-field="github.name" data-sortable="true">Name</th>
|
||||
<th data-field="github.count.stargazers" data-sortable="true">Stargazers</th>
|
||||
<th data-field="github.count.forks" data-sortable="true">Forks</th>
|
||||
<th data-field="github.description" data-sortable="true">Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
41
public/assets/bt/extensions/reorder-columns.html
Normal file
41
public/assets/bt/extensions/reorder-columns.html
Normal file
@@ -0,0 +1,41 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Reorder Columns</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="../assets/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/bootstrap-table.css">
|
||||
<link rel="stylesheet" href="../assets/examples.css">
|
||||
<link rel="stylesheet" href="https://rawgit.com/akottr/dragtable/master/dragtable.css">
|
||||
<script src="../assets/jquery.min.js"></script>
|
||||
<script src="../assets/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/bootstrap-table.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/extensions/reorder-columns/bootstrap-table-reorder-columns.js"></script>
|
||||
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
|
||||
<script src="https://rawgit.com/akottr/dragtable/master/jquery.dragtable.js"></script>
|
||||
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
|
||||
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
|
||||
<script src="../ga.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Reorder Columns</h1>
|
||||
<table id="table"
|
||||
data-toggle="table"
|
||||
data-show-columns="true"
|
||||
data-search="true"
|
||||
data-show-toggle="true"
|
||||
data-pagination="true"
|
||||
data-url="../json/data1.json"
|
||||
data-reorderable-columns="true">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-field="id" data-sortable="true">ID</th>
|
||||
<th data-field="name" data-sortable="true">Item Name</th>
|
||||
<th data-field="price" data-sortable="true">Item Price</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
37
public/assets/bt/extensions/reorder-rows.html
Normal file
37
public/assets/bt/extensions/reorder-rows.html
Normal file
@@ -0,0 +1,37 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Reorder Rows</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="../assets/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/bootstrap-table.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/extensions/reorder-rows/bootstrap-table-reorder-rows.css">
|
||||
<link rel="stylesheet" href="../assets/examples.css">
|
||||
<script src="../assets/jquery.min.js"></script>
|
||||
<script src="../assets/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/bootstrap-table.js"></script>
|
||||
<script src="https://rawgit.com/isocra/TableDnD/master/js/jquery.tablednd.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/extensions/reorder-rows/bootstrap-table-reorder-rows.js"></script>
|
||||
<script src="../ga.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Reorder Rows</h1>
|
||||
<table id="table"
|
||||
data-toggle="table"
|
||||
data-pagination="true"
|
||||
data-search="true"
|
||||
data-use-row-attr-func="true"
|
||||
data-reorderable-rows="true"
|
||||
data-url="../json/data1.json">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-field="id" data-sortable="true">ID</th>
|
||||
<th data-field="name" data-sortable="true">Item Name</th>
|
||||
<th data-field="price" data-sortable="true">Item Price</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
38
public/assets/bt/extensions/resizable.html
Normal file
38
public/assets/bt/extensions/resizable.html
Normal file
@@ -0,0 +1,38 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Resizable</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="../assets/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/bootstrap-table.css">
|
||||
<link rel="stylesheet" href="../assets/examples.css">
|
||||
<script src="../assets/jquery.min.js"></script>
|
||||
<script src="../assets/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/bootstrap-table.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/extensions/resizable/bootstrap-table-resizable.js"></script>
|
||||
<script src="https://rawgit.com/wenzhixin/colResizable/master/source/colResizable-1.5.source.js"></script>
|
||||
<script src="../ga.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Resizable</h1>
|
||||
<table id="table"
|
||||
data-toggle="table"
|
||||
data-height="480"
|
||||
data-show-columns="true"
|
||||
data-search="true"
|
||||
data-show-toggle="true"
|
||||
data-pagination="true"
|
||||
data-url="../json/data1.json"
|
||||
data-resizable="true">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-field="id" data-sortable="true">ID</th>
|
||||
<th data-field="name" data-sortable="true">Item Name</th>
|
||||
<th data-field="price" data-sortable="true">Item Price</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
61
public/assets/bt/extensions/select2-filter.html
Normal file
61
public/assets/bt/extensions/select2-filter.html
Normal file
@@ -0,0 +1,61 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<title>Select2 Filter</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="../assets/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/bootstrap-table.css">
|
||||
<link rel="stylesheet" href="../assets/examples.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2/css/select2.min.css" />
|
||||
|
||||
<script src="../assets/jquery.min.js"></script>
|
||||
<script src="../assets/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/bootstrap-table.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.2/js/select2.min.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/extensions/select2-filter/bootstrap-table-select2-filter.js"></script>
|
||||
<script>
|
||||
$(function() {
|
||||
var options = {
|
||||
filterValues: {
|
||||
price: "$2"
|
||||
},
|
||||
url: "../json/data1.json",
|
||||
columns: [{
|
||||
field: "id",
|
||||
title: "ID",
|
||||
filter: {
|
||||
type: "input"
|
||||
}
|
||||
}, {
|
||||
field: "name",
|
||||
title: "Item Name",
|
||||
filter: {
|
||||
type: "select",
|
||||
data: []
|
||||
}
|
||||
}, {
|
||||
field: "price",
|
||||
title: "Item Price",
|
||||
filter: {
|
||||
type: "select",
|
||||
data: ["$1", "$2", "$3"]
|
||||
}
|
||||
}],
|
||||
filter: true
|
||||
};
|
||||
|
||||
var $table = $("#table").bootstrapTable(options);
|
||||
$table.bootstrapTable("setFilterData", "name", ["item 1", "item 2", "item 3"]);
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Select2 Filter</h1>
|
||||
<table id="table"></table>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
69
public/assets/bt/extensions/sticky-header.html
Normal file
69
public/assets/bt/extensions/sticky-header.html
Normal file
@@ -0,0 +1,69 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Sticky Header</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="../assets/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/bootstrap-table.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/extensions/sticky-header/bootstrap-table-sticky-header.css">
|
||||
<link rel="stylesheet" href="http://bootstrap-table.wenzhixin.net.cn/assets/css/docs.min.css">
|
||||
<link rel="stylesheet" href="../assets/examples.css">
|
||||
<script src="../assets/jquery.min.js"></script>
|
||||
<script src="../assets/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/bootstrap-table.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/extensions/sticky-header/bootstrap-table-sticky-header.js"></script>
|
||||
<script src="../ga.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Sticky Header</h1>
|
||||
<p>An extension which provides a sticky header for table columns when scrolling on a long page and / or table. Works for tables with many columns and narrow width with horizontal scrollbars too.</p>
|
||||
<hr>
|
||||
<table id="table" data-show-columns="true"></table>
|
||||
</div>
|
||||
<script>
|
||||
var $table = $('#table');
|
||||
|
||||
$(function () {
|
||||
buildTable($table, 20, 50);
|
||||
});
|
||||
|
||||
function buildTable($el, cells, rows) {
|
||||
var i, j, row,
|
||||
columns = [],
|
||||
data = [],
|
||||
stickyHeaderOffsetY = 0;
|
||||
|
||||
for (i = 0; i < cells; i++) {
|
||||
columns.push({
|
||||
field: 'field' + i,
|
||||
title: 'Cell' + i,
|
||||
sortable: true
|
||||
});
|
||||
}
|
||||
for (i = 0; i < rows; i++) {
|
||||
row = {};
|
||||
for (j = 0; j < cells; j++) {
|
||||
row['field' + j] = 'Row-' + i + '-' + j;
|
||||
}
|
||||
data.push(row);
|
||||
}
|
||||
|
||||
if ( $('.navbar-fixed-top').css('height') ) {
|
||||
stickyHeaderOffsetY = +$('.navbar-fixed-top').css('height').replace('px','');
|
||||
}
|
||||
if ( $('.navbar-fixed-top').css('margin-bottom') ) {
|
||||
stickyHeaderOffsetY += +$('.navbar-fixed-top').css('margin-bottom').replace('px','');
|
||||
}
|
||||
|
||||
$el.bootstrapTable('destroy').bootstrapTable({
|
||||
columns: columns,
|
||||
data: data,
|
||||
search: true,
|
||||
stickyHeader: true,
|
||||
stickyHeaderOffsetY: stickyHeaderOffsetY + 'px'
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
35
public/assets/bt/extensions/toolbar.html
Normal file
35
public/assets/bt/extensions/toolbar.html
Normal file
@@ -0,0 +1,35 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Advanced Toolbar</title>
|
||||
<meta charset="utf-8">
|
||||
<link rel="stylesheet" href="../assets/bootstrap/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../assets/bootstrap-table/src/bootstrap-table.css">
|
||||
<link rel="stylesheet" href="../assets/examples.css">
|
||||
<script src="../assets/jquery.min.js"></script>
|
||||
<script src="../assets/bootstrap/js/bootstrap.min.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/bootstrap-table.js"></script>
|
||||
<script src="../assets/bootstrap-table/src/extensions/toolbar/bootstrap-table-toolbar.js"></script>
|
||||
<script src="../ga.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>Advanced toolbar</h1>
|
||||
<table id="table"
|
||||
data-toggle="table"
|
||||
data-pagination="true"
|
||||
data-search="true"
|
||||
data-advanced-search="true"
|
||||
data-id-table="advancedTable"
|
||||
data-url="../json/data1.json">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-field="id" data-sortable="true">ID</th>
|
||||
<th data-field="name" data-sortable="true">Item Name</th>
|
||||
<th data-field="price" data-sortable="true">Item Price</th>
|
||||
</tr>
|
||||
</thead>
|
||||
</table>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user