ЯШ: Как динамически загружать данные в таблицу данных?

Question

Мне нужна таблица данных с сортировкой столбцов с использованием библиотеки YUI. Поэтому я пытаюсь адаптировать этот пример:

YUI().use("datatable-sort", function(Y) {
    var cols = [
        {key:"Company", label:"Click to Sort Column A", sortable:true},
        {key:"Phone", label:"Not Sortable Column B"},
        {key:"Contact", label:"Click to Sort Column C", sortable:true}
    ],
    data = [
        {Company:"Company Bee", Phone:"415-555-1234", Contact:"Sally Spencer"},
        {Company:"Acme Company", Phone:"650-555-4444", Contact:"John Jones"},
        {Company:"Industrial Industries", Phone:"408-555-5678", Contact:"Robin Smith"}
    ],
    table = new Y.DataTable({
        columns: cols,
        data   : data,
        summary: "Contacts list",
        caption: "Table with simple column sorting"
    }).render("#sort");
});

Мне нужно динамически добавлять данные в эту таблицу. Поэтому я передал двумерный массив со стороны сервера в функцию JS. Это массив, состоящий из массивов, которые представляют строки, тогда данные внутри внутренних массивов представляют данные ячеек таблицы. Массив на стороне сервера был:

Array ( [0] => Array ( [0] => Name [1] => Age [2] => CGPA ) [1] => Array ( [0] => Alex [1] => 23 [2] => 2.5 ) [2] => Array ( [0] => Bob [1] => 24 [2] => 3 ) [3] => Array ( [0] => Mike [1] => 22 [2] => 3.9 ) ) 

Это то, что я пытался сделать (см. for цикл, чтобы поместить данные в cols =[...] ) но это не работает, даже не alert($rowsArray); часть. По-видимому, эта функция, кажется, не работает вообще.

M.mod_quiz.init_tabView = function(Y, params) {

    var $rowArray= params.key1;

    alert($rowArray);

    YUI().use("datatable-sort", function(Y) {
                    var cols = [
                        for (i=0; i<$rowArray.length; i++) {
                            {key:"Column "+i , label: $rowArray[0][i] , sortable=true}
                        }
                        /*{key:"Company", label:"Sort Column A", sortable:true},
                        {key:"Phone", label:"Sort Column B", sortable:true},
                        {key:"Contact", label:"Sort Column C", sortable:true}*/
                    ],
                    data = [
                        {Company:"Company Bee", Phone:"415-555-1234", Contact:"Sally Spencer"},
                        {Company:"Acme Company", Phone:"650-555-4444", Contact:"John Jones"},
                        {Company:"Industrial Industries", Phone:"408-555-5678", Contact:"Robin Smith"}
                    ],
                    table = new Y.DataTable({
                        columns: cols,
                        data   : data,
                        summary: "Contacts list",
                        caption: "Table with simple column sorting"
                    }).render(params.key2);
                    });
};

ВОПРОС:

Итак, как я могу динамически загрузить данные в этот массив данных из массива?

Answer 1

Ваш код имеет Uncaught SyntaxError: Unexpected token for Вот:

var cols = [
    for (i=0; i<dummyArray.length; i++) {
        {key:"Column "+i , label: dummyArray[0][i] , sortable=true}
    }
    //...
],

Код внутри блока массива [] ожидает переменные или объекты какого-либо рода (например, ["foo"] или же [someVariable]). Но вы кладете for цикл внутри массива, который вызывает ошибку.

Предполагая, что нам передали фиктивный массив указанного вами формата (поскольку я не могу получить доступ к фактическому массиву из вашего кода), вы можете сделать это:

YUI().use("datatable-sort", function(Y) {

    // dummyArray since I cannot access your external array.
    var dummyArray = [
        ["Name", "Age", "CGPA"],
        ["Alex", 23, 2.5],
        ["Bob", 24, 3],
        ["Mike", 22, 3.9]   
    ];

    // Get the array of labels from the 2d array.
    var labels = dummyArray[0];
    var cols = [];
    for (var i = 0; i < labels.length; i++) {
        cols.push({key: "Column " + i, label: labels[i], sortable: true});
    }

    // Get the 2d array and then remove the labels with a shift().
    var values = dummyArray;
    values.shift();
    var data = [];
    for (var i = 0; i < values.length; i++) {

        // Create a row object and map each value to its corresponding key.
        var row = {};
        for (var j = 0; j < values[i].length; j++) {
            row["Column " + j] = values[i][j];
        }

        // Add the row.
        data.push(row);
    }

    // Create the dataTable.
    var table = new Y.DataTable({
        columns: cols,
        data   : data,
    }).render("#sort");
});