1. #1
    Sencha User
    Join Date
    Apr 2012
    Posts
    3
    Vote Rating
    0
    adamantinex is on a distinguished road

      0  

    Default Unanswered: Sencha Touch XType

    Unanswered: Sencha Touch XType


    SO I am building my first Sencha Touch App and I am having a problem with rendering a Panel that I have defined.

    Login.js
    Code:
    Ext.define("Blog.view.Login", {  extend:'Ext.form.Panel',  requires : ['Ext.form.FieldSet', 'Ext.field.Email', 'Ext.field.Password'],  xtype: 'loginpanel',  config:{    scrollable:true,    title: "Log In",    items:[      {        html:"<center><h1>Ok</h1></center>",        styleHtmlContent:true      },      {        xtype:'fieldset',        items:[          {            xtype:'emailfield',            name:'email',            placeHolder:'E-Mail'          },          {            xtype:'passwordfield',            name:'password',            placeHolder:'Password'          }        ]      },      {        xtype:'button',        text:'Log In',        style:{          marginBottom:'20px'        }      },      {        xtype:'button',        text:'Sign Up'      }    ]  }});
    Home.js
    Code:
    Ext.define("Blog.view.Main", {  extend:'Ext.Container',  config:{    items:[      {        xtype :'loginpanel'      }    ]  }});
    app.js
    Code:
     views: ['Main', 'Login'],
    I did some research already and someone suggested to use

    alias: 'widget.loginpanel'I tried it but it still did not work. Does anyone have any solution to this?

    I have posted this on stackoverflow as well. The code is better formatted there

    http://stackoverflow.com/questions/1...ng-as-expected

  2. #2
    Sencha User
    Join Date
    Jan 2011
    Posts
    134
    Vote Rating
    5
    Answers
    6
    JRS is on a distinguished road

      0  

    Default Here is my guess

    Here is my guess


    In your app.js
    Code:
     launch: function(){
    Ext.Viewport.add(Ext.create('Blog.view.Main'));
    }
    I'm still learning - so it's just a guess on my part.
    Hope this help
    JRS

  3. #3
    Sencha User
    Join Date
    Apr 2012
    Posts
    3
    Vote Rating
    0
    adamantinex is on a distinguished road

      0  

    Default


    Quote Originally Posted by JRS View Post
    In your app.js
    Code:
     launch: function(){
    Ext.Viewport.add(Ext.create('Blog.view.Main'));
    }
    I'm still learning - so it's just a guess on my part.
    Hope this help
    JRS
    Thanks for the help. I already have that actually inside my app.js

  4. #4
    Sencha User
    Join Date
    Jan 2011
    Posts
    134
    Vote Rating
    5
    Answers
    6
    JRS is on a distinguished road

      0  

    Default Do you get any errors in your browser console?

    Do you get any errors in your browser console?


    Are you getting any errors in your browser console?

  5. #5
    Sencha User
    Join Date
    Apr 2012
    Posts
    3
    Vote Rating
    0
    adamantinex is on a distinguished road

      0  

    Default


    Quote Originally Posted by JRS View Post
    Are you getting any errors in your browser console?
    I do not see any errors =(

  6. #6
    Sencha User
    Join Date
    Dec 2012
    Posts
    13
    Vote Rating
    0
    JackThor is on a distinguished road

      0  

    Default


    When defining your panel add fullscreen: true after scrollable: true. That way it will render it to your screen. You you don't want it to take the full space then explicitly define the height and width fo your panel.

  7. #7
    Sencha User
    Join Date
    Dec 2012
    Posts
    8
    Vote Rating
    0
    nodohoung is on a distinguished road

      0  

    Default


    Because you defined the class 'Blog.view.Main' in the file 'Home.js' instead of 'Main.js' so Sencha couldn't load the file 'Main.js' as you declared in the app.js "views: ['Main', 'Login']". Rename Home.js to Main.js to resolve that problem

Thread Participants: 3

Tags for this Thread