YUI3 DataTable添加两行

时间:2015-08-27 15:46:13

标签: datatable yui3

我正在尝试修改YUI dataTable,以便在创建dataTable后动态添加行,但不是添加一行,而是添加两行。

我的代码:

 var index = 0;

YUI({
    filter: 'RAW'
}).use([
        'node',
        'io',
        'datasource',
        'json-parse',
        'json-stringify',
        'datatable',
        'datatable-sort',
        'datatable-mutable',
        'datatable-scroll',
        'datatable-paginator',
        'model-list'
    ],
    function(Y) {
        var dataTableColumns = [
            {
                key: 'id',
                label: '#'
            },
            {
                key: 'name',
                label: 'Name',
                allowHTML: true,
                formatter: function (valueObject) {
                    return valueObject.name;
                }
            }
        ];

        var dataTable = new Y.DataTable({
                width: "100%",
                columns: dataTableColumns,
                plugins: [{
                    cfg: {
                        highlightRange: false
                    },
                    fn: Y.Plugin.DataTableHighlight
                }]
            }
        );

        dataTable.render('#dataTableDiv');

        var dataSource = new Y.DataSource.IO({
            source: "/localhost/data/"
        });

        dataSource.plug({fn: Y.Plugin.DataSourceJSONSchema, cfg: {
            schema: {
                resultFields: [
                    {key: "id"},
                    {key: "name"}
                ]
            }
        }});

        dataTable.plug(Y.Plugin.DataTableDataSource, {
            datasource: dataSource
        });

        dataTable.datasource.load();

        Y.one("#addButton").on('click', function (event) {
            index++;

            var rowData = {
                id: index,
                name: "Test row"
            };

            dataTable.addRow(rowData, {index: 0});
        });
    }
);

创建DataTable之后,我有: enter image description here

在dataTable.addRow(rowData,{index:0})之后;我有:

enter image description here

0 个答案:

没有答案