一，頁面js程式碼如下：

(function(document, window, $) {
    'use strict';
    (function() {
        var $tableReward = $('#tableReward'); //主表
        var options = {
            url : '********',     //載入主表的URL
            striped: true,
            search: false,
            showRefresh: true,
            showColumns
 
: true,
            minimumCountColumns: 2,
            clickToSelect: true,
            pagination: true,
            icons:{                        //為了顯示主表的加號（點選加號 會載入子表）
                paginationSwitchDown: 'glyphicon-collapse-down icon-chevron-down',
                paginationSwitchUp: 'glyphicon-collapse-up icon-chevron-up'
 
,
                refresh: 'glyphicon-refresh icon-refresh',
                toggle: 'glyphicon-list-alt icon-list-alt',
                columns: 'glyphicon-th icon-th',
                detailOpen: 'glyphicon-plus icon-plus',
                detailClose: 'glyphicon-minus icon-minus'
},
            paginationLoop
 
: false,
            sidePagination: 'server',
            silentSort: false,
            smartDisplay: false,
            escape: true,
            searchOnEnterKey: true,
            idField: 'id',
            maintainSelected: true,
            toolbar: '#toolbar',
            requestParams : function(params) {
                return {         //首次載入主表的引數
                    key:value,

    key:value,

    key:value

    }, 

//表格引數

columns: [                

{field: 'ck', checkbox: true, visible: false},                

{field: 'id', title: 'ID', visible: false, align: 'center'},                

{field: 'key', title: '屬性名', visible: false, align: 'center'},                

{field: 'key', title: '屬性名', visible: false, align: 'center'},                

{field: 'key', title: '屬性名',align:"center"},                

{field: 'action', title: '操作',align:"center", formatter: 'actionFormatter', events: 'actionEvents', clickToSelect: false}            

],            

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

InitSubTable(index, row, $detail);  

}//該方法是呼叫下面的初始化子表結構  

//（其實就是在主表你點的那一行裡面 新增一個表格 資料動態載入，三個引數不能修改固定 行號 當前航物件 主表td）        

};        

ENCI.common.bootstrapTable.loadTable($tableReward, options);//載入主表

//下面就是子表的結構 初始化
        var $child_table;
        window.InitSubTable = function (index, row, $detail) {
            var planId = row.id;
            $child_table = $detail.html('<table style="background-color: #8CD4F5" id="child_table"></table>').find('table'); //建立子表
            var options = {
                url: '********',//子表的非同步載入URL
                method: 'get',
                search: false,
                pagination: false,
                paginationLoop: false,
                requestParams : function(params) {//子表載入過程中的引數
                    return { planId: planId }
                },
                ajaxOptions: { planId: planId },
                clickToSelect: true,
                detailView: false,//父子表
uniqueId: "rid",
                columns:
                    [
                        { checkbox: true},
                        {field: '屬性',title: '屬性名',align:"center",visible: false},
                        {field: '屬性, title: '屬性名',align:"center",visible: false},
                        {field: 'action', title: '操作',align:"center", formatter: 'childFormatter', events: 'actionEvents', clickToSelect: false}
                    ]
            };

            ENCI.common.bootstrapTable.loadTable($child_table, options);//載入子表
        };
        // 格式化子表的操作按鈕
window.childFormatter = function childFormatter(value, row, index) {

            var u = $('#rule_update').length < 1?'':'<button class="update btn btn-warning btn-xs " id="child_updateAction"  onclick="child_updateAction('+"\'"+row.rid+"\'"+')" title="編輯" type="submit">編輯</button>';
            var d = $('#rule_delete').length < 1?'':'<button class="remove btn btn-danger btn-xs" id="child_deleteAction" onclick="child_deleteAction('+"\'"+row.rid+"\'"+')" type="submit">刪除</button>';
            return u + '  ' + d;
        }

二，以上是頁面初始化就載入主表的js程式碼， 而頁面只需要你定義一個表格讓該表格的id 和主表的初始化 id 一致即可自動渲染資料！

如有問題請加qq群:139496923