Page 1 of 2 12 LastLast
Results 1 to 10 of 14

Thread: Confusion in Ext Js MVC

  1. #1
    Sencha Premium Member
    Join Date
    Apr 2012
    Posts
    48
    Vote Rating
    0
      0  

    Default Confusion in Ext Js MVC

    Hi,

    We are trying to use ExtJs MVC for our application and we are trying to create our own directory structor for MVC that is we are not following the directory structor given in example on Document. We are able to chage the name of Directories like model, store, view and my POC runs fine. But when ever I changed the folder name of controller folder, my POC stops running. I am giving code below:

    I have changed name of "controller" directory to "nitin" and according changed the name in my controller file and app.js file.

    Controller file:
    Code:
    Ext.define('AM.nitin.Users', {
        extend: 'Ext.app.Controller',
       
        models: ['AM.model.User'],
        stores: ['AM.store_123.Users'],
        views: ['Panel', 'Grid'],
        init: function() {
         Ext.create('Ext.panel.Panel', {
             layout: 'fit',
             height: 300,
             width: 500,
     
             items: {
                 xtype: 'userlist'
             },
     
             renderTo: document.body
         });
     
         Ext.create('AM.view.Grid').show();
    }
    });
    app.js file:
    Code:
    Ext.Loader.setConfig({
     
        enabled: true
    });
    Ext.application({
        name: 'AM',
        appFolder: 'app',
        controllers: [
                      'AM.nitin.Users'
                  ],
                  launch: function() {}
              });
    So, please suggest me that can we change the directory name of controller folder in ExtJs MVC, so that we can create our own directory structor.

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,409
    Answers
    716
    Vote Rating
    504
      0  

    Default

    You can use your own DIR structure, adhering to your class names.

    Scott.

  3. #3
    Sencha - Services Team
    Join Date
    Mar 2007
    Location
    Foristell, MO
    Posts
    1,120
    Answers
    14
    Vote Rating
    5
      0  

    Default

    I just tried this as well and I get an error when I change from using 'controller' to 'nitin'. So I'm on going to dig deeper to see why this is.
    Jack Ratcliff
    Sencha Inc, Green bleeding Senchan

    How to report a bug:
    https://www.sencha.com/forum/showthr...o-report-a-bug

  4. #4
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,409
    Answers
    716
    Vote Rating
    504
      0  

    Default

    Does this demonstrate what your setup? It should show 'works' in the console.

    f223458.zip

    Scott.

  5. #5
    Sencha - Services Team
    Join Date
    Mar 2007
    Location
    Foristell, MO
    Posts
    1,120
    Answers
    14
    Vote Rating
    5
      0  

    Default

    Hi Scott,

    I actually started with jksnu's code and tried to fill in the missing pieces. If you take what I have in the zip file you will see it works. But if you edit the app.js file and change the controllers to 'AM.nitin.Users' you get an error. The error is due to the AM.view.user.List class not getting loaded. But it loads when you use AM.controller.Users instead of AM.nitin.Users.
    Attached Files Attached Files
    Jack Ratcliff
    Sencha Inc, Green bleeding Senchan

    How to report a bug:
    https://www.sencha.com/forum/showthr...o-report-a-bug

  6. #6
    Sencha - Services Team
    Join Date
    Mar 2007
    Location
    Foristell, MO
    Posts
    1,120
    Answers
    14
    Vote Rating
    5
      0  

    Default

    Found the issue. In the onClassExtended method of Ext.app.Controller, it expects the controller to be named 'controller', otherwise it will not load the models, stores and views specified in the controller. So it looks like you have to use 'controller' in your namespace of your controller.


    Code:
        onClassExtended: function(cls, data, hooks) {
            var className = Ext.getClassName(cls),
                match = className.match(/^(.*)\.controller\./),
                namespace,
                onBeforeClassCreated,
                requires,
                modules,
                namespaceAndModule;
            
            if (match !== null) {
                namespace = Ext.Loader.getPrefix(className) || match[1];
                onBeforeClassCreated = hooks.onBeforeCreated;
                requires = [];
                modules = ['model', 'view', 'store'];
    
                hooks.onBeforeCreated = function(cls, data) {
                    var i, ln, module,
                        items, j, subLn, item;
    
                    for (i = 0,ln = modules.length; i < ln; i++) {
                        module = modules[i];
                        namespaceAndModule = namespace + '.' + module + '.';
    
                        items = Ext.Array.from(data[module + 's']);
    
                        for (j = 0,subLn = items.length; j < subLn; j++) {
                            item = items[j];
                            
                            
                            
                            
                            
                            
                            
                            if (item.indexOf('.') !== -1 && (Ext.ClassManager.isCreated(item) || Ext.Loader.isAClassNameWithAKnownPrefix(item))) {
                                requires.push(item);
                            } else {
                                requires.push(namespaceAndModule + item);
                            }
                        }
                    }
    
                    Ext.require(requires, Ext.Function.pass(onBeforeClassCreated, arguments, this));
                };
            }
        },
    Jack Ratcliff
    Sencha Inc, Green bleeding Senchan

    How to report a bug:
    https://www.sencha.com/forum/showthr...o-report-a-bug

  7. #7
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,409
    Answers
    716
    Vote Rating
    504
      0  

    Default

    I stand corrected .. good to know .. thanks for the research .. perhaps this should be changed

    Scott.

  8. #8
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,381
    Answers
    3997
    Vote Rating
    1536
      0  

    Default

    Just popping in and as Scott suggested it should be changed. I have a change pending to get merged into 4.1.2 that will allow you to have your own controller name and still load the models, stores and views.

    To sum it up, since I like cake, I would say you will be able to have your cake and eat it too
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Frontend Engineer
    ________________
    Need any sort of Ext JS help? Modus Create is here to help!

    Check out my GitHub:
    https://github.com/mitchellsimoens

  9. #9
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,381
    Answers
    3997
    Vote Rating
    1536
      0  

    Default

    Forgot to mention... you can still name your controllers whatever you would like and put the classes in the models, stores and views properties in Ext.application's requires array and it will load it no matter what the controller's name is. You won't get the getters created but IMO they aren't that useful.
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Frontend Engineer
    ________________
    Need any sort of Ext JS help? Modus Create is here to help!

    Check out my GitHub:
    https://github.com/mitchellsimoens

  10. #10
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,381
    Answers
    3997
    Vote Rating
    1536
      0  

    Default

    Researching into Ext.application it seems that controllers, models and stores configs do work but views does not. You can use requires instead of views but I have another merge pending to fix the views config and this will likely hit 4.1.2 also
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Frontend Engineer
    ________________
    Need any sort of Ext JS help? Modus Create is here to help!

    Check out my GitHub:
    https://github.com/mitchellsimoens

Page 1 of 2 12 LastLast

Posting Permissions

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