工作小总结

bootstrap的一些事件,获取对象,以及属性一览

方法1$('#table').bootstrapTable({ onEventName:function(arg1,arg2,...){//...}})vartable=$('#user');table..bootstrapTable({ onAll:function(arg1,arg2,...){}, onClickRow:funct

方法1

$('#table').bootstrapTable({

  onEventName: function (arg1, arg2, ...) {// ...}

})


var table=$('#user');

table..bootstrapTable({

  onAll: function (arg1, arg2, ...) {},

  onClickRow: function (arg1, arg2, ...) {},

}


方法2、

$('#table').on('event-name.bs.table', function (e, arg1, arg2, ...) {// ...})

$('#table').on('click-row.bs.table', function (e, arg1, arg2, ...) {})

 


onAll(name,args)           任何事件触发都会同时触发该事件(事件名称|事件数据)           all.bs.table                                                            

onClickRow(row, $element, field)   当点击某一行时触发(出发改事件这一行的数据|tr元素|与单击的单元格对应的字段名称)      click-row.bs.table

onDblClickRow( row, $element, field)                      当双击击某一行时触发 (参数同上)                                                              dbl-click-row.bs.table

onClickCell(field, value, row, $element)      当点击某一个单元格时触发(单击的单元格对应的字段名|该单元格的数据值|对应于单击行的记录|td元素)      click-cell.bs.table

onDblClickCell(field, value, row, $element)  当双击某一个单元格时触发(参数同上)                                                        dbl-click-cell.bs.table

onSort(name, order)                       当用户点击表头对某一字段列进行排序时触发(该列字段名称|排序列顺序)                                    sort.bs.table

onCheck(row, $element)                当用户选中一行时触发(对应于单击行的记录|选中的DOM元素)                                                                 check.bs.table

onUncheck(row, $element)            当用户取消选中一行时触发 ( 参数同上)                                                                       uncheck.bs.table

onCheckAll(rows)                          当用户点击全选框时触发 (与选中的行对应的数据数组)                                                           check-all.bs.table

onUncheckAll(rows)                      当用户点击全选框取消选择时触发(与取消的行对应的表数据数组)                                             uncheck-all.bs.table

onCheckSome(rows)                     当用户选中某些行时触发                                                           check-some.bs.table

onUncheckSome(rows)                 当用户取消选中某些行时触发                                                 uncheck-some.bs.table

onLoadSuccess(data)                   当远程数据被加载完成后触发当服务器发送的格式不和规范在这里修改在返回                                                   load-success.bs.table

onLoadError(status, jqXHR)         当远程数据被加载出错后触发(jqXHR的状态代码|XMLHTTPRequest对象)                                                    load-error.bs.table

onColumnSwitch(field, checked) 当切换列的显示状态(可见或不可见)时触发(该列字段名|该列的选中状态)                        column-switch.bs.table

onPageChange (number, size)  当切换每页条数时触发(页码,每页多少条)                                                            page-change.bs.table

onSearch( text)    当对表格内容进行搜索时触发                                                          search.bs.table

onToggle(cardView表的cardView状态)     当切换表格的显示视图时触发                                                          toggle.bs.table

onPreBody(data渲染数据)  在对表格体进行渲染前触发                                                             pre-body.bs.table

onPostBody(data)   在表格体渲染完成,并在 DOM 中可见后触发                              post-body.bs.table

onPostHeader(undefined)  在表格列头渲染完成,并在 DOM 中可见后触发                        post-header.bs.table

onExpandRow(index, row, $detail)   当点击详情按钮展开详情视图时触发                                        expand-row.bs.table

onCollapseRow(index, row) 当点击关闭详情按钮收起详情视图时触发                                 collapse-row.bs.table

onRefreshOptions(options)  当刷新表格选项时,在销毁当前表格并重新初始化新表格之前触发          refresh-options.bs.table

onResetView(undefind)  当重置表格视图时触发                                                                 reset-view.bs.table

onRefresh(params) 当点击刷新按钮对表格进行刷新时触发(请求到服务器的附加参数?)                                              refresh.bs.table

onScrollBody( undefined)  当对表格体进行滚动时触发                                                           scroll-body.bs.table

onColumnSearch()  ???对列内容进行搜索时触发

BootStrap Table:事件、方法、多语言

 方法:


用法


$('#table').bootstrapTable('method', parameter);


如;

$('#table').bootstrapTable('getOptions');

$('#table').bootstrapTable('getRowByUniqueId',id);

 


bootstrapTable('getOptions');          获取表格的参数

bootstrapTable('getSelections');       获取当前被选中的行    

bootstrapTable('getAllSelections');    获取当前被选中的行数据,包含搜索和过滤前的

bootstrapTable('showAllColumns');      展示所有列

bootstrapTable('hideAllColumns');      隐藏所有列

bootstrapTable('removeAll');           移除表格中的所有数据

bootstrapTable('showLoading');         显示数据加载状态提示

bootstrapTable('hideLoading');         隐藏数据加载状态提示

bootstrapTable('checkAll');            选中当前页的所有行

bootstrapTable('uncheckAll');          取消选中当前页的所有行

bootstrapTable('checkInvert');         对当前页内行数据进行反选,会触发onCheckSome 和 onUncheckSome 事件

bootstrapTable('resetWidth');          重新设置列头和列尾的宽度去适应当前列的宽度

bootstrapTable('destroy');             销毁表格

bootstrapTable('getHiddenColumns');    获取隐藏的列

bootstrapTable('getVisibleColumns');   获取可见的列

bootstrapTable('getScrollPosition');   获取当前滚动条的位置,单位像素

bootstrapTable('prevPage');            上一页

bootstrapTable('nextPage');            下一页

bootstrapTable('togglePagination');    切换分页参数

bootstrapTable('toggleView');          切换 card/table 视图

bootstrapTable('getData',useCurrentPage=true);     获取当前表格中加载的数据,参数useCurrentPage为true 将返回当前页内的数据

bootstrapTable('getRowByUniqueId',id);             根据唯一ID获取行数据

bootstrapTable('load',data);                       将新数据加载到表格中 一旦成功加载将替换原数据输出在html,data的格式为数组形式的json如:data = "[{"a": 1}, {"a": 2}]";JSON.parse(data);bootstrapTable('load',data);

bootstrapTable('append',data);                     将新数据加载到表格末尾中 data的格式同load一样

bootstrapTable('prepend',data);                    将新数据插入到表格头部  data的格式与load一样

bootstrapTable('remove',field,values);             从表格中移除列名为指定值的数据,包含2个参数field: 列名values: 列名取值数组

bootstrapTable('removeByUniqueId',id);             根据唯一ID移除行数据         

bootstrapTable('insertRow',index,row);             插入多个新行到指定位置,每一行包含以下参数 index:要插入到行的索引 row

原创不易,完成人机校验,阅读全文

相关推荐