[CLOSED] Submit gridpanel data in form submit

  1. #1

    [CLOSED] Submit gridpanel data in form submit

    I want to put a gridpanel into a formpanel. When I call formpanel.getValue, I want to the grid store data to be returned like any other form fields. What's the best way to accomplish this?
    Last edited by geoffrey.mcgill; Jul 15, 2010 at 10:20 PM.
  2. #2
    Here's my solution in case anyone is looking for something similar. I created a new Ext.ux.FormGridPanel that creates a hiddenfield that's refreshed whenever a cell is edited.

    Ext.ux.FormGridPanel = Ext.extend(Ext.net.GridPanel, {
        hiddenValue: null,
    
        initComponent: function() {
            // call parent initComponent
            Ext.ux.FormGridPanel.superclass.initComponent.call(this);
    
            var store = this.getStore();
            if (store) {
                store.on('load', this.refreshHiddenValues, this, { single: true });
            }
        }, // end of function initComponent      
    
        onRender: function() {
            // Call parent (required)
            Ext.ux.FormGridPanel.superclass.onRender.apply(this, arguments);
    
            // After rendered, we have a parent and add to it
            if (this.container) {
                this.hiddenValue = this.container.createChild({ tag: 'input', type: 'hidden', name: this.id + '_Value', value: '' });
            }
    
            // update hidden field on cell edit
            this.on('afteredit', this.refreshHiddenValues);
        },
    
        refreshHiddenValues: function() {
            if (this.hiddenValue) {
                this.hiddenValue.setValue(Ext.encode(this.getRowsValues()));
            }
        }
    
    });
    
    Ext.reg('formgridpanel', Ext.ux.FormGridPanel);
  3. #3
    Hi,

    I can suggest to implement it as plugin

    Ext.ux.grid.FormGridPanel = Ext.extend(Object, {
        hiddenValue: null,
    	
    	init : function (grid) {
    		this.grid = grid;
    		
    		var store = grid.getStore();
            if (store) {
                store.on('load', this.refreshHiddenValues, this, { single: true });
            }
    		
    		this.grid.on("render", this.onRender, this);
    	},
    	
    	onRender: function() {
            // After rendered, we have a parent and add to it
            if (this.container) {
                this.hiddenValue = this.grid.container.createChild({ tag: 'input', type: 'hidden', name: this.grid.id + '_Value', value: '' });
            }
    
            // update hidden field on cell edit
            this.grid.on('afteredit', this.refreshHiddenValues, this);
        },
    
    	
    	refreshHiddenValues: function() {
            if (this.hiddenValue) {
                this.hiddenValue.setValue(Ext.encode(this.grid.getRowsValues()));
            }
        }
    });
    and use it as
    <Plugins>
         <ext:GenericPlugin runat="server" InstanceName="Ext.ux.grid.FormGridPanel" />
    </Plugins>
  4. #4
    Thanks for the tip! Since all the hooks I need are exposed via events, the plugin is the better solution.

Similar Threads

  1. Replies: 1
    Last Post: Jul 25, 2012, 9:52 AM
  2. [CLOSED] Form Submit
    By IanPearce in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: May 07, 2012, 9:28 AM
  3. Form Submit JS Error
    By cleve in forum 1.x Help
    Replies: 0
    Last Post: Jul 10, 2010, 3:27 AM
  4. [CLOSED] [1.0] Form Submit
    By Timothy in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Feb 17, 2010, 8:02 AM
  5. [CLOSED] [1.0] Form submit with a checkbox
    By tdracz in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Dec 03, 2009, 9:35 AM

Posting Permissions