Twitter bootstrap 带附加列的子表的引导表

我使用的是bootstrap table（），我有一个嵌套子表的情况。在我的子表中，我有多行，每个子表中有一个额外的列。如下所示：

    #   |   Project     |   Number of Lines
+   1   |   ABC         |   15,000

        #   |   Project     |   Repo    |   Number Of Lines
    +   1   |   ABC         |   abc     |   1500

            #   |   Project     |   Repo    |   Language    |   Number Of Lines
            1   |   ABC         |   abc     |   java        |   1000
            2   |   ABC         |   abc     |   xml         |   500

    +   2   |   ABC         |   def     |   1440
    +   3   |   ABC         |   ghi     |   1200
    +   4   |   ABC         |   kbc     |   1700

+   2   |   DEK         |   15,000
+   3   |   TREM        |   15,000
+   4   |   BER         |   15,000

您认为可以使用引导表库在子表中增加列吗？如果是这样，有人能举个例子吗？我感谢你的帮助

谢谢,，

---

Ravi Hasija

是的，因为传递到detailView的内容就是使用的内容，因此如果您在那里创建/使用的表有更多的列，它将显示这些列

这就是为什么没有“子表”选项，只有

detailView

以及传递甚至动态创建所需内容的能力

---

它使用索引打印列，不通过url或其他方式传递任何数据

但您可以清楚地看到，

buildTable

只是打印出一个

并在触发

OnExpandRow

时调用该新表上的

bootstrapTable

初始化代码，然后在下一个

OnExpandRow

上再次调用

buildTable

，并无限期地执行

无论父表是什么，您在

detailView

中放入的任何表都是所使用的

---

展开几行后，只需使用F12查看输出。

请发布一些代码，这样对您和其他人都会有帮助。请更新此线程，接受答案或通过注释提供详细信息，或编辑其不回答您问题的原因

<div class="container">
    <h1>Sub Table</h1>
    <p>Use <code>onExpandRow</code> event to handle your detail view.</p>
    <table id="table"
           data-detail-view="true">
        <thead>
        <tr>
            <th data-field="id">ID</th>
            <th data-field="name">Item Name</th>
            <th data-field="price">Item Price</th>
        </tr>
        </thead>
    </table>
</div>
<script>
    var $table = $('#table');
    $(function () {
        buildTable($table, 8, 1);
    });
    function expandTable($detail, cells) {
        buildTable($detail.html('<table></table>').find('table'), cells, 1);
    }
    function buildTable($el, cells, rows) {
        var i, j, row,
                columns = [],
                data = [];
        for (i = 0; i < cells; i++) {
            columns.push({
                field: 'field' + i,
                title: 'Cell' + i,
                sortable: true
            });
        }
        for (i = 0; i < rows; i++) {
            row = {};
            for (j = 0; j < cells; j++) {
                row['field' + j] = 'Row-' + i + '-' + j;
            }
            data.push(row);
        }
        $el.bootstrapTable({
            columns: columns,
            data: data,
            detailView: cells > 1,
            onExpandRow: function (index, row, $detail) {
                expandTable($detail, cells - 1);
            }
        });
    }
</script>