1. #1
    Sencha User
    Join Date
    Oct 2012
    Location
    Clearwater, FL
    Posts
    10
    Vote Rating
    0
    BadISBrad is on a distinguished road

      0  

    Default Ext.grid.Panel not showing more than 16 rows? If more than none load at all...

    Ext.grid.Panel not showing more than 16 rows? If more than none load at all...


    I've been looking in the forums and API guides everywhere trying to figure this thing out. I'm sure there is a simple reason why it's not working but here is my question/problem.

    For some reason my Ext.grid.Panel will not display than 16 records if the stores autoLoad: false, and manually calling the Ext.data.Store.load(); Please follow my code below, hopefully someone can spot something. I am fairly new at this framework so please be forgiving in your comments!

    I need to know if this is a problem with my grid view?
    Or is a config in the store?
    Or a combination of the two?
    Or am I just way off track here.

    If this all looks familiar it is basically the "Sencha's Guide AM Simple MVC architecture" example. Just modified for my own purposes.

    I have a viewport

    Code:
    Ext.define('AM.view.Viewport', {    
    extend: 'Ext.container.Viewport',
    
        items: [
            {
                xtype:'button',
                text: 'Refresh',
                action: 'load'
            },
            {
                xtype: 'ABE_GetStudentsGrid'
    
    
            }
    
    
        ]
    
    
    });
    The viewport to hold my my grid panel and a button to load the data, this is just a simple app for me to test some custom boilerplate stuff we are trying with REMObjects. Anyways, I have an Ext.grid.Panel defined as xtype: 'ABE_GetStudentsGrid'

    Code:
    Ext.define('AM.view.ABE_GetStudentsGrid', {    extend: 'Ext.grid.Panel',
        alias: 'widget.ABE_GetStudentsGrid',
        store: 'ABE_GetStudentsGrid',
        title: 'Students',
        scroll: true,
        height: '400',
    
    
    
    
        columns: [
            {header: 'StudentID', dataIndex: 'StudentID', flex: 1},
            {header: 'First Name', dataIndex: 'FirstName', flex: 1},
            {header: 'Last Name', dataIndex: 'LastName', flex: 1}
        ]
    
    
    });
    Then my store and model
    Ignore the //Commented stuff, I was trying to try different configs to see if it would have any affect.

    Code:
    Ext.define('AM.store.ABE_GetStudentsGrid',{    extend: 'Ext.data.Store',
        model: 'AM.model.ABE_GetStudentsGrid',
        //buffered: true,
    
    
        //autoSync: true,
    
    
        proxy: {
            type: 'ajax',
            url: 'data/api.asp',
            reader:{
                type: 'json',
                root:'records',
                successProperty: 'success'
            }
            ,
            extraParams:{
                    'Procedure': 'inters.ABE_GetStudentsGrid',
                    'ROSessionGUID': 'pbrack',
                    'TokenSearch': ''
            }
    
    
        }
    
    
    });
    and my model

    Code:
    Ext.define('AM.model.ABE_GetStudentsGrid',{    extend: 'Ext.data.Model',
    
    
        fields: ['StudentID', 'FirstName', 'LastName']
    
    
    });
    and finally my controller

    Code:
    Ext.define('AM.controller.ABE_GetStudentsGrid', {    extend:'Ext.app.Controller',
        stores: ['ABE_GetStudentsGrid'],
        models: ['ABE_GetStudentsGrid'],
        views:['ABE_GetStudentsGrid'],
    
    
    
    
    
    
        init: function() {
            this.control({
                'viewport > button[action=load]': {
                    click: this.loadGrid
                }
    
    
            });
        },
    
    
        loadGrid: function(){
    
    
                console.log("Click is firing for grid load");
            this.getABE_GetStudentsGridStore().load();
            this.getABE_GetStudentsGridView()
    
    
        }
    
    
    });

    Now if I limit the asp page return only 16 records or less it displays perfectly. See screenshot of successful load.

    Success.jpg

    But if I let it ride through any more than that, like for instance in this shot I let it go to 20 records. It fails to load or paint the records on the grid! See screenshot

    Failure.jpg

  2. #2
    Sencha User
    Join Date
    Oct 2012
    Location
    Clearwater, FL
    Posts
    10
    Vote Rating
    0
    BadISBrad is on a distinguished road

      0  

    Default


    I just wanted to attach the Json file too that this app is using.



    Code:
    {success: true, records: [{StudentID:1411200, FirstName: 'Elizabeth', LastName: 'Abrams'}, 
    {StudentID:973008, FirstName: 'David', LastName: 'Adams'}, 
    {StudentID:1376818, FirstName: 'Robert', LastName: 'Austin'}, 
    {StudentID:974221, FirstName: 'Nicholas', LastName: 'Bailey'}, 
    {StudentID:1377603, FirstName: 'Ryan', LastName: 'Bailey'}, 
    {StudentID:1312321, FirstName: 'Raven', LastName: 'Banks'}, 
    {StudentID:972935, FirstName: 'Casey', LastName: 'Barrow'}, 
    {StudentID:1422072, FirstName: 'Timothy', LastName: 'Blair'}, 
    {StudentID:1399854, FirstName: 'Albonne', LastName: 'Blakley'}, 
    {StudentID:1376784, FirstName: 'Charles', LastName: 'Boswell'}, 
    {StudentID:973820, FirstName: 'Shane', LastName: 'Bowne'}, 
    {StudentID:1312452, FirstName: 'Coty', LastName: 'Bradshaw'}, 
    {StudentID:1265755, FirstName: 'Leiza', LastName: 'Brainard'}, 
    {StudentID:1316416, FirstName: 'Shane', LastName: 'Cail'}, 
    {StudentID:1302784, FirstName: 'Mellisa', LastName: 'Cantrell'}, 
    {StudentID:1302882, FirstName: 'Patricia', LastName: 'Cantu''}, 
    {StudentID:1347179, FirstName: 'Jontae', LastName: 'Carter'}, 
    {StudentID:1376799, FirstName: 'Houston', LastName: 'Chandler'}, 
    {StudentID:1309806, FirstName: 'Marquis', LastName: 'Cofield'}]}

  3. #3
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,624
    Vote Rating
    331
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      1  

    Default


    You've got two single quotes at the end of this entry:

    Code:
    {StudentID:1302882, FirstName: 'Patricia', LastName: 'Cantu''},

  4. #4
    Sencha User
    Join Date
    Oct 2012
    Location
    Clearwater, FL
    Posts
    10
    Vote Rating
    0
    BadISBrad is on a distinguished road

      0  

    Default


    Oh lord, it didn't even occur to me that it might be a data issue. I'm used to working in more forgiving languages, I guess I need to write in some string cleaning function for users who can't tell a single quote apart from an apostrophe. Thank you very much for pointing that out. I haven't tested it yet but I'm sure will solve the issue because it is the 16th record. Exactly where it stopped working at.

    Thanks again skirtle!

Thread Participants: 1

Tags for this Thread