PDA

View Full Version : FormPanel disable not working



dnitke
23 Mar 2011, 6:34 AM
Anyone see what my issue is in this logic, I was able to disable the text fields quite easily with

customerMaintenanceForm.getForm().findField('customerCard').setDisabled(true);

in the same function but the button disable shows "null" in the firebug debugger even though I see the "save" iD under the buttons of the FormPanel customerMaintenanceForm object.

Thanks
Don N.


Form Panel Definition:

var customerMaintenanceForm = new Ext.FormPanel({
labelAlign: 'left',
url : '/csc/CustomerMaintenanceServlet',
frame :true,
title : 'Customer Maintenance',
bodyStyle :'padding:5px 5px 0',
width : 950,
items : [{
xtype :'textfield',
fieldLabel: 'Customer Card',
name : 'customerCard',
anchor :'30%',
maskRe :/[0-9]/,
maxLength : 16,
maxLengthText: 'Customer card must be 16 digits',
minLength : 16,
minLengthText: 'Customer card must be 16 digits',
allowBlank: false,
tabIndex : 1
},{
xtype :'textfield',
fieldLabel: 'First Name',
name : 'firstName',
anchor :'50%',
allowBlank: false,
tabIndex : 2
},{
xtype :'textfield',
fieldLabel: 'Last Name',
name : 'lastName',
anchor :'50%',
allowBlank: false,
tabIndex : 3
},{
xtype :'textfield',
fieldLabel: 'Business Name',
name : 'businessName',
anchor :'75%',
tabIndex : 4
},{
xtype :'textfield',
fieldLabel: 'Address',
name : 'addressLineOne',
anchor :'95%',
allowBlank: false,
tabIndex : 5
},{
xtype :'textfield',
fieldLabel: '',
name : 'addressLineTwo',
anchor :'95%',
tabIndex : 6
},{
xtype :'textfield',
fieldLabel: 'City',
name : 'cityName',
anchor :'55%',
allowBlank: false,
tabIndex : 7
},{
xtype :'combo',
fieldLabel :'State',
name :'stateName',
anchor :'25%',
mode :'local',
triggerAction: 'all',
store : states,
valueField : 'stateCode',
displayField:'stateName',
allowBlank : false,
tabIndex : 8
},{
xtype :'textfield',
fieldLabel:'Zip Code',
name :'zipCode',
anchor :'25%',
allowBlank: false,
tabIndex : 9
},{
xtype :'textfield',
fieldLabel: 'Phone Number',
name : 'phoneNumber',
vtype : 'usPhone',
anchor :'30%',
tabIndex : 10
},{
xtype :'textfield',
fieldLabel:'Drivers License',
name :'driversLicense',
anchor :'40%',
tabIndex : 11
},{
xtype :'textfield',
fieldLabel:'Email',
name :'emailAddress',
anchor :'100%',
vtype : 'email',
tabIndex : 12
}],

buttons : [{
id : 'add',
text : 'Add',
tabIndex: 9,
height : 45,
width : 125,
handler : function(button, event) { setupFormForAdd();}
},{
id : 'edit',
text : 'Edit',
tabIndex: 9,
height : 45,
width : 125,
handler : function(button, event) { setupFormForEdit();}
},{
id : 'save',
text : 'Save',
tabIndex: 10,
height : 45,
width : 125,
handler : function(button, event) {
customerSearchForm.getForm().submit({
method : 'POST',
waitTitle : 'Searching Customers',
waitMsg : 'Processing customer search...',
success : function (form, action) {loadCustomersGrid();} ,
failure : function (form, action) {customerSearchFailure();}
});
}
},{
name : 'cancel',
text : 'Cancel',
tabIndex: 9,
height : 45,
width : 125,
handler : function(button, event) { processCancel();
}
}]
});


Button disable code done after the form object is created, note that the setAllFieldsDisabled works fine.

/**
* Set the form to browse mode state
*/
function setupFormForBrowse(){

mode = "Browse";

setAllFieldsDisabled();

// set the buttons to allow add and edit only
customerMaintenanceForm.findById('save').setDisabled(true);
customerMaintenanceForm.findById('cancel').setDisabled(true);


}

fay
23 Mar 2011, 9:06 AM
You could give your Save and Cancel buttons id values, e.g., 'btnSave' and use Ext.getCmp, e.g.,:



Ext.getCmp('btnSave').setDisabled(true);

dnitke
23 Mar 2011, 9:48 AM
Thanks Fay that worked great.