Создать массив объектов из ключей объектов javascript

Question

Я пытаюсь выполнить сопоставление столбцов в удобной электронной таблице, и я хочу динамически загружать электронную таблицу и добавлять каждую строку с помощью флажка. Основываясь на моих исследованиях и в том числе How to add properties dynamically to each object in an javascript array, кажется, что лучший способ сделать это - создать массив объектов для удобного свойства «столбцов». Вы можете видеть это на http://jsfiddle.net/kc11/o4d6gr6n/.

Так что мне нужно сделать, это создать:

[ 
      {data: "check", type: 'checkbox'}, 
      {data: "year", type: 'text'}, 
      {data: "car", type: 'text'}, 
      {data: "available", type: 'text'}, 
      {data: "comesInBlack", type: 'text'}, 
      ] 

от:

function getCarData() { 
    return [ 
     {car: "Mercedes A 160", year: 2006, available: true, comesInBlack: 'yes'}, 
     {car: "Citroen C4 Coupe", year: 2008, available: false, comesInBlack: 'yes'}, 
     {car: "Audi A4 Avant", year: 2011, available: true, comesInBlack: 'no'}, 
     {car: "Opel Astra", year: 2004, available: false, comesInBlack: 'yes'}, 
     {car: "BMW 320i Coupe", year: 2011, available: false, comesInBlack: 'no'} 
    ]; 
    } 

Я начал получать ключи столбцов и предваряя столбец «проверить»:

var keys = $.map(getCarData()[0], function(element,key) { return key; }); 
keys.unshift("check"); 

но с моим ограниченным знанием JS я не уверен, как пройти остаток пути. Может ли кто-нибудь посоветовать мне, что делать дальше?

Answer 1

Я думаю, что вы пытаетесь добавить check ключ каждый объект в массиве возвращается getCarData. Вы не указали значение для ключа, поэтому я установил его для true для каждого объекта.

function getCarData() { 
    return [ 
     {car: "Mercedes A 160", year: 2006, available: true, comesInBlack: 'yes'}, 
     {car: "Citroen C4 Coupe", year: 2008, available: false, comesInBlack: 'yes'}, 
     {car: "Audi A4 Avant", year: 2011, available: true, comesInBlack: 'no'}, 
     {car: "Opel Astra", year: 2004, available: false, comesInBlack: 'yes'}, 
     {car: "BMW 320i Coupe", year: 2011, available: false, comesInBlack: 'no'} 
    ]; 
    }; 
    //This is where I add the 'check' key 
    var addCheckKey=function(obj){ 
     obj.check='true'; 
     return obj; 
    }; 
    var data=$.map(getCarData(),addCheckKey); 

Производит эти данные:

[{"car":"Mercedes A 160","year":2006,"available":true,"comesInBlack":"yes","check":"true"},{"car":"Citroen C4 Coupe","year":2008,"available":false,"comesInBlack":"yes","check":"true"},{"car":"Audi A4 Avant","year":2011,"available":true,"comesInBlack":"no","check":"true"},{"car":"Opel Astra","year":2004,"available":false,"comesInBlack":"yes","check":"true"},{"car":"BMW 320i Coupe","year":2011,"available":false,"comesInBlack":"no","check":"true"}] 

JSFiddle: http://jsfiddle.net/vb1om7om/2/

Проблема с вами код, прежде чем было то, что вы создавали массив ключей для каждого объекта в массиве создаваемого getCarData и добавление нового элемента в этот массив. Это не влияет на исходный объект.

Answer 2

Может перебирает массив и добавить свойство делает что-то вроде:

var myData = getCarData(); 
$.each(myData, function(){ 
    /* add new property "checked" */ 
    this.checked = false 
}); 

/* or */ 
var myData = $.map(getCarData(), function(row){ 
     row.checked = false; 
     return row; 
}); 
/* returns rows like 
{checked:false, car: "Mercedes A 160", year: 2006, available:....}*/ 

Затем используйте checkbox template столбца дефиницию из документации

var example2 = document.getElementById('example2'); 
var hot2 = new Handsontable(example2,{ 
    data:myData, 
    columns: [ 
     { 
     data: "checked", 
     type: "checkbox", 
     checkedTemplate: true, 
     uncheckedTemplate: false 
    }, 
    {data: "year", type: 'text'}, 
    {data: "car", type: 'text'}, 
    {data: "available", type: 'text'}, 
    {data: "comesInBlack", type: 'text'}, 
    ] 
});