ExtJS使用Form提交数据

来源：互联网发布：数据分析师考试网编辑：程序博客网时间：2024/04/29 22:23

应用场景：

如果只想在Form中，为控件设置name属性之后，不需要将数据重新整合成服务端需要的数据，只需要通过指定方法就能提交数据到服务器，是不是很方便呢？

环境：

一、客户端：
OS: Win 10
Ext JS: 6.2.0
Sencha CMD: Sencha Cmd v6.2.2.36
二、服务端：

Ruby on Rails

步骤：

一、在组件中声明form组件
            xtype: 'form',            autoEl: 'form',//要加这个配置项，以便于序列化            items: [
二、为form组件中的子组件命名。
        {            xtype: 'textfield',            bind: '{stock}',            name: 'event[prizes][][stock]',            columnWidth: .15        }
* 注意：命名时，对象下面的数组要加[]，比如上面子组件实际上是序列化如下对象
{   event:{      prize:[        {          stock:value        }      ]    }}
三、获取序列化后的form数据：
Ext.dom.Element.serializeForm(Ext.getDom(form.getEl())) 
四、发送数据：（我是自己封装的Ajax方法）
        this.ajax.Ajax({            url: url            content_type: 'application/x-www-form-urlencoded',//注意此处设置的值，只能是这种            method: 'PUT',            data: sendData,            success: this.saveActivitySuccess.bind(this)        });
That's all. Any questions please feel free to contact me.

1 0