获取表头信息
function buildColumnsStyle(url,align,valign,ignore) {
$.ajax({
'method': 'GET','url': url,'async': false,'success': function (data,status) {
//此处设置columns
}
});
}
buildColumnsStyle('/api/v1/ArticleItem/info','center',null,[]);
//动态表格渲染
$(function () {
$table.bootstrapTable({
columns: columns,//表格的列，取决于后台获取的数据
pageList: [10,20,50],//表格每页数据条数控制
onClickCell: function (row,field,value,$element) {
//单元格事件
},onPageChange: function (number,size) {
//表格页面切换事件
}
});
//搜索按钮事件，用于bootstrap table 数据加载
$('#searchArticle').click(function () {
$.get(generateSearchArticleUrl(true),function (data,status) {
//创建bootstrap模态对话框
createBootstrapModal(data.result,100);
createLabels(data.result);
//数据加载
if (data.success && data.result.length != 0) {
$table.bootstrapTable('load',{data: data.result});
} else {
$table.bootstrapTable('load',{data: []});
}
renderLabels();
});
});
});
以上所述是小编给大家介绍的bootstrap table实例详解。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助，如果觉得编程之家不错，可分享给好友！感谢支持。
原文链接：https://www.f2er.com/bootstrap/42821.html