ExtJS 4.0表单提交与重置实例

本文档主要介绍了如何在ExtJS 4.0版本中创建一个包含表单提交功能的对话框。该示例涉及到两个按钮，一个是“重置”按钮，用于清空表单数据，另一个是“保存”按钮，当用户点击后，会执行表单验证并将其数据发送到服务器进行处理。 首先，我们看到`buttons`部分定义了两个按钮。第一个按钮的`text`属性为空，其`handler`函数使用`this.up('form').getForm().reset();`来重置整个表单，这意味着点击这个按钮时，表单中的所有输入字段将恢复默认值或清除已填写的数据。 第二个按钮的`text`属性同样为空，但这里设置了两个额外的配置：`formBind: true`（注释掉了，表明它只有在表单验证通过时才启用）和`disabled: false`，表示该按钮默认状态下是可点击的。`handler`函数首先通过`Ext.getCmp("msgBasicMsg").getForm().getValues();`获取表单中的所有数据，并将其编码为JSON字符串。然后调用`Ext.getCmp("msgBasicMsg").getForm().submit()`方法进行表单提交。 在提交表单时，设置了一些额外的参数和事件处理： - `url`属性指定了表单数据将被发送到的服务器端接口`insertMsg.action`。 - `waitTitle`和`waitMsg`分别用于显示等待提示的标题和消息，增强了用户体验，告诉用户操作正在进行中。 - `params`对象用于传递参数，其中`msgBean`参数包含了经过`Ext.encode(formData)`编码后的表单数据。 - `success`回调函数在请求成功时执行，如果服务器返回结果`result`为真，则弹出一个成功的提示信息并关闭窗口。否则，显示错误消息。 - `failure`回调函数则在请求失败时执行，显示一个失败的消息。 最后，文档还提供了一个Java控制器方法`insertMsg`，这是一个Spring MVC的处理程序，它接收来自前端的`msgBean`对象和`HttpServletRequest`，并在控制台上打印接收到的参数，但实际处理逻辑中并未返回任何内容，只是简单地打印了参数。 这段代码展示了如何在ExtJS 4.0中创建一个带有表单验证和异步提交功能的对话框，同时与后端服务器进行了交互。这对于构建Web应用程序中常见的表单操作场景非常实用。