1. #1
    Sencha User
    Join Date
    Mar 2008
    Location
    Marietta, GA
    Posts
    93
    Vote Rating
    0
    jasondeegan is on a distinguished road

      0  

    Default Window growing with EditorGridPanel & FormPanel

    Window growing with EditorGridPanel & FormPanel


    I'm combining an EditorGridPanel and a FormPanel in a new window.
    However, the window is not growing down when I add rows to my GridPanel.

    This is probably a quick / easy fix that I'm glossing over.

    Thanks,

    Jason

    Code:
    		aEES2: function( subID ){
    			var conna = new Ext.data.Connection();
    			var carriersStore = new Ext.data.SimpleStore({
    				fields: ['carrierValue', 'carrierDisplay'],
    				data : Ext.listMgmtCarrier.options
    			});
    
    			Ext.form.Field.prototype.msgTarget = 'under';
    			var fsf = new Ext.ux.OrderedFormPanel({
    				labelWidth: 75, url:'save-form.php', bodyStyle:'padding:5px 5px 0; border-bottom:0px;', width:350, height:30, id:'fsf', region:'north',
    				items: [{
    					xtype:'textfield', width:220, name:'contactName', id:'contactName', fieldLabel: 'Name',
    					listeners: {
    						'change' : function(){
    							Ext.getCmp( 'anewSubWindow' ).setTitle( Ext.getCmp( 'contactName' ).getValue() );
    						}
    					}
    				}]
    			});
    			var contactDetailRecord = Ext.data.Record.create([
    				{name: 'category'}, {name: 'v'}, {name: 's'}, {name: 'phone'}, {name: 'i'}, {name: 'vid'}
    			]);
    		    contactDetailStore = new Ext.data.GroupingStore({
    				reader: new Ext.data.ArrayReader({}, contactDetailRecord ),
    				url: '/rd/secure/scripts/contactDataGridFakeData.json',
    				sortInfo:{field: 'v', direction: "ASC"},
    				groupField:'category',
    				autoLoad:true
    			});
    			contactDetailGrid = new Ext.grid.EditorGridPanel({
    				store: contactDetailStore,
    				columns: [
    					{header: "category", id:'Category', width: 100, sortable: true, dataIndex: 'category', hidden:true },
    					{header: "Vendor", id:'v', width: 90, sortable: true, dataIndex: 'v' },
    					{header: "Store", width: 50, sortable: true, dataIndex: 's' },
    					{header: "Phone", width: 80, sortable: true, dataIndex: 'phone', editor: new Ext.form.TextField({ allowBlank: false }) },
    					{header: "Call", id:'bpCol', width: 25, resizable:true, sortable: true, dataIndex: 'i' , css: 'padding-left:0px; margin-left:0px; cursor: pointer; cursor: hand;'  },
    					{header: "Id", width: 5, sortable: true, dataIndex: 'vid', hidden:true }
    				],
    				fill: true, region:'center', width:350, clicksToEdit:1, autoHeight:true, stripeRows: true, bodyStyle:'background-color:transparent; border-top:0px;', hideHeaders:true, ctCls: 'contactDetails',
    				view: new Ext.ux.noCollapseGroupingView({
    					forceFit:true,
    					groupTextTpl: '<table cellpadding=0 cellspacing=0 border=0 width=100%><tr><td style="width:99%;">{[ values.rs[0].data["category"] ]} </td><td style="width:24px; text-align:right;" class="clickGrp"><span class="{[ values.rs[0].data["category"] ]}"><img src="/rd/images/icons/addIcon.gif" style="cursor:pointer; cursor:hand;"></span></td></tr></table>'
    				})
    		    });
    		    contactDetailStore.load( );
    
    			Ext.Ajax.request({
    			    method  : 'POST',
    			    url         : '/rd/secure/dao/dao.php',
    			    params  : { 'action':'getSubscriberDataJSON', 'subId':subID },
    			    success : function( response ){
    					o = Ext.decode( response.responseText );
    					var anewSubWin = Ext.getCmp('anewSubWindow');
    					if (!anewSubWin) {
    						anewSubWin = new Ext.Window({
    							id: 'anewSubWindow', title:'List Management', modal:true, width:410, height:350, y:80, plain:true, closable: false, bodyStyle:'padding:5px;', buttonAlign:'center', layout:'border', items: [ fsf, contactDetailGrid ],
    							buttons: [{
    								id:'btnSave',
    								text: 'Save',
    								handler: function(){
    									Ext.MessageBox.show({
    										msg: 'Creating Subscriber',
    										progressText: 'Saving',
    										width:300,
    										wait:true,
    										waitConfig: {interval:200},
    										icon:'ext-mb-save'
    									});
    									subPanel.getForm().submit({
    										url:'/rd/dao/common/dao.php',
    										method:'POST',
    										success: function(form, action){
    										}
    									});
    								}
    							},{
    								text: 'Cancel',
    								handler: function(){
    									anewSubWin.destroy(true);
    									anewSubWin = null;
    								}
    							}]
    						});
    					}
    					Ext.getCmp( 'anewSubWindow' ).setTitle( o.contact );
    					anewSubWin.show();
    				},
    				failure: function( response ){
    				}
    			});
    		},
    Don't measure excellence against others, but rather against the best implementation of yourself.

  2. #2
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,546
    Vote Rating
    64
    Animal is a jewel in the rough Animal is a jewel in the rough Animal is a jewel in the rough

      0  

    Default


    You're going to have to refactor that at some point.

    You have function which calls Ajax, which in a success handler creates buttons with an embedded hander...

    You will end up in knots unless you create some logical classes.

    Windows do not resize because of what you place in them. You will have to use a polling function which sets the Window's body's height to the Window's body's scrollHeight, and then call syncSize

Thread Participants: 1