2014-02-21 88 views
0

我已經在這裏一段時間了,似乎無法得到此。我也是相對較新的JavaScript。我的目標是創建具有格式通過鍵將json字符串分組並添加到數組

{ 
    data:{ 
    [A1:"first column first row", B1:"second column", C1:"third column",...etc], 
    [A2:"first column first row", B2:"second column", C2:"third column",...etc], 
    [A3:"first column first row", B3:"second column", C3:"third column",...etc], 
    [A4:"first column first row", B4:"second column", C4:"third column",...etc], 
    [A5:"first column first row", B5:"second column", C5:"third column",...etc] 
    } 
} 

這可能是密切相關的Excel如何與行和列格式的陣列(或新的JavaScript對象)。我打算使用它來爲客戶端操縱此數據然後提供handsontable

我現在擁有的是

var file = __dirname + '/../../clientFiles/exceltest.json'; 
fs.readFile(file, 'utf8', function (err, data) { 
    if (err) { 
     sails.log.error('ERROR: ' + err); 
     return; 
    } 
    data = JSON.parse(data); 
    var rows = Object.keys(data); 
    rows.forEach(function(column) { 
     var items = Object.keys(data[column]); 
     items.sort(); 
     items.forEach(function(item) { 
      var value = data[column][item]; 
      console.log(item+' = '+value); 
     }); 
    }); 
}); 

關鍵的名字永遠不會少於2個字符,但可以擴大規模(如A1 => AAA1)就像在Excel中。

該網頁腳本

<div id="dataTable"></div> 
<script> 
$("#dataTable").handsontable({ 
    data: <%= data %>, 
    startRows: 6, 
    startCols: 8, 
    rowHeaders: true, 
    colHeaders: true, 
}); 
</script> 

我pullng的JSON的格式如下

{ 
"sheet1": { 
    "F15": "4,385.97", 
    "G15": "910.36", 
    "H15": "1,555.36", 
    "I15": "373.74", 
    "J15": "24.03%", 
    "K15": "58.53%", 
    "L15": "61", 
    "M15": "669", 
    "N15": "216665", 
    "B16": "01/14/2014", 
    "D16": "829", 
    "E16": "12,997.13", 
    "F16": "531.85", 
    "G16": "225.48", 
    "H16": "359.21", 
    "I16": "80.21", 
    "J16": "22.33%", 
    "K16": "62.77%", 
    "L16": "55", 
    "M16": "99", 
    "N16": "45384", 
    "B17": "01/14/2014", 
    "D17": "320", 
    "E17": "6,142.45", 
    "F17": "1,643.42", 
    "G17": "129.76", 
    "H17": "215.90", 
    "I17": "41.09", 
    "J17": "19.03%", 
    "K17": "60.10%", 
    "L17": "111", 
    "M17": "182", 
    "N17": "35485", 
    "D18": "13478", 
    "E18": "94,735.05", 
    "F18": "6,663.08", 
    "G18": "1,689.97", 
    "H18": "3,054.92", 
    "I18": "839.16", 
    "J18": "27.47%", 
    "K18": "55.32%", 
    "L18": "29", 
    "M18": "996", 
    "N18": "396396" 
}, 
"sheet2": { 
    "F15": "4,385.97", 
    "G15": "910.36", 
    "H15": "1,555.36", 
    "I15": "373.74", 
    "J15": "24.03%", 
    "K15": "58.53%", 
    "L15": "61", 
    "M15": "669", 
    "N15": "216665", 
    "B16": "01/14/2014", 
    "D16": "829", 
    "E16": "12,997.13", 
    "F16": "531.85", 
    "G16": "225.48", 
    "H16": "359.21", 
    "I16": "80.21", 
    "J16": "22.33%", 
    "K16": "62.77%", 
    "L16": "55", 
    "M16": "99", 
    "N16": "45384", 
    "B17": "01/14/2014", 
    "D17": "320", 
    "E17": "6,142.45", 
    "F17": "1,643.42", 
    "G17": "129.76", 
    "H17": "215.90", 
    "I17": "41.09", 
    "J17": "19.03%", 
    "K17": "60.10%", 
    "L17": "111", 
    "M17": "182", 
    "N17": "35485", 
    "D18": "13478", 
    "E18": "94,735.05", 
    "F18": "6,663.08", 
    "G18": "1,689.97", 
    "H18": "3,054.92", 
    "I18": "839.16", 
    "J18": "27.47%", 
    "K18": "55.32%", 
    "L18": "29", 
    "M18": "996", 
    "N18": "396396" 
    } 
} 

