Results 1 to 2 of 2

Thread: best way to get form button scope

  1. #1

    Default best way to get form button scope

    I am defining a FormPanel inside a Window component, with standard Submit and Cancel type buttons, here is how I did it below. Is this the best way to get the containing form and the containing window, so I can 1) submit the form or 2) close the containing window,or is there a simpler way?

    Buttons only:

    Code:
    buttons: [{
         text: 'Submit',
         disabled: false,
         handler: function(){
            var f = Ext.getCmp('implantform');
            f.form.submit( {reset: true, url:'/itracker/implants/add', waitMsg:'Saving Data...'} );
         }
    },{
         text: 'Cancel',
         disabled: false,
         handler: function() {
           var f = Ext.getCmp('myform');
           f.close();
         }
    }],
    Code:
    var fs = new Ext.Window({
    		minimizable: true,
    		maximizable: true,
    		constrain: true,
    		manager: windows,
    		shim:false,
    		animCollapse:false,
    		constrainHeader:true,
    		constrain: true,
    		renderTo: 'mdi',
    		layout: 'fit',
    		autoScroll: true,
    		width: 400,
    		height: 400,
    		id: 'myform',
    		items:  new Ext.FormPanel({
    					listeners: { actioncomplete: h },
    					title: 'XML Form',
    					labelAlign: 'right',
    					labelWidth: 85,
    					width: 340,
    					layout: 'fit',
    					waitMsgTarget: true,
    					id: 'implantform',
    					buttons: [{
    						text: 'Submit',
    						disabled: false,
    						handler: function(){
    							var f = Ext.getCmp('implantform');
    							f.form.submit( {reset: true, url:'/itracker/implants/add', waitMsg:'Saving Data...'} );
    						}
    					},{
    						text: 'Cancel',
    						disabled: false,
    						handler: function() {
    							var f = Ext.getCmp('myform');
    							f.close();
    						}
    					}],
    					// configure how to read the XML Data
    					reader : new Ext.data.XmlReader({
    							record : 'contact',
    							success: '@success'
    							}, [
    								{name: 'first', mapping:'name/first'}, // custom mapping
    								{name: 'last', mapping:'name/last'},
    								'company', 'email', 'state',
    								{name: 'dob', type:'date', dateFormat:'m/d/Y'} // custom data types
    							]
    					),
    
    					// reusable eror reader class defined at the end of this file
    					//errorReader: new Ext.form.XmlErrorReader(),
    
    					items: [{
    							//new Ext.form.FieldSet({
    							collapsible: true,
    							autoHeight: true,
    							xtype: 'fieldset',
    							//layout: 'fit',
    							title: 'Contact Information',
    							defaultType: 'textfield',
    							items: [{
    									fieldLabel: 'Tissue ID',
    									name: 'data[Implant][tissue_id]',
    									width:190
    								},  {
    									fieldLabel: 'Lot ID',
    									name: 'data[Implant][lot_id]',
    									width:190
    								},
    
    								new Ext.form.ComboBox({
    									fieldLabel: 'Product ID',
    									hiddenName: 'data[Implant][product_id]',
    									store: ds,
    									loadingText: 'Loading...',
    									valueField: 'product_id',
    									displayField: 'product_name',
    									typeAhead: true,
    									triggerAction: 'all',
    									emptyText: 'Select a Product...',
    									selectOnFocus: true,
    									width:190
    								}),
    
    								new Ext.form.DateField({
    									fieldLabel: 'Date of Exp.',
    									name: 'data[Implant][date_of_expiration]',
    									width:190,
    									allowBlank:false
    								})
    							]
    						}
    					]
    				})
    	});
    }
    
    fs.setSize({height: 400,width:400});
    fs.show();

  2. #2

    Default

    If this is a question about scope, here is how I define my form buttons:

    Code:
    this._submitBtn = new Ext.Button({ text:'Save', handler:this.save, scope:this });
    
    this._form = new Ext.FormPanel({
            ...
            buttons:[this._submitBtn]
    });
    From inside the this.save() function I could reach other class instance variables that reference the form or container window.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •