Bootstrap-Table文档
接上一篇。上回简单介绍了BootstrapTable的常用函数,这回主要介绍属性设置。
以上简写成“骨架”。分三步用,
1.引用,
注意点:js的引用顺序,js包里面可以理解为从上到下的程序集,BootstrapTable以Jquery为基础的,所以一定以Jquery引用为先,接着是bootsrtap.js,最后是Bootstrap-Table.js。
2.HTML标签
注意点:一般写在Table标签里,数据放到哪个Table呢,这里用的Jquery获取DOM id为ID的对象。当然也可以使用类选择器,最好是唯一,建议用id选择器标识。
3.使用函数
这里举例的是其中一个最最常用的bootstrapTable({...}),以Ajax形式取数据的函数。
属性Url:"路径"。路径。可以是本地JSON文件,可以是预定义的JSON数据,也可以是路由到后端(后台)取数据的方法,
例如通过服务器路由到达MVC中的Controller里的GetData(string id)
属性queryParams,可选参数,如刚才所说GetData方法中的id
queryParams:function(){return id:"123"}//这里是一个function
也可以直接写{id:"123"}
属性columns:定是各列数据。是JSON格式[{},{},{}……]
定义每一列以这样的形式{键:值},
常用的有:
{field:"后台返回JSON数据或对象的属性名",
title:"显示在表格上的列名",
}
以上定义列中还会有一些可选属性formatter、editable,如editable需要另外引入相应的js文件。
Bootstrap-table的入门分享到这里,认为远远不止这些,动手才是入门的正式开始,一起加油吧!
建议看看文档例子。
谢谢阅读。下回继续分享Bootstrap File Input上传插件。
fileinput上传插件
举例工作中开发物流分车程序的代码,代码定义两列“序号”、"车号"
发表评论