Как объединить несколько столбцов в один из них?

Question

У меня есть 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") 
       }); 
      }); 
     }); 

Answer 1

Вы можете просто добавить data-hide="all" в первых двух столбцах этих трех:

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

Merge те, в 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 
    }); 
}); 

Answer 2

Не знаете, как вы это сделаете, в состоянии, в кендо, вы сделали бы это так.

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