123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118 |
- Ext.require([
- 'Ext.form.*',
- 'Ext.data.*'
- ]);
- Ext.onReady(function(){
- Ext.define('example.contact', {
- extend: 'Ext.data.Model',
- fields: [
- {name: 'first', mapping: 'name > first'},
- {name: 'last', mapping: 'name > last'},
- 'company', 'email', 'state',
- {name: 'dob', type: 'date', dateFormat: 'm/d/Y'}
- ]
- });
- Ext.define('example.fielderror', {
- extend: 'Ext.data.Model',
- fields: ['id', 'msg']
- });
- var formPanel = Ext.create('Ext.form.Panel', {
- renderTo: 'form-ct',
- frame: true,
- title:'XML Form',
- width: 340,
- bodyPadding: 5,
- waitMsgTarget: true,
- fieldDefaults: {
- labelAlign: 'right',
- labelWidth: 85,
- msgTarget: 'side'
- },
- // configure how to read the XML data
- reader : Ext.create('Ext.data.reader.Xml', {
- model: 'example.contact',
- record : 'contact',
- successProperty: '@success'
- }),
- // configure how to read the XML errors
- errorReader: Ext.create('Ext.data.reader.Xml', {
- model: 'example.fielderror',
- record : 'field',
- successProperty: '@success'
- }),
- items: [{
- xtype: 'fieldset',
- title: 'Contact Information',
- defaultType: 'textfield',
- defaults: {
- width: 280
- },
- items: [{
- fieldLabel: 'First Name',
- emptyText: 'First Name',
- name: 'first'
- }, {
- fieldLabel: 'Last Name',
- emptyText: 'Last Name',
- name: 'last'
- }, {
- fieldLabel: 'Company',
- name: 'company'
- }, {
- fieldLabel: 'Email',
- name: 'email',
- vtype:'email'
- }, {
- xtype: 'combobox',
- fieldLabel: 'State',
- name: 'state',
- store: Ext.create('Ext.data.ArrayStore', {
- fields: ['abbr', 'state'],
- data : Ext.example.states // from states.js
- }),
- valueField: 'abbr',
- displayField: 'state',
- typeAhead: true,
- queryMode: 'local',
- emptyText: 'Select a state...'
- }, {
- xtype: 'datefield',
- fieldLabel: 'Date of Birth',
- name: 'dob',
- allowBlank: false,
- maxValue: new Date()
- }
- ]
- }],
- buttons: [{
- text: 'Load',
- handler: function(){
- formPanel.getForm().load({
- url: 'xml-form-data.xml',
- waitMsg: 'Loading...'
- });
- }
- }, {
- text: 'Submit',
- disabled: true,
- formBind: true,
- handler: function(){
- this.up('form').getForm().submit({
- url: 'xml-form-errors.xml',
- submitEmptyText: false,
- waitMsg: 'Saving Data...'
- });
- }
- }]
- });
- });
|