如何从html表加载嵌套数据

qmb5sa22  于 2021-09-13  发布在  Java
关注(0)|答案(0)|浏览(252)

我来找你们是因为我在我的laravel项目中使用了library制表器,我在处理嵌套数据时遇到了一些困难。要加载html制表器表,我必须通过html表和js端的对象数组来完成。在js方面,我知道怎么做,但在通过html表加载时遇到了问题。文件中说:
您可以使用columns选项以常规方式定义列,也可以将它们设置为表的thead中的th元素。
表格主体中的任何数据行都将自动转换为表格中显示的制表器数据。
您可以直接在html中通过在表和th元素上使用tablator-attributes设置选项参数,然后将这些设置为表上的配置选项。
不幸的是,对于通过html元素传递的属性来说,它似乎非常有限。因为在js端,我们必须使用如下对象来添加数据(包括嵌套数据):

[
    {id:1, name:"Billy Bob", age:"12", "_children":[
        {id:2, name:"Mary May", age:"1"}, //child rows nested under billy bob
        {id:3, name:"Christine Lobowski", age:"42"},
        {id:4, name:"Brendon Philips", age:"125", "_children":[
            {id:5, name:"Margret Marmajuke", age:"16"}, //child rows nested under brendon philps
            {id:6, name:"Frank Peoney", age:"12"},
        ]},
    ]},
    {id:7, name:"Jenny Jane", age:"1"},
    {id:8, name:"Martha Tiddly", age:"42", "_children":[
        {id:9, name:"Frasier Franks", age:"125"}, //child row nested under martha tiddly
    ]},
    {id:10, name:"Bobby Green", age:"11"},
]

但在html制表器表端,我完全不知道。文档中未提及任何内容。但是,我尝试了类似的方法,但没有成功:

<table id="mytable">
    <thead>
        <tr>
            <th tabulator-field="data0">Data 0</th>
            <th tabulator-field="data1">Data 1</th>
            <th tabulator-field="data2">Data 2</th>
            <th tabulator-field="_children"></th>
        </tr>
    </thead>
    <tbody>
        @foreach ($orderlines as $orderline)
        <!-- @foreach -> syntaxe blade blade syntax that is unique to Laravel -->
        <tr>
            <td>{{ $object->getData0() }}</td>
            <td>{{ $object->getData1() }}</td>
            <td>{{ $object->getData2() }}</td>
            <td>[
                {data0:1, data1:"Billy Bob", data2:"12", "_children":[
                {data0:2, data1:"Mary May", data2:"1"}, //child rows nested under billy bob
                {data0:3, data1:"Christine Lobowski", data2:"42"},
                {data0:4, data1:"Brendon Philips", data2:"125", "_children":[
                {data0:5, data1:"Margret Marmajuke", data2:"16"}, //child rows nested under brendon philps
                {data0:6, data1:"Frank Peoney", data2:"12"},
                ]},
                ]},
                ]</td> <!-- example of json object -->
        </tr>
        @endforeach
    </tbody>
</table>
<script>
    new Tabulator("#mytable", {
        dataTree:true
    });
</script>

如果有人有想法,我会感兴趣:)

暂无答案!

目前还没有任何答案,快来回答吧!

相关问题