1

我需要生成一个网格，其中所有行都处于编辑模式，并且可以通过单击“保存”按钮一次保存每行的值。这可能吗？如果是这样，最好的方法是什么？使用 ExtJs 的网格来满足这个要求是个好主意吗？通过查看 Ext Js 的示例，框架开发人员似乎非常鼓励一次编辑一行或一个单元格的网格，而不是整个表格。

我还想指出，分页不是必需的。

更新： 我正在使用 Ext JS 3.4。

4

2 回答 2

1

可能是下面的代码帮助：

/**
 *   This method is called on save button click by passing the grid object as a parameter
 */
saveGridModifiedRecords = function (yourGrid) {
    Ext.getCmp("yourGridId").body.mask('Saving Record Please Wait...');
    var modifiedRecords = yourGrid.getStore().getModifiedRecords();
    var CIxml = StringToXML("<Root/>");
    for (var i = 0; i < modifiedRecords.length; i++) {
        var fields = modifiedRecords[i]; // Gives you each edited record
        var cuurElem = CIxml.createElement("I");
        cuurElem.setAttribute("name", fields.get("name")); // Here name is the dataindex of a field
        cuurElem.setAttribute("category", fields.get("category")); // Here category is the dataindex of a field
        CIxml.documentElement.appendChild(cuurElem);
    }

    Use an AJAX call to send this xml with modified records to server.

    Ext.Ajax.request({
        url : 'yourWebServiceURL/parameter1/parametr2',
        method : 'POST',
        timeout : 120000,
        params : {
            'strIPXML' : CIxml.xml
        }, // We are passing xml as a string here by using .xml
        success : function (response) {
            // Extract response.resposeXML for a xml format of response else response.responseText for a string.
            Ext.getCmp("yourGridId").body.unmask();
            alert('In success');
        },
        failure : function (response) {
            alert('In Failure');
            if (Ext.getCmp("yourGridId")) {
                Ext.getCmp("yourGridId").body.unmask();
            }
        }
    });
}

function StringToXML(oString) {
 //code for IE
 if (window.ActiveXObject) { 
 var oXML = new ActiveXObject("Microsoft.XMLDOM"); oXML.loadXML(oString);
 return oXML;
 }
 // code for Chrome, Safari, Firefox, Opera, etc. 
 else {
 return (new DOMParser()).parseFromString(oString, "text/xml");
 }
}
于 2013-04-16T15:16:53.057 回答
1

更新：好的，这对于 Ext JS v. 4.x 是正确的 :)

您可以做的是在底层 Store 中设置autoSync: false，这样它就不会立即将更改写入服务器。

在您的保存按钮上，您只需调用grid.getStore().sync()

请参阅：API - Ext.data.Store.sync()

于 2013-04-12T15:54:50.157 回答