ExtJS学习笔记3:载入、提交和验证表单
2017-06-05 18:37
591 查看
载入数据
1.比較好用的设置form数据的方法:
当中id值为form中field的name属性值。value为要赋的值
2.通过对象赋值:
3.也能够通过load方法,从server载入数据:
提交表单
最简单的办法就是调用submit,提交到指定url
也能够从form获取对象。调用ajax post方式提交:
验证表单
通过vtype验证:
1.比較好用的设置form数据的方法:
formPanel.getForm().setValues([{id: 'FirstName', value: 'Joe'}]);
当中id值为form中field的name属性值。value为要赋的值
2.通过对象赋值:
Ext.define('Request', { extend: 'Ext.data.Model', fields: [ 'FirstName', 'LastName', 'EmailAddress', 'TelNumberCode', 'TelNumber', 'RequestDetails', 'RequestType' ] }); var requestModel = Ext.create('Request', requestData); formPanel.getForm().loadRecord(requestModel);
3.也能够通过load方法,从server载入数据:
formPanel.getForm().load({ url: 'requestDetails.json' });
提交表单
最简单的办法就是调用submit,提交到指定url
var submitForm = function(){ formPanel.getForm().submit({ url: 'submit.url' }); }; var formPanel = Ext.create('Ext.form.Panel', { ... buttons: [{ text: 'Submit Form', handler: submitForm }], items: [ ... ] });
也能够从form获取对象。调用ajax post方式提交:
var record = formPanel.getForm().getRecord();
验证表单
通过vtype验证:
{ xtype: 'textfield', fieldLabel: 'Email Address', name: 'EmailAddress', labelAlign: 'top', cls: 'field-margin', columnWidth: 0.6, <strong>vtype: 'email'</strong> }
相关文章推荐
- ExtJS学习笔记3:加载、提交和验证表单
- ExtJS学习笔记(5)- Form表单的提交 -Ext.FormPanel
- ExtJS学习笔记(1)-表单验证,Ext.FormPanel
- javaScript学习笔记(1)——js表单提交验证
- EXTJS 验证与表单提交
- 深入剖析ExtJS 2.2实现及应用连载(9):表单验证及提交
- jQuery学习笔记5 表单验证
- Ext JS 学习(5) Ext.FormPanel 组件的使用第二式(fieldset的使用, ExtJS表单验证模式)
- Struts2学习笔记之<s:token/>防止表单重复提交
- Struts2学习笔记之<s:token/>防止表单重复提交
- 基于annotation注解的Spring3 MVC Form Handling Example之二表单提交学习笔记
- JavaScript学习笔记2--表单只提交一次
- Struts2学习笔记(8-7)----表单重复提交
- 学习笔记:处理表单提交的中文乱码问题
- struts2——学习笔记2 通过form表单方式或者js的方式提交请求,封装boolean值的问题
- JavaScript学习笔记2--表单只提交一次
- Android(OPhone) 学习笔记 - 表单提交
- javascript学习笔记(十二)初始化表单,及对其简单验证
- EXTJS 验证与表单提交
- PHP学习笔记(五)BBS增加javascript表单验证