我使用我的框架和發動機帆和的NodeJS。我已經能夠對鑰匙進行分類,但是將它們分組並不能解決問題。如果需要,我可以使用underscorejs。

在此先感謝。

+2

你展示在上面並沒有太大的意義,Y的數據結構你定義一個數組就像一個散列,然後一個包含數組的散列......? – htatche

+1

@htatche是對的;您顯示的結構不是有效的JSON。此外,您不清楚您正在尋找什麼樣的分組。將粘貼在底部的JSON數據分成多個工作表,每個工作表具有相同的行和列,但是您在頂部指定的結構每行有一個數組... – sgress454

+0

要確認:您正在尋找將數據分組這樣每行都由一個數組表示,並且該數組中的值表示該行中每列的值?所以,你打算把所有的「A *」鍵放在同一個數組中,所有的「B *」鍵放在另一個數組中等等。 – Kyle

回答

1

以下代碼將適當地格式化您的JSON,但我不確定是否希望將所有表單合併爲一個。

更新:使用您提供的格式,JSON將不會與handsontable一起使用。我已將我的解決方案更新爲正確的格式,幷包含handsontable的集成代碼。

更新2:包含的列定義使表格正確繪製。

Live Demo

JS

var sheets = { 
"sheet1": { 
    "F15": "4,385.97", 
    "G15": "910.36", 
    "H15": "1,555.36", 
    "I15": "373.74", 
    "J15": "24.03%", 
    "K15": "58.53%", 
    "L15": "61", 
    "M15": "669", 
    "N15": "216665", 
    "B16": "01/14/2014", 
    "D16": "829", 
    "E16": "12,997.13", 
    "F16": "531.85", 
    "G16": "225.48", 
    "H16": "359.21", 
    "I16": "80.21", 
    "J16": "22.33%", 
    "K16": "62.77%", 
    "L16": "55", 
    "M16": "99", 
    "N16": "45384", 
    "B17": "01/14/2014", 
    "D17": "320", 
    "E17": "6,142.45", 
    "F17": "1,643.42", 
    "G17": "129.76", 
    "H17": "215.90", 
    "I17": "41.09", 
    "J17": "19.03%", 
    "K17": "60.10%", 
    "L17": "111", 
    "M17": "182", 
    "N17": "35485", 
    "D18": "13478", 
    "E18": "94,735.05", 
    "F18": "6,663.08", 
    "G18": "1,689.97", 
    "H18": "3,054.92", 
    "I18": "839.16", 
    "J18": "27.47%", 
    "K18": "55.32%", 
    "L18": "29", 
    "M18": "996", 
    "N18": "396396" 
}, 
"sheet2": { 
    "F15": "4,385.97", 
    "G15": "910.36", 
    "H15": "1,555.36", 
    "I15": "373.74", 
    "J15": "24.03%", 
    "K15": "58.53%", 
    "L15": "61", 
    "M15": "669", 
    "N15": "216665", 
    "B16": "01/14/2014", 
    "D16": "829", 
    "E16": "12,997.13", 
    "F16": "531.85", 
    "G16": "225.48", 
    "H16": "359.21", 
    "I16": "80.21", 
    "J16": "22.33%", 
    "K16": "62.77%", 
    "L16": "55", 
    "M16": "99", 
    "N16": "45384", 
    "B17": "01/14/2014", 
    "D17": "320", 
    "E17": "6,142.45", 
    "F17": "1,643.42", 
    "G17": "129.76", 
    "H17": "215.90", 
    "I17": "41.09", 
    "J17": "19.03%", 
    "K17": "60.10%", 
    "L17": "111", 
    "M17": "182", 
    "N17": "35485", 
    "D18": "13478", 
    "E18": "94,735.05", 
    "F18": "6,663.08", 
    "G18": "1,689.97", 
    "H18": "3,054.92", 
    "I18": "839.16", 
    "J18": "27.47%", 
    "K18": "55.32%", 
    "L18": "29", 
    "M18": "996", 
    "N18": "396396" 
    } 
}; 

function processJSON(sheets){ 
    var data = []; 

    for(var sheet in sheets){ 
     var curSheet = sheets[sheet]; 
     var rowData = {}; 
     var curRowNum = -1; 
     var nextRowNum; 
     for(var cell in curSheet){ 

      nextRowNum = parseInt(cell.replace(/^\D+/g, ''),10); 
      cellLetter = cell.replace(/[0-9]/g, ''); 
      if(nextRowNum !== curRowNum){ 
       debugger; 
       rowData = {}; 
       data.push(rowData); 
       curRowNum = nextRowNum; 
      } 
      rowData[cellLetter] = curSheet[cell]; 
     } 
    } 
    return data; 
} 

