如何将多个列合并为一个 footable？

Question

我有一个 FooTable，它以 3 个单独的单元格形式返回部件号。我想将它们合并到一个单元格中，但我不确定格式化程序和解析器如何为 FooTable 工作。我的 table html 只是一个空的 table，一切都在 javascript 中处理。我该怎么做？

$(document).ready(function() {
            jQuery(function($){
               $('.table').footable({
                "expandFirst": false,
                "columns": [
                    { "name": "PartID", "title":"PartID", "visible":false },
                    {"formatter": function(value){
                        return //I'm thinking this is where the code would go to join the next 3 columns? in the format ##.###.##
                    }},
                    { "name": "PartCategory", "title": "PC" },
                    { "name": "PartNumber1", "title": "PN1" },
                    { "name": "PartNumber2", "title": "PN2",  },
                    { "name": "PartName", "title": "Name",  },
                    { "name": "DescShort", "title": "Description",  },
                    { "name": "SupplierName", "title": "Supplier", },
                    { "name": "SupplierPartNumber", "title": "Supplier Part #",  }
                ],
                "rows": $.getJSON("../dist/scripts/testGetParts.php")
               });
            });
        });

Answer 1

不确定你是怎么做到的 persay in footable，在 kendo 你会这样做。

$(document).ready(function() {
        jQuery(function($){
           $('.table').footable({
            "expandFirst": false,
            "columns": [
                { "name": "PartID", "title":"PartID", "visible":false },
                { "title":"PartNumber", formatter: function(data){
                    return data.PartCategory +"."+ data.PartNumber1 +"." + PartNumber2;
                }},
                { "name": "PartName", "title": "Name",  },
                { "name": "DescShort", "title": "Description",  },
                { "name": "SupplierName", "title": "Supplier", },
                { "name": "SupplierPartNumber", "title": "Supplier Part #",  }
            ],
            "rows": $.getJSON("../dist/scripts/testGetParts.php")
           });
        });
    });

Answer 2

您只需将 data-hide="all" 添加到这三列的前两列即可：

{ "name": "", "title": "",  data-hide="all"},
{ "name": "", "title": "",  data-hide="all"},
{ "name": "Part Info", "title": "Part Information" }

合并 php 中的那些（你擅长的），然后将它们作为一个列显示在你的 dataset 中，瞧瞧。

如果您可以更改 dataset，则更简单的版本是根本不添加那些 columns。

如果您cannot/don不想更改服务器端代码，另一种选择是获取数据并更改它js，然后将它们绑定到行。

var rows = $.getJSON("../dist/scripts/testGetParts.php");
foreach(row in rows) {
    //merge those cols here in the third one
}

然后：

jQuery(function($){
   $('.table').footable({
    "expandFirst": false,
    "columns": [
        { "name": "PartID", "title":"PartID", "visible":false },
        { "name": "PartCategory", "title": "PC", data-hide="all" },
        { "name": "PartNumber1", "title": "PN1", data-hide="all"},
        { "name": "Part Info", "title": "Part information" },
        { "name": "PartName", "title": "Name",  },
        { "name": "DescShort", "title": "Description",  },
        { "name": "SupplierName", "title": "Supplier", },
        { "name": "SupplierPartNumber", "title": "Supplier Part #",  }
    ],
    "rows": rows
   });
});

如何将多个列合并为一个 footable？

How do I join multiple columns into one in footable?

javascript

json

footable