原创

BoostrapTable 的跳转到操作的页数以及打开操作的子类表格,以及单击表格打开子类表格

如图,因为项目需求,需要点击批量操作时候处理父类表格里所有的处理状态,此种情况下不需要打开子类表格,直接默认操作好,然后自动刷新父类表格显示的内容即可。
file
file
开始做的就只是将table里的方法重新调用了一下,但是发现调用完就又回到了第一页,后来想用
$("#rightTable").bootstrapTable('refresh');
但是发现没什么乱用,后来就想到先获取当前页数,然后再跳转到当前页数就可以了。

 var pagenum=$('#rightTable').bootstrapTable('getOptions').pageNumber;
  $('#rightTable').bootstrapTable('selectPage', pagenum);

但是我在子类表格里,如下图,我也可以单独点击处理状态去操作处理,处理完以后也得刷新子类表格的数据,
file
开始做的是获取表格的下标,然后操作一遍关开,就自动刷新表格数据了

$('#rightTable').bootstrapTable('collapseRow', bjclyjIndex);
 $('#rightTable').bootstrapTable('expandRow', bjclyjIndex);

当然你得在onExpandRow里需要清楚的知道当前下标的子类表格的打开状态,即关闭还是打开
indexMap[index] = 'false';

   onExpandRow: function (index, row, $detail) {

                bjclyjIndex=index;
                 var t = $(window).scrollTop();
              $('body,html').animate({'scrollTop': t + 200})
                loadSonTable($detail, row.sbname, station, startTime, endTime, ftypeName, finfo, t_syschname, index,row.childtype);
                alarmkey = row.sbname + "," + station + "," + startTime + "," + endTime + "," + ftypeName + "," + finfo + "," + t_syschname;
                //存入map中
               indexMap[index] = 'true';
            },
   onCollapseRow:function (index, row, $detail) {
                //存入map中
               indexMap[index] = 'false';
            },

但是这种后来被自己做做的就否定了,因为刷新不了父类的表格数据,因为未处理的条数也是要刷新变化的,所以后来采用的是先获取页数,跳转到之前的页数,因为要打开,所以讲开关的状态置为false,打开就可以了

 var pagenum=$('#rightTable').bootstrapTable('getOptions').pageNumber;
  $('#rightTable').bootstrapTable('selectPage', pagenum);
 indexMap[bjclyjIndex] = 'false';
 $('#rightTable').bootstrapTable('expandRow', bjclyjIndex)

单击父类表格打开子类表格: 也是根据indexMap[index]的状态来判断的,onClickRow为父类表格单击方法。

onClickRow:function (row,$element) {
                var index = $element.data('index');
                if (indexMap[index]=='true') {
                    //关闭子表格
                    $('#rightTable').bootstrapTable('collapseRow', index);
                } else {
                    //展开子表格
                    $('#rightTable').bootstrapTable('expandRow', index);
                }
            }
正文到此结束
本文目录