将值从表单存储到网格

Posted 2023-02-26

【中文标题】将值从表单存储到网格

【英文标题】：store values from form to grid

【发布时间】：2011-04-11 18:35:32

【问题描述】：

我在 extjs 中创建了一个添加记录表单，它将用户输入的数据存储到网格中。

好吧，如果找到以下从formPanel获取表单值的方法

var formPanel = new Ext.form.FormPanel(...);
var form = formPanel.getForm();
var firstName = form.findField('firstname').getValue();

但我想将所有用户输入值转换为 JSON 并希望存储到 Grid 面板中并希望将其发送到服务器。但是使用 findField 我必须手动创建数组，然后需要将其编码为 JSON ，所以有没有其他方法可以直接从表单中读取值并将其转换为 JSON 并将其存储到网格面板中。

【参考方案1】：

当您说“想在 GridPanel 中存储”时，您是要更新 Grid 存储中的现有记录，还是要插入一条新记录，或者两者兼而有之？ （取决于它可能是添加还是更新？）

对于这种情况，BasicForm（上面你的sn-p中的var形式）提供了updateRecord( Record record )方法。

所以你的步骤是-

var record = Record.create(...) // in case of insert

或

var record = //obtain record from grid.getStore() in case of update

那么，

formPanel.getForm().updateRecord(record); //update the passed record with values from the form

随后将记录提交回存储区-

grid.getStore().add(record); //in case of insert
grid.getStore().commitChanges(); //incase of update

参考 - Ext.form.BasicForm , Ext.data.Record

定义您的记录类型 -

MyRecordType = Ext.data.Record.create(['id', 'field1', 'field2']);

var myrec = new MyrecordType();

现在如上所述将 myrec 传递给 updateRecord。

【讨论】：

是的，我想插入新的，也想更新现有的。

如何将表单字段转换为记录，因为使用 getvalues 我可以拥有字段数组，但如何将其转换为记录

就像我上面提到的，不要使用get getValues。而是使用 updateRecord。当您使用 updateRecord 时，ExtJS 会为您获取字段并更新记录（您已在 updateRecord 中传递）。

但是我需要插入一个新记录的新记录，我需要从表单中收集值，所以我在问这个问题

您从字段定义中创建一个空记录并将其传递给 updateRecord