var data = processJSON(sheets); 

console.log(data); 

$('#example').handsontable({ 
    data: data, 
    minSpareRows:0, 
    colHeaders: true, 
    contextMenu: true, 
    columns: [ 
     {data: "A"}, 
     {data: "B"}, 
     {data: "C"}, 
     {data: "D"}, 
     {data: "E"}, 
     {data: "F"}, 
     {data: "G"}, 
     {data: "H"}, 
     {data: "I"}, 
     {data: "J"}, 
     {data: "K"}, 
     {data: "L"}, 
     {data: "M"}, 
     {data: "N"}, 
     {data: "O"}, 
     {data: "P"}, 
     {data: "Q"}, 
     {data: "R"}, 
     {data: "S"} 
     ] 
}); 


function bindDumpButton() { 
    $('body').on('click', 'button[name=dump]', function() { 
     var dump = $(this).data('dump'); 
     var $container = $(dump); 
     console.log('data of ' + dump, $container.handsontable('getData')); 
    }); 
} 
bindDumpButton(); 

結果

[ 
    { 
    "F": "4,385.97", 
    "G": "910.36", 
    "H": "1,555.36", 
    "I": "373.74", 
    "J": "24.03%", 
    "K": "58.53%", 
    "L": "61", 
    "M": "669", 
    "N": "216665" 
    }, 
    { 
    "B": "01/14/2014", 
    "D": "829", 
    "E": "12,997.13", 
    "F": "531.85", 
    "G": "225.48", 
    "H": "359.21", 
    "I": "80.21", 
    "J": "22.33%", 
    "K": "62.77%", 
    "L": "55", 
    "M": "99", 
    "N": "45384" 
    }, 
    { 
    "B": "01/14/2014", 
    "D": "320", 
    "E": "6,142.45", 
    "F": "1,643.42", 
    "G": "129.76", 
    "H": "215.90", 
    "I": "41.09", 
    "J": "19.03%", 
    "K": "60.10%", 
    "L": "111", 
    "M": "182", 
    "N": "35485" 
    }, 
    { 
    "D": "13478", 
    "E": "94,735.05", 
    "F": "6,663.08", 
    "G": "1,689.97", 
    "H": "3,054.92", 
    "I": "839.16", 
    "J": "27.47%", 
    "K": "55.32%", 
    "L": "29", 
    "M": "996", 
    "N": "396396" 
    }, 
    { 
    "F": "4,385.97", 
    "G": "910.36", 
    "H": "1,555.36", 
    "I": "373.74", 
    "J": "24.03%", 
    "K": "58.53%", 
    "L": "61", 
    "M": "669", 
    "N": "216665" 
    }, 
    { 
    "B": "01/14/2014", 
    "D": "829", 
    "E": "12,997.13", 
    "F": "531.85", 
    "G": "225.48", 
    "H": "359.21", 
    "I": "80.21", 
    "J": "22.33%", 
    "K": "62.77%", 
    "L": "55", 
    "M": "99", 
    "N": "45384" 
    }, 
    { 
    "B": "01/14/2014", 
    "D": "320", 
    "E": "6,142.45", 
    "F": "1,643.42", 
    "G": "129.76", 
    "H": "215.90", 
    "I": "41.09", 
    "J": "19.03%", 
    "K": "60.10%", 
    "L": "111", 
    "M": "182", 
    "N": "35485" 
    }, 
    { 
    "D": "13478", 
    "E": "94,735.05", 
    "F": "6,663.08", 
    "G": "1,689.97", 
    "H": "3,054.92", 
    "I": "839.16", 
    "J": "27.47%", 
    "K": "55.32%", 
    "L": "29", 
    "M": "996", 
    "N": "396396" 
    } 
] 
+0

感謝您的支持!我會更深入地看看你在早上發佈的內容。 – Karnith

+0

這個工作非常好,謝謝讓我從我的路障重新開始。在回答你的問題時,我希望能夠保持工作表的獨立性,並將他們的名字用於分頁中(因此sheet1 a1和sheet 2 a1不會引起問題),但仔細研究之後,我並不認爲handontable支持類似的東西呢。 – Karnith

+0

我可以做的是改變你的循環來拉工作表名稱,將值推入工作表名稱,使其成爲每個「工作表」的數組,然後將工作表數組推送到主數組。這會給我「工作表」:{sheet keys}來處理。除了重複的字段([sheet1,a1]和[sheet2,a1])不會相互衝突,因爲它們會在不同的窗口中呈現,這看起來與我在上面的json中開始的類似。再次感謝您的幫助。 – Karnith