EXTJS 3.4 Facing problem with enable/disable button having validations on text fields

In our application we are using Extjs 3.4. On a button click, one window is getting opened. In that window one form panel is there. In form panel there are some fields and buttons as shown in below screen-shot.



Attachment 48484



Our requirement is, after filling every mandatory field (in our case Data Source Name, Primary Hostname/IP Address and Port are mandatory fields) with valid values, submit button should be enabled.



This is working fine with IE8, IE9. However in IE10 and IE11, submit button is not getting enabled even after all the mandatory fields being filled with valid data. Please find below screenshot.



Attachment 48485



For validation of mandatory fields we used monitorValid and allowBlank properties. Please refer below code we are using to create form panel and various fields on top of that.





Code :



FormPanel: In the formpanel we have set the property monitorValid to true.



formpanel1 = new Ext.FormPanel(

{

labelAlign : 'left',

frame : true,

autoScroll : true,

monitorValid:true,

bodyStyle : 'padding:5px 5px 0',

region : 'north',





FormPanel Items: For all the mandatory items we have set allowBlank to false.



items : [ {

layout : 'form',

id : 'formLayout',

labelWidth : 200,

labelAlign : 'left',

items : [

{layout : 'hbox',

defaults : {

flex : 1,

border : false,

hideLabel : false

},

items : [{

layout : 'form',

border : false,

items : {

id : 'datasrcName',

xtype : 'textfield',

width : 140, ,

fieldLabel : '<fmt:messagekey="realtime.stats.datasourcestat.datasourceName"/>'

}},






Button: For the submit button, formBind property is set to True.



buttons : [ {id : 'addDataSource',

formBind:true,

text : parent.i18nsubmit

},

{

id : 'cancelDatasource',

text : parent.i18cancel

} ]

Attached Images

• 1.jpg‎ (24.5 KB)


• 2.jpg‎ (26.0 KB)