Results 1 to 5 of 5

Thread: "Double" grid and form binding

  1. #1

    Default "Double" grid and form binding

    Hello,

    I saw the "Binding: Grid -> Form" example:
    http://dev.sencha.com/deploy/dev/exa...form-grid.html
    and I sort of get it..

    Please, but is it possible to add one more grid in between the first one and the form?

    In other words, there would be a grid where I could add/remove rows. Then, there would be another grid, also with add/remove. Finally, there would be a fieldset which updates on the row selection of the second grid. But there should be just one data store. Kind of like: the second grid edits the first one, the form edits the second grid. Is this even possible? Please, how?

    And is it possible to have different fieldsets (form fields) for different kinds of second's grid rows?

    For example, this is how JSON response could look like:

    Code:
    {
        result: {[
            {
                value: 'grid1row1',
                other: [{
                    value: 'grid2row1',
                    fields: {
                        kind: 'one',
                        first_field: '1'
                    }
                }]
            }, {
                value: 'grid1row2',
                other: [{
                    value: 'grid2row1',
                    fields: {
                        kind: 'one',
                        first_field: '1'
                    }
                }, {
                    value: 'grid2row2',
                    fields: {
                        kind: 'two',
                        first_field: '1',
                        second_field: '2'
                    }
    
                }]
            }, {
                value: 'grid1row3',
                other: [{
                    value: 'grid2row1',
                    fields: {
                        kind: 'one',
                        first_field: '1'
                    }
                }, {
                    value: 'grid2row2'
                    fields: {
                        kind: 'two',
                        first_field: '1',
                        second_field: '2'
                    }
                }, {
                    value: 'grid2row3'
                    fields: {
                        kind: 'three',
                        first_field: '1',
                        second_field: '2',
                        third_field: '3'
                    }
                }]
            },
        ]}
    }
    Where:
    - grid1rowX displays as rows of the first grid
    - grid2rowX displays as rows of the second grid
    - according to 'kind' a proper fieldset dynamically shows up and loads with X_fields

    I hope I wasn't too confusing. Thank you very much in advance!
    Last edited by Tuom Larsen; 7 Jan 2011 at 1:45 AM. Reason: a bit of clarification

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

    Default

    Of course it's possible.

    Your first store should have 'value' and 'other' fields and your second store should have 'value' and 'fields' fields.

    The second store is loaded with 'other' when a row in the first grid is selected and 'other' is updated with the content of the second store when the row is unselected.

  3. #3

    Default

    Thanks for the reply!

    But I'm not sure I fully understood. Please, could you be more specific?

    I mean, I have one store:

    Code:
    var store = new Ext.data.Store({
        proxy: new Ext.data.HttpProxy({
            url: 'my_url'
        }),
        writer: new Ext.data.JsonWriter({
            encode: false
        }),
        reader: new Ext.data.JsonReader({
            fields: ['value', 'other']
        })
    });
    And my first grid is connected to this store.

    Do I have to create another store? How? I mean, what should 'reader' and 'writer' be?

    And how to load the second store when I select a row in the first store?

  4. #4
    Sencha User
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,245

    Default

    Looks ok for the first store. Now create the second store (doesn't need a writer).

    Write a rowselect and a rowdeselect event handler for the grid that uses the first store.

    In the rowselect event you load the second store with the data from the 'other' field.
    In the rowdeselect event you update the 'other' field with the data from the second store.

  5. #5

    Default

    I think I understood! Thanks a lot!

Similar Threads

  1. Replies: 3
    Last Post: 14 Dec 2010, 10:22 PM
  2. textField.setId("id") in a form sets id to "id-input"
    By jackielii in forum Ext GWT: Discussion
    Replies: 2
    Last Post: 6 Dec 2009, 9:54 PM
  3. Replies: 3
    Last Post: 28 Oct 2009, 6:38 AM
  4. [UNKNOWN][3.0.0] demo: "Binding Grid->Form" .. code-button inop
    By Mike Robinson in forum Ext 3.x: Bugs
    Replies: 1
    Last Post: 8 Sep 2009, 7:07 AM
  5. Replies: 2
    Last Post: 4 Dec 2008, 10:51 AM

Tags for this Thread

Posting Permissions

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