ExtJS使用display:none阻止表单字段的验证

时间:2016-06-23 05:08:09

标签: javascript extjs extjs3

我想阻止使用display: none验证表单字段。

例如ipv6设置为display: none的字段,我不想使用表单isValid()方法检查此字段。



var form = new Ext.form.FormPanel({
  frame: true,
  bodyStyle: 'padding:5px 5px 0;',
  items: [{
    xtype: 'radiogroup',
    id: 'ip_type',
    fieldLabel: 'IPType',
    columns: 2,
    items: [{
      boxLabel: 'IPv4',
      name: 'ip_type',
      inputValue: 'ipv4',
      checked: true
    }, {
      boxLabel: 'IPv6',
      name: 'ip_type',
      inputValue: 'ipv6'
    }],
    listeners: {
      'change': function(radioGroup, checkedRadio) {
        if (checkedRadio.inputValue == 'ipv4') {
          Ext.fly('ip').setStyle({
            display: 'block'
          });
          Ext.fly('ipv6').setStyle({
            display: 'none'
          });
          Ext.getCmp('ip').enable();
          Ext.getCmp('ipv6').disable();
        } else {
          Ext.fly('ip').setStyle({
            display: 'none'
          });
          Ext.fly('ipv6').setStyle({
            display: 'block'
          })
          Ext.getCmp('ip').disable();
          Ext.getCmp('ipv6').enable();
        }
      }
    }
  }, {
    id: 'ip',
    layout: 'column',
    border: false,
    hideBorders: true,
    items: [{
      layout: 'form',
      items: [{
        fieldLabel: 'IP',
        xtype: 'ipv4field',
        name: 'ip',
        allowBlank: false,
        regex: ipv4_reg,
      }]
    }, {
      html: '/'
    }, {
      xtype: 'numberfield',
      name: 'netmask',
      allowBlank: false,
      allowDecimals: false,
      minValue: 0,
      maxValue: 32,
      width: 70
    }]
  }, {
    id: 'ipv6',
    layout: 'column',
    border: false,
    hideBorders: true,
    items: [{
      layout: 'form',
      items: [{
        fieldLabel: 'IP',
        xtype: 'textfield',
        name: 'ipv6',
        allowBlank: false,
        regex: ipv6_reg,
      }]
    }, {
      html: '/'
    }, {
      xtype: 'numberfield',
      name: 'netmaskipv6',
      //allowBlank: false,
      allowDecimals: false,
      minValue: 0,
      maxValue: 128,
      width: 70
    }]
  }]

});




  

1 个答案:

答案 0 :(得分:0)

为避免验证广播,您可以使用Ext.form.Radio.disabled,或者如果您想在表单提交期间发送字段值,则可以将Ext.form.Radio.validationEvent设置为false

使用ExtJS Ext.form.Radio.hidden属性而不是css display也更好。