Results 1 to 6 of 6

Thread: Extjs 6 + dashboard template + bind grid to store

  1. #1
    Sencha User
    Join Date
    May 2010
    Posts
    21

    Default Extjs 6 + dashboard template + bind grid to store

    Hi,

    I'm using the template dashboard to create my application, I really don't understand how those lines work :


    bind: {
    store: '{inbox}'
    },

    I've tried to create a new grid, but I can't get it work ....


    where do I have to specify the store ?
    Normally it's in the app/store/example/Mystore ???


    need some direction, thank you !

  2. #2
    Sencha User
    Join Date
    Feb 2013
    Location
    California
    Posts
    11,985
    Answers
    506

    Default

    You might have a look at this doc guide for more info on data binding.
    http://docs.sencha.com/extjs/6.0/app...a_binding.html

  3. #3
    Sencha User
    Join Date
    May 2010
    Posts
    21

    Default

    Ok, so it is linked with a viewModel, but how come that in the grid, I don't see those lines ? =>

    viewModel: { type: 'test' },


    which viewModel is choosed ?

    I've :


    app/model/example/Group.js
    Code:
    Ext.define('Admin.model.example.Group', {
        extend: 'Ext.data.Model',
    
        fields: [
            {
                type: 'int',
                name: 'id'
            },
            {
                type: 'string',
                name: 'name'
            },
            {
                type: 'string',
                name: 'state'
            }
        ]
    });
    app/store/example/Groups.js
    Code:
    Ext.define('Admin.store.example.Groups', {
        extend: 'Ext.data.Store',
    
        alias: 'store.groups',
    
        model: 'Admin.model.example.Group',
    
        pageSize: 20,
    
        autoLoad: true,
    
        proxy: {
            type: 'api',
            url: '~api/example/group'
        }
    });
    app/view/example/GroupModel.js
    Code:
    Ext.define('Admin.view.example.GroupModel', {
        extend: 'Ext.app.ViewModel',
        alias: 'viewmodel.groups',
    
        stores: {
            groups: {
                type: 'groups'
            }
        }
    });
    app/view/example/Group.js
    Code:
    Ext.define('Admin.view.example.Group', {
        extend: 'Ext.container.Container',
        xtype: 'group',
        requires: [
            'Ext.grid.Panel'
        ],
        anchor : '100% -1',
        layout:{
            type:'vbox',
            pack:'center',
            align:'center'
        },
        items: [
            {
                xtype: 'gridpanel',
                width: 650,
                height: 475,
                title: 'my title',
                bind: {
                    store: '{group}'
                },
                columns: [
                    {
                        text: 'Id',
                        dataIndex: 'row'
                    },
                    {
                        text: 'Name',
                        sortable: true,
                        dataIndex: 'name',
                        flex: 3
                    },
                    {
                        text: 'State',
                        sortable: true,
                        dataIndex: 'state',
                        flex: 3
                    }
                ]
            }
        ]
    });

  4. #4
    Sencha Premium User evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    19,256
    Answers
    759

    Default

    Where are you creating the viewmodel?
    Twitter - @evantrimboli
    Former Sencha framework engineer, available for consulting.
    As of 2017-09-22 I am not employed by Sencha, all subsequent posts are my own and do not represent Sencha in any way.

  5. #5
    Sencha User
    Join Date
    May 2010
    Posts
    21

    Default

    in the folder :

    app/view/example/GroupModel.js

  6. #6
    Sencha Premium User evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    19,256
    Answers
    759

    Default

    That's just defining the class, where are you creating the instance on a view?

    Code:
    viewModel: {
        type: 'groups'
    }
    Twitter - @evantrimboli
    Former Sencha framework engineer, available for consulting.
    As of 2017-09-22 I am not employed by Sencha, all subsequent posts are my own and do not represent Sencha in any way.

Similar Threads

  1. How to apply admin-dashboard template
    By aram256 in forum Ext JS 6.x Q&A
    Replies: 19
    Last Post: 19 Aug 2017, 1:16 AM
  2. Extjs 6 grid bind store and load
    By _PASCAL_ in forum Ext JS 6.x Q&A
    Replies: 2
    Last Post: 5 Mar 2016, 1:07 AM
  3. Create new app same as admin dashboard template
    By mohit.saxena in forum Ext JS 6.x Q&A
    Replies: 1
    Last Post: 21 Nov 2015, 3:40 PM
  4. store method to load on admin dashboard template
    By ryanthe in forum Ext JS 6.x Q&A
    Replies: 1
    Last Post: 9 Sep 2015, 2:41 PM
  5. Bind grid to Panel; Ext.Template
    By josei in forum Ext 5: Q&A
    Replies: 2
    Last Post: 26 Feb 2015, 5:41 PM

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
  •