Results 1 to 4 of 4

Thread: Server side adding GridPanels to TabPanels

  1. #1
    Sencha User
    Join Date
    Jul 2010
    Posts
    2
    Vote Rating
    0
      0  

    Default Server side adding GridPanels to TabPanels

    Using the following example as a base (from http://dev.sencha.com/deploy/dev/doc...=Ext.Container

    Code:
    // execute an Ajax request to invoke server side script:
    Ext.Ajax.request({
        url: 'gen-invoice-grid.php',
        // send additional parameters to instruct server script
        params: {
            startDate: Ext.getCmp('start-date').getValue(),
            endDate: Ext.getCmp('end-date').getValue()
        },
        // process the response object to add it to the TabPanel:
        success: function(xhr) {
            var newComponent = eval(xhr.responseText); // see discussion below
            myTabPanel.add(newComponent); // add the component to the TabPanel
            myTabPanel.setActiveTab(newComponent);
        },
        failure: function() {
            Ext.Msg.alert("Grid create failed", "Server communication failure");
        }
    });
    Code:
    (function() {
        function formatDate(value){
            return value ? value.dateFormat('M d, Y') : '';
        };
    
        var store = new Ext.data.Store({
            url: 'get-invoice-data.php',
            baseParams: {
                startDate: '01/01/2008',
                endDate: '01/31/2008'
            },
            reader: new Ext.data.JsonReader({
                record: 'transaction',
                idProperty: 'id',
                totalRecords: 'total'
            }, [
               'customer',
               'invNo',
               {name: 'date', type: 'date', dateFormat: 'm/d/Y'},
               {name: 'value', type: 'float'}
            ])
        });
    
        var grid = new Ext.grid.GridPanel({
            title: 'Invoice Report',
            bbar: new Ext.PagingToolbar(store),
            store: store,
            columns: [
                {header: "Customer", width: 250, dataIndex: 'customer', sortable: true},
                {header: "Invoice Number", width: 120, dataIndex: 'invNo', sortable: true},
                {header: "Invoice Date", width: 100, dataIndex: 'date', renderer: formatDate, sortable: true},
                {header: "Value", width: 120, dataIndex: 'value', renderer: 'usMoney', sortable: true}
            ],
        });
        store.load();
        return grid;  // return instantiated component
    })();
    Is it possible instead to have the ajax url point to a .js file on the server ? How would this .js file retrieve the parameters ?

    Thanks

  2. #2
    Sencha User conorarmstrong's Avatar
    Join Date
    Mar 2008
    Location
    Northern Ireland
    Posts
    224
    Vote Rating
    2
      0  

    Default

    what parameters are you referring to?
    ------------------------------------------
    Conor Armstrong
    tw: @evathedog
    web: rockstown.com

    Ext.ux.form.AutoCombo
    Ext.ux.SimpleIFrame
    Ext.ux.form.ToolFieldSet

    Knowledge is realising that the street is one-way, wisdom is looking both directions anyway.

  3. #3
    Sencha User
    Join Date
    Jul 2010
    Posts
    2
    Vote Rating
    0
      0  

    Default

    startDate and endDate.

    I'm new to this so don't know if I'm doing the right thing, but if the Ajax url pointed directly to a .js file on the server, how could the startDate and endDate parameters (ajax params) be retrieved in the .js file ? The example given, shows the startDate and endDate in the js as hardcoded (baseParams).

  4. #4
    Sencha User conorarmstrong's Avatar
    Join Date
    Mar 2008
    Location
    Northern Ireland
    Posts
    224
    Vote Rating
    2
      0  

    Default

    Not sure of you server backend but with a normal LAMP stack there is nothing to stop php, perl, python etc outputting the javascript for you. In PHP for example the parameters you refer to dealt with inside standard php tags referencing GET or POST variables.
    ------------------------------------------
    Conor Armstrong
    tw: @evathedog
    web: rockstown.com

    Ext.ux.form.AutoCombo
    Ext.ux.SimpleIFrame
    Ext.ux.form.ToolFieldSet

    Knowledge is realising that the street is one-way, wisdom is looking both directions anyway.

Similar Threads

  1. Can a TabPanel contain two TabPanels side by side?
    By nuskin in forum Ext 3.x: Help & Discussion
    Replies: 7
    Last Post: 15 Feb 2011, 6:36 PM
  2. Adding server side controls
    By soradi in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 5 Jun 2010, 8:08 AM
  3. Server Side And Client Side Communication
    By YargicX in forum Community Discussion
    Replies: 3
    Last Post: 15 Apr 2008, 10:52 AM
  4. Server-side vs. Client-side...
    By zquirm in forum Community Discussion
    Replies: 2
    Last Post: 22 Dec 2006, 8:15 PM

Posting Permissions

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