Results 1 to 3 of 3

Thread: Having a Grid inside a Form and load data from one JSON data source!

  1. #1

    Default Having a Grid inside a Form and load data from one JSON data source!

    Hi,

    I would like to show a form that displays the below JSON data.

    Code:
    {
    "text":"Calendar", "description":"calendar app", "authorization":[ {"role":"ADMIN","duty":"ON"}, {"role":"CLEANER","duty":"ON/OFF"}, {"role":"DRIVER","duty":"OFF"} ]
    }
    Writing the below code without bold parts shows the the "text" and "description" in a FormPanel and works fine.

    Code:
    var functionForm = new Ext.form.FormPanel({
      frame     : true,
      reader    : new Ext.data.JsonReader({
        fields : [
          { name  : 'text' },
          { name  : 'description' },
          { name  : 'role', mapping:'authorization.role' }
        ]
      }),
      items : [
        {
          layout :'column',
          items: [
            {
              xtype       : 'displayfield',
              name        : 'text'
            }
          ]
        },
        {
          layout :'column',
          items: [
            {
              xtype       : 'displayfield',
              name        : 'description'
            }
          ]
        },
        {
          columnWidth:.50,
          layout: 'form',
          items: [
            new Ext.grid.GridPanel({
              title                       : 'Authorization',
              columnLines       : true,
              height                  : 300,
              columns : [
                {
                  xtype         : 'gridcolumn',
                  header       : 'Role',
                  dataIndex : 'role',
                  sortable     : true
                }
              ]
            })
          ]
        },
      ]
    });
    I tried to add a grid to my form and show the "authorization" roles in the first column by adding the bold parts. But it does not work and firebug shows the below error:

    this.ds is undefined
    Any idea why this is happening? Basically, is it possible to have a grid element inside a form that directly refers to the form data source?

    Note: I used a JsonReader instead of using a store since the url to load data was dynamic based on the user interaction.

  2. #2
    Sencha User Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,245

    Default

    No, that won't work.

    Your formpanel needs 'text', 'description' and 'authorization' fields.

    The gridpanel needs a store with a reader that can process an array of roles.

    Since a gridpanel is not a field, it's not loaded automatically. You will need to add an actioncomplete event handler to the form that calls:
    Code:
    grid.getStore().loadData(action.result.data.authorization);

  3. #3

    Default

    Thank you so much for your prompt response!

Similar Threads

  1. Replies: 1
    Last Post: 17 Jul 2009, 10:57 PM
  2. How update the grid record store with json as data source
    By ssyeda in forum Ext 3.x: Help & Discussion
    Replies: 2
    Last Post: 7 May 2009, 11:01 AM
  3. JSON data can't load into a EditorGrid inside FormPanel
    By choykawairicky in forum Ext 2.x: Help & Discussion
    Replies: 9
    Last Post: 15 May 2008, 6:46 AM
  4. JSON data to load a form
    By jprosser in forum Ext 2.x: Help & Discussion
    Replies: 3
    Last Post: 26 Feb 2008, 2:46 PM
  5. JSON/XML? Ideal data source format for Grid
    By papasi in forum Ext 2.x: Help & Discussion
    Replies: 4
    Last Post: 4 Apr 2007, 12:11 AM

Posting Permissions

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