Results 1 to 3 of 3

Thread: Please help am new to ext js

  1. #1

    Default Please help am new to ext js

    Hi All,

    I am getting the following error when I am executing the code I have written.

    TypeError: me.model is undefined

    [IMG]chrome://firebug/content/blank.gif[/IMG]

    if (me.lastFieldGeneration !== me.model.prototype.fields.generation) {


    I have a view port and in view port am using the border layout.

    In center of the border layout I have tool bar and Grid..

    To populate data in grid I have created one model and a store..but it is not working..Please find the below code I have written..


    Index.html

    <html>
    <head>
    <title>My First POC</title>

    <link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css">
    <script type="text/javascript" src="extjs/ext-debug.js"></script>
    <script type="text/javascript" src="app.js"></script>
    </head>
    <body></body>
    </html>

    App.js

    Ext.application({
    models: ['GridModel'],
    stores: ['Grid'],
    autoCreateViewport : true,
    name : 'MyFirstPOC'
    });

    ViewPort.js

    Ext.define('MyFirstPOC.view.Viewport', {
    renderTo: Ext.getBody(),
    extend: 'Ext.container.Viewport',

    layout:"border",
    items:[{
    region:"center",
    title:"Center",
    items:[
    {
    xtype:"toolbar",
    items:[{
    text:"View Report"
    },{
    text:"Copy"
    },{
    text:"Export:",
    disabled:true
    }]
    },

    {

    xtype :"grid",
    items :[{
    title: 'Simpsons',
    store: Ext.data.StoreManager.lookup('nameStore'),
    columns: [
    { text: 'FirstName', dataIndex: 'firstName' },
    { text: 'LastName', dataIndex: 'lastName'}

    ],
    height: 200,
    width: 400
    }]


    }]

    },{
    region:"west",
    title:"West",
    width:200,
    collapsible:true,
    titleCollapse:true,
    items:[{
    xtype:"combo",
    name:"combovalue",
    hiddenName:"combovalue",
    width:200
    }]
    }]

    });


    Grid.js(File name for creating store)

    Ext.define('MyFirstPOC.store.Grid', {
    extend: 'Ext.data.Store',
    model: 'MyFirstPOC.model.GridModel'

    });

    Ext.create('MyFirstPOC.store.Grid', {
    storeId:'nameStore',
    model: 'MyFirstPOC.model.GridModel',
    data : [
    {firstName: 'Ed', lastName: 'Spencer'},
    {firstName: 'Tommy', lastName: 'Maintz'},
    {firstName: 'Aaron', lastName: 'Conran'},
    {firstName: 'Jamie', lastName: 'Avins'}
    ]
    ,proxy: {
    type: 'memory',
    reader: {
    type: 'json'
    }
    }

    });

    GridModel.js(js file for creating model)

    Ext.define('MyFirstPOC.model.GridModel',{
    extend: 'Ext.data.Model',
    fields: [
    {name: 'firstName', type: 'string'},
    {name: 'lastName', type: 'string'}
    ]
    });

  2. #2
    Sencha User
    Join Date
    May 2011
    Posts
    3

    Default

    Remove items from the grid.

    try this
    Code:
    {
        xtype :"grid",
        title: 'Simpsons',
        store: Ext.data.StoreManager.lookup('nameStore'),
        columns: [
        { text: 'FirstName', dataIndex: 'firstName' },
        { text: 'LastName', dataIndex: 'lastName'}
        ],
        height: 200,
        width: 400
    }

  3. #3
    Sencha User slemmon's Avatar
    Join Date
    Mar 2009
    Location
    Boise, ID
    Posts
    6,165
    Answers
    505

    Default

    I take it @MMT's suggestion helped you?

    Here is an example of what MMT was saying to do in case you need it:

    Code:
    Ext.define('MyFirstPOC.model.GridModel', {
        extend: 'Ext.data.Model',
        fields: [{
            name: 'firstName',
            type: 'string'
        }, {
            name: 'lastName',
            type: 'string'
        }]
    });
    
    
    
    
    
    
    Ext.define('MyFirstPOC.store.Grid', {
        extend: 'Ext.data.Store',
        model: 'MyFirstPOC.model.GridModel'
    
    
    });
    
    
    Ext.create('MyFirstPOC.store.Grid', {
        storeId: 'nameStore',
        model: 'MyFirstPOC.model.GridModel',
        data: [{
            firstName: 'Ed',
            lastName: 'Spencer'
        }, {
            firstName: 'Tommy',
            lastName: 'Maintz'
        }, {
            firstName: 'Aaron',
            lastName: 'Conran'
        }, {
            firstName: 'Jamie',
            lastName: 'Avins'
        }],
        proxy: {
            type: 'memory',
            reader: {
                type: 'json'
            }
        }
    
    
    });
    
    
    Ext.define('MyFirstPOC.view.Viewport', {
        renderTo: Ext.getBody(),
        extend: 'Ext.container.Viewport',
    
    
        layout: "border",
        items: [{
            region: "center",
            title: "Center",
            items: [{
                    xtype: "toolbar",
                    items: [{
                        text: "View Report"
                    }, {
                        text: "Copy"
                    }, {
                        text: "Export:",
                        disabled: true
                    }]
                },
    
    
                {
    
    
                    xtype: "grid",
                    //items: [{
                        title: 'Simpsons',
                        store: Ext.data.StoreManager.lookup('nameStore'),
                        columns: [{
                                text: 'FirstName',
                                dataIndex: 'firstName'
                            }, {
                                text: 'LastName',
                                dataIndex: 'lastName'
                            }
    
    
                        ],
                        height: 200,
                        width: 400
                    //}]
    
    
    
    
                }
            ]
    
    
        }, {
            region: "west",
            title: "West",
            width: 200,
            collapsible: true,
            titleCollapse: true,
            items: [{
                xtype: "combo",
                name: "combovalue",
                hiddenName: "combovalue",
                width: 200
            }]
        }]
    
    
    });
    
    
    
    
    Ext.create('MyFirstPOC.view.Viewport');

Posting Permissions

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