bootstrap table 相关

01 height属性

height属性,
若是按照官方的用法,写在table的行间,那么高度是.fixed-table-container.fixed-height 的高度;
若是是采用js生成的状况,则是对应生成表格id所在元素的高度。
若是要自适应页面高度来肯定表格高度
复制代码

02 横向滚动条对不齐的状况

//scrollWidth = fixedBody.scrollWidth > fixedBody.clientWidth &&
 //fixedBody.scrollHeight > fixedBody.clientHeight +this.$header.outerHeight() ?
 scrollWidth = fixedBody.scrollWidth > fixedBody.clientWidth &&
 fixedBody.scrollHeight > fixedBody.clientHeight ? 
 getScrollBarWidth() : 0;
复制代码

上面代码,注释掉的部分是源码中的判断方法,下面是修改的。 原博入口html

以前找到一种方法是注释掉两行代码 我公司用的本身封装的query-table,采用这种方法有个弊端,就是当点击翻页或者查询按钮从新生成表格后仍会出现对不齐的问题。因此最后没采用这个方法。可是值得借鉴。 *注,按下面操做后,影响thead背景色的dom样式还要处理下,bootstrap

if (this.options.showHeader && this.options.height) {
            this.$tableHeader.show();
            //注释掉下面两行 取消表头初始化解决表头和内容不对齐问题
            //this.resetHeader();
            //padding += this.$header.outerHeight();
}
复制代码

原博入口bash

03 纵向表格内出现滚动条自适应

首先须要设置height属性,其次在bootstrap的onLoadSuccess方法内添加判断: 1,数据小于页码显示的数量(默认10条)时,添加数据条数判断; 2,大于页面显示数量,根据屏幕分辨率设定默认显示条数。此处默认条数根据需求而改变。dom

04 bootstrap-table checkbox 根据返回值勾选

bootstrap table colums 写法函数

var columns = [{ 
    field : ‘checked’, 
    checkbox : true, 
    //直接绑定js函数 
    formatter : stateFormatter 
    }]
复制代码

用colums 属性设置 显示的格式ui

//写在colums中就能够直接调用this

function stateFormatter(value, row, index) { 
    if (row.state == true) 
    return { 
    disabled : true,//设置是否可用 
    checked : true//设置选中 
    }; 
    return value; 
} 
复制代码

总结 能够看出bootstrap checkbox 返回是这样的一个结果对象spa

{ 
    disabled : true,//设置是否可用 
    checked : true//设置选中 
    }; 
复制代码

可是 在经过bootstrap $(‘#Table’) .bootstrapTable(‘getAllSelections’) 获取选中的行时候 仍然能够得到到默认加载时选中的数据.net

原文:blog.csdn.net/sun89782780…code

相关文章
相关标签/搜索