目前很多项目前台都使用bootstrap技术,初次接触时看了点网上的视频教程,深深地被它的样式所吸引,因为它是一个响应式的框架,可以根据浏览器的宽高自适应显示。
作为一名后台开发人员,bootstrap
table分页的实现是后台必备的利器。以下是在guns框架的bootstrap-table-object.js文件中对bootstrap
table的js封装。
/**
* 初始化 BootStrap Table 的封装
*
* 约定:toolbar的id为 (bstableId + "Toolbar")
*
* @author fengshuonan
*/
(function () {
var BSTable = function (bstableId, url, columns) {
this.btInstance = null; //jquery和BootStrapTable绑定的对象
this.bstableId = bstableId;
this.url = Feng.ctxPath + url;
this.method = "post";
this.paginationType = "server"; //默认分页方式是服务器分页,可选项"client"
this.toolbarId = bstableId + "Toolbar";
this.columns = columns;
this.height = 665; //默认表格高度665
this.data = {};
this.queryParams = {}; // 向后台传递的自定义参数
};
BSTable.prototype = {
/**
* 初始化bootstrap table
*/
init: function () {
var tableId = this.bstableId;
this.btInstance =
$('#' + tableId).bootstrapTable({
contentType: "application/x-www-form-urlencoded",
url: this.url, //请求地址
method: this.method,