Question

我有一个javascript数组，我在可编辑的YUI数据表中用作数据源：

var data = [
    { Col1: "one", Col2: 1 },  
    { Col1: "two", Col2: 2 },      
    { Col1: "three", Col2: 3 },
    { Col1: "four", Col2: 4 }
];
var customFormatter = function (elLiner, oRecord, oColumn, oData) {
    elLiner.innerHTML = "Click me";
    $(elLiner).click(function () {
        var rsvalue = oRecord.getData("Col1");
        var datavalue = data[oRecord.getCount()].Col1;;
        alert("rs:" + rsvalue + ", data:" + datavalue);
    });
};
var coldefs = [
    { key: "Col1", editor: new YAHOO.widget.TextboxCellEditor() },
    { key: "Col2" },
    { key: "Col3", formatter: customFormatter }
];
var datasource = new YAHOO.util.DataSource(data);
datasource.responseType = YAHOO.util.DataSource.TYPE_JSARRAY;
datasource.responseSchema = { fields: [ "Col1", "Col2" ] };
var datatable = new YAHOO.widget.DataTable("mytable", coldefs, datasource);
datatable.subscribe("cellClickEvent", datatable.onEventShowCellEditor);

当我更改可编辑单元格中的值时，我看到数据表的Record使用新值更新，但基础data数组不会。当用户完成数据编辑时，我想使用这个javascript数组（或其他形状），我需要做一些后处理并将其发送到服务器。在通常很好的YUI示例中，我没有看到他们曾试图将数据表中所做的更改与基础数据源进行协调。这样的例子存在吗？我将更改推回到data数组的最佳方式是什么？

这是我的小测试jsfiddle：http://jsfiddle.net/cfarmerga/uArKs/1/

我是否应该抓住DataTable的editorSaveEvent并只记录记录集并更新我的javascript数组？

Answer 1

如果可能的话，我建议在用户完成编辑后重建一次数据，进行任何后期处理，然后将其发送到服务器。这比在每次编辑后保持数据源和数组保持同步更有效。要重建数组，可以遍历数据表的RecordSet。

var rs = datatable.getRecordSet(),
    len = rs.getLength(),
    data = [];

for (var index=0; index < len; index++) {
    data.push(rs.getRecord(index).getData());
}

请注意，getData（）返回表示整个记录的对象。您还可以将单个键传递给getData（）（例如getData（“Col1”））以获取记录的各个字段。

如何最好地将YUI DataTable的RecordSet与JavaScript数组同步？

1 个答案: