如何将多个列连接到一个可填充的列中?

时间:2017-01-03 23:08:42

标签: javascript json footable

我有一个FooTable,可以将部件号作为3个单独的单元格返回。我想将它们组合成一个单元格,但我不确定格式化程序和解析器如何为FooTable工作。我的表格html只是一个空表,一切都在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")
               });
            });
        });

2 个答案:

答案 0 :(得分:1)

您只需将data-hide="all"添加到这三个中的前两列:

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

合并php(你擅长的)中的那些,并在这里将它们显示为dataset和Voila中的一个列。

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

如果您不想/不想更改服务器端代码,另一个选择是获取数据并对其进行更改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
   });
});

答案 1 :(得分:-1)

不确定你是如何做到这一点的,在剑道中,你会这样做。

$(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")
           });
        });
    });