BootstrapTable使用技巧

用户交易

        <table id="orderTable"
               data-method="post"
               data-toggle="table"
               data-toolbar="#toolbar"
               data-height="600"
               data-side-pagination="server"
               data-pagination="true"
               data-page-list="[5, 10, 20, 50, 100, 200]"
               data-search="true" data-show-refresh="true" data-show-toggle="true"
               data-show-columns="true">
            <thead>
            <tr>
                <th data-field="userName">商户名称</th>
                <th data-field="time">日期</th>
                <th data-field="successAliPay">支付宝金额</th>
                <th data-field="successAliCount">支付宝笔数</th>
                <th data-field="successWeixinPay">微信金额</th>
                <th data-field="successWeixinCount">微信笔数</th>
                <th data-field="totalAmount">总金额</th>
                <th data-field="count">总笔数</th>
            </tr>
            </thead>
        </table>

    </div>
    <div class="box-footer">
        <button type="button" class="btn btn-danger pull-left" data-toggle="slider" data-target="#tableDiv">关闭
        </button>
    </div>
</div>
复制代码

通过data-field 的值会从后端返回的数据直接渲染到页面上。

operateFormatter = function (value, row, index) { return [ '' + '   ' + '' + '   '

].join('');
复制代码

}

window.operateEvents = { // 编辑实名认证

'click .real': function (e, value, row, index) {
    if (row.realName) {
        hint("商户已经实名认证");

    } else {
        $("#realNameAuthDiv").toggleClass('slide-open');
        $("#upUserId").val(row.id);
        $("#realNameAuth").val("");
    }
},
复制代码

operateFormatter和window.operateEvents 是两个一起使用的方法，对其进行操作。

bootstraptable 中如果出现多个相同的#toolbar ,会出现排序错误，做法为将toolbar放在弹出框中或者将其他的toolbar重新写样式。