支持三种方式bootstrap table绑定数据:1.html格式数据(即静态数据);2.JavaScript传递数据;3.数据属性变量动态获取。
静态表格:data-toggle="table"(推荐学习:Bootstrap视频教程)
<table data-toggle="table"> <thead> <tr> <th>Item ID</th> <th>Item Name</th> <th>Item Price</th> </tr> </thead> <tbody> <tr> <td>1</td> <td>Item 1</td> <td>$1</td> </tr> <tr> <td>2</td> <td>Item 2</td> <td>$2</td> </tr> </tbody> </table>
JavaScript方式
<table id="table"></table> <!--定义一个表格,无需设置表头,统一在JS中初始化,灵活度较高(梁新建议)--> <script> $('#table').bootstrapTable({ url: 'data1.json', pagination: true, search: true columns: [{ field: 'id', title: 'Item ID' }, { field: 'name', title: 'Item Name' }, { field: 'price', title: 'Item Price' }, ] }) </script>
数据属性变量动态获取
<table data-toggle="table" data-url="data1.json" data-pagination="true" data-search="true"> <thead> <tr> <th data-sortable="true" data-field="id">Item ID</th> <th data-field="name">Item Name</th> <th data-field="price">Item Price</th> </tr> </thead> </table>
更多Bootstrap相关技术文章,请访问Bootstrap教程栏目进行学习!
作者:(*-*)浩
JavaScript是一种流行的编程语言,它可用于构建动态和交互性的Web应用程序。与HTML和CSS不同,JavaScript是一种编程语言,可为We...
在css中,可以通过给div元素添加“text-align: right;”样式来让div里面的文字靠右。text-align属性可以设置元素中的文本的水平...
本篇文章介绍了关于html中的include的配置用法,让HTML文件也能实现include的功能,现在我们一起来看看这篇关于html include的文...
1.方法一:!DOCTYPE htmlhtml lang=enheadmeta charset=UTF-8meta http-equiv=X-UA-Compatible content=IE=edgemeta name=viewpo...
我们学习了解了这么多关于PHP的知识,不知道你们对PHP高级检索功能的实现以及动态拼接sql是否已经完全掌握了呢,如果没有,那就...