Bootstrap Table 学习笔记之表格参数（二）

showHeader

是否显示列头，默认值为true，设置为false时将不显示列头。

showFooter

是否显示列脚，默认值为false，设置为true时将不显示列脚。

showRefresh

是否显示刷新按钮，默认值为false，设置为true时将显示刷新按钮。

• 代码示例：

• 效果：

image.png

cardView

设置为true将显示card视图，适用于移动设备。否则为table试图，适用于pc。默认值为false。

• 代码示例：

• 效果：

  
  
  

  image.png

showToggle

是否显示切换试图（table/card）按钮，设置为true时显示，默认值是false。

• 代码示例：

• 效果：

image.png

image.png

showColumns

是否显示内容列下拉框，设置为true时将在右上角显示按钮，点击按钮显示下拉框，可在下拉框勾选需要显示的列参数，默认值为false。

• 代码示例：

• 效果：

image.png

image.png

minimumCountColumns

当列数小于此值时，将无法使用内容列下拉框。

• 代码示例：

• 效果：

image.png

如图所示，当我的数据小于5条时，下拉框中的复选框变为灰色禁用状态，无法进行勾选。

detailView

设置为 true 启用显示详情功能，默认值是false。

detailFormatter

格式化详情页面的视图。

• 使用说明：这两个属性一般要同时使用。先将dertailView设置为true值，再用detailFormatter定义详情页面该如何显示，显示哪些数据。
• 代码示例：

• 效果：

image.png

clickToSelect

设置true将在点击行时自动选择rediobox 和 checkbox，默认值是false。

• 使用说明：先在表格中定义一列选择列，即在culumns中增加一个checkbox: true（启用复选框）的项，再设置clickToSelect为true。

• 效果：

  
  
  

  image.png
  
  

  不再显示全选框，只允许勾选一行。

rowStyle

自定义行样式 参数为：row: 行数据，index: 行下标，返回值可以为class或者css。

• 代码示例：

• 效果：

image.png

如图所示，表格内字体变为蓝色。

toolbar

一个jQuery 选择器，指明自定义的表格工具栏，例如:#toolbar, .toolbar。

• 使用方法：使用之前要把工具栏先写出来，例如：

     删除

再指定toolbar为其id/css。

• 代码示例：

    

        删除
    
    

• 效果：

image.png

searchAlign

指定搜索框水平方向的位置。'left' or 'right'，默认值为right。

buttonsAlign

指定按钮水平方向的位置。'left' or 'right'，默认值为right。

toolbarAlign

指定自定义表格工具栏水平方向的位置。'left' or 'right'，默认值为right。