Ext.form.FormPanel的扩展

扩展Ext.form.FormPanel，加入form域，形成自己的formPanel

 

 

Ext.namespace("Ext.ux.form");
Ext.apply(Ext.form.VTypes, {
   password: function(val, field)
   {
    if (field.password.password_id)
    {
     var pwd = Ext.get(field.password.password_id);
     return (val == pwd.getValue());
    }
    return true;
   },
   passwordText: "两次密码输入不一致!"
  });
Ext.ux.form.TestForm = Ext.extend(Ext.form.FormPanel, {
   frame: true,
   width: 240,
   title: "测试用的form",
   autoHeigth: true,
   layout: "form",
   labelWidth: 70,
   labelAlign: "left",
   defaultType: "textfield",
   initComponent: function()
   {
    this.items = [{
       xtype: "textfield",
       id: "name",
       name: "name",
       fieldLabel: "姓名",
       allowBlank: false
      }, {
       xtype: "textfield",
       id: "password",
       inputType: 'password',
       name: "password",
       fieldLabel: "密码",
       allowBlank: false
      }, {
       xtype: "textfield",
       inputType: 'password',
       id: "re_password",
       name: "re_password",
       password: {
        password_id: 'password'
       },
       fieldLabel: "确认密码",
       allowBlank: false,
       vtype: 'password'
      }, {
       xtype: "numberfield",
       id: "age",
       name: "age",
       fieldLabel: "年龄",
       allowBlank: false
      }, {
       xtype: "datefield",
       id: "birthday",
       name: "birthday",
       fieldLabel: "生日",
       allowBlank: false
      }, {
       xtype: "checkbox",
       id: "married",
       name: "married",
       fieldLabel: "已婚",
       allowBlank: false
      }, {
       xtype: "combo",
       id: "home",
       name: "home",
       fieldLabel: "国籍",
       allowBlank: false,
       store: [["1", "中国"], ["2", "美国"], ["3", "火星"]],
       fieldLabel: '类型',
       displayField: 'desc',
       valueField: 'id',
       hiddenName: 'married',
       typeAhead: true,
       emptyText: '请选择国籍...',
       mode: 'local',
       triggerAction: 'all',
       selectOnFocus: true,
       editable: false,
       anchor: '95%',
       width: 200
      }, {
       xtype: "textarea",
       id: "note",
       name: "note",
       fieldLabel: "备注",
       allowBlank: false
      }];

    this.buttons = [{
       text: "提交",
       handler: this.save,
       scope: this
      }, {
       text: "取消",
       handler: function()
       {
        this.form.reset();
       },
       scope: this
      }];
    Ext.ux.form.TestForm.superclass.initComponent.call(this);
   },
   save: function()
   {
    if (this.form.isValid())
    {
     this.form.submit({
        params: {
         action: 'submit'
        },
        waitMsg: '正在保存...'
       });
    }
    else
    {
     Ext.MessageBox.alert('错误', '请正确填写出错项');
    }
   }

  });
Ext.reg("testForm", Ext.ux.form.TestForm);