1. #1
    Sencha User
    Join Date
    Feb 2012
    Posts
    21
    Vote Rating
    1
    Answers
    3
    swardson is on a distinguished road

      0  

    Exclamation Answered: MVC Data and View help

    Answered: MVC Data and View help


    Hi all,

    First of all, I am new to the Sencha community, but not new to programming. I am highly impressed with Sencha Touch and the community of developers here. The documentation is top notch and it seems like a great community.

    I am working on building a prototype for e-learning on mobile devices and have been consistently running into a barrier with Sencha and have not yet been able to wrap my head around it.

    My question is in regards to programming with Sencha Touch in MVC. I prefer coding in the MVC style and was drawn to Sencha initially because of it's MVC design. However, I am having some major issues understanding how to access data across the application. I have read the documentation, watched and read tutorials and walkthroughs, read the Ext.js 4 book on data and MVC (which is the same base between Ext.js 4 and Sencha Touch), and searched the forums for days to help, but have come up empty. As such I am here to post.

    Here are the specifics of my problem. I have an .xml file that has data in it. I would like to read that data into my program and use it to populate content within a series of panels. I have my app.js, controller, a couple views, model and stores setup. I can read the data from the store into a list or data grid by using the store parameter, but I cannot find a way to access a specific record in the store and get it's contents to pass it to a panel's html or a tool bar header etc.

    I am sure I am missing some fundamental element, but would really appreciate any help or advice anyone could provide. I am not opposed to research so please don't hesitate to offer whatever guidance you can provide.

    Here are my sets of code so far:

    My basic xml file for now.

    Code:
    <?xml version="1.0" encoding="UTF-8"?><course>
        <title></title>
        <pages>
            <page>
                <id>010101</id>
                <title>Page 1</title>
                <url>assets/pages/010101.html</url>
            </page>
            <page>
                <id>010102</id>
                <title>Page 2</title>
                <url>assets/pages/010101.html</url>
            </page>
            <page>
                <id>010103</id>
                <title>Page 3</title>
                <url>assets/pages/010101.html</url>
            </page>
        </pages>
    </course>
    app.js

    Code:
    Ext.regApplication({    name: 'app',
        useLoadMask: true,
        
        launch: function() {
            
            console.log('Application Registered');
            
            // Launch Course with index action on Controller.
            Ext.dispatch({
                
                controller: app.controllers.courseController,
                action: 'index',
            });
            
        },
    });
    Controller (hoping to get data here and pass it to views)

    Code:
    app.controllers.courseController = new Ext.Controller({     
        // index action
        index: function(options)
        {
            console.log('Controller Registered!');
            
            // Instantiate main wrapping viewport
            app.views.viewport = new app.views.viewport();
        },
        
        dataLoaded: function(options){
            
            console.log('Data is Loaded');
            
            var store = Ext.getStore('pagesStore');
            
        }
    });
    model

    Code:
    app.models.pages = Ext.regModel('pages', {    fields: [
            {name: 'id', type: 'int' },
            {name: 'title', type: 'string' },
            {name: 'url', type: 'string' }
        ],
        
        getRecord: function(){
            console.log(data);    
        }
        
    });
    Store

    Code:
    app.stores.pagesStore = Ext.regStore('pagesStore', {    
        model: 'pages',
        
        proxy: {
            
            type: 'ajax',
            url : 'assets/xml/course.xml',
            
            reader: {
                type: 'xml',
                root: 'pages',
                record: 'page'
            },
            
            autoload: true
        }
    });
    
    
    app.stores.pagesStore = Ext.StoreMgr.get('pagesStore');
    Thanks!

  2. Thank you for the reply!

    The main solution to my problem for the moment is that I need to listen for the store to be fully loaded before trying to access the records individually. I was thrown off because I could see the object and navigate to the records in the console.

    The actual solution to this part can be found here:

    http://www.sencha.com/forum/showthre...cords-in-store

    Thanks mitchellsimoens

  3. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,541
    Vote Rating
    872
    Answers
    3565
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    How are you wanting to get the record? You can use one of the find method on the store or if you want a certain index you can use getAt. Once you get the record you can use the get method to get a field's value.

    Also, MVC between Ext JS 4 and Sencha Touch 1 is very different.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  4. #3
    Sencha User
    Join Date
    Feb 2012
    Posts
    21
    Vote Rating
    1
    Answers
    3
    swardson is on a distinguished road

      0  

    Default


    Thank you for the reply!

    The main solution to my problem for the moment is that I need to listen for the store to be fully loaded before trying to access the records individually. I was thrown off because I could see the object and navigate to the records in the console.

    The actual solution to this part can be found here:

    http://www.sencha.com/forum/showthre...cords-in-store

    Thanks mitchellsimoens

  5. #4
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,541
    Vote Rating
    872
    Answers
    3565
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    An array and object are just references so if the array/object is updated somewhere, the other references will be updated so the reference in the console will be updated when the store loads.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

Thread Participants: 1

Tags for this Thread