1. #1
    Sencha Premium Member
    Join Date
    Apr 2012
    Location
    Mumbai, India
    Posts
    191
    Vote Rating
    0
    Answers
    10
    bomslang has a little shameless behaviour in the past

      0  

    Exclamation Unanswered: ExtJS 4.1 MVC Hello World Not running in Dynamic Web Project in Eclipse

    Unanswered: ExtJS 4.1 MVC Hello World Not running in Dynamic Web Project in Eclipse


    Folks,

    I was trying out sample ExtJS 4.1 app inside dynamic web project in Eclipse.
    Here's my directory structure :-

    web - Folder where all web resources will reside

    dir.PNG

    Here's my index.html :-

    Code:
    <html>
    <head>
        <title>ExtJS Examples</title>
        <link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" />
        
        <script type="text/javascript" src="extjs/ext.js"/>
        <script type="text/javascript" src="extjs/ext-all-debug.js"/>
        <script src="app.js"></script>
        
    </head>
    <body>
    </body>
    </html>
    and here's my app.js

    Code:
    Ext.Loader.setPath({
        'Ext':'extjs/src'
    });
    
    
    Ext.application({
        name: 'DemoApp,
        
        requires: ['Ext.window.MessageBox'],
        appFolder: 'app',
        launch: function() {
            Ext.Msg.alert('Done');
        }
    });
    While I try to run this application on server tomcat, nothing appears on the browser window as well as console logs.

    What I am missing ?
    --
    Bomslang,
    Software Engineer,
    HTML5 Developer | ExtJS, Sencha Touch, GXT Passionate | Json Supporter

    Twitter : @bomslang

    ----------------------------------------------------------------------------------

    # Learn about Sencha Products via it's Documentation : ExtJS | Sencha Touch | GXT

    # Check for correct Json here : JSONLint.com

    # Want to code Sencha Touch Online ? Try SenchaFiddle.com

    # Want to code and test ExtJS Online ? Try http://ext4all.com/ & http://jsfiddle.net/

    # Must Read : 20 things to avoid / do when starting with ExtJS or Sencha Touch

  2. #2
    Sencha User
    Join Date
    Jul 2012
    Posts
    10
    Vote Rating
    0
    TBakker is on a distinguished road

      0  

    Default


    You only need one reference to the extjs file:
    HTML Code:
    <script type="text/javascript" src="extjs/ext-all.js"/>
    This is not your solution tho
    I think you don't need to specify the 'Ext' path:

    Code:
    Ext.Loader.setPath({'Ext':'extjs/src'});

  3. #3
    Sencha Premium Member
    Join Date
    Apr 2012
    Location
    Mumbai, India
    Posts
    191
    Vote Rating
    0
    Answers
    10
    bomslang has a little shameless behaviour in the past

      0  

    Default


    I tried removing both, but it doesn't work. Nothing appears on browser window as well as screen.

    Code:
    <script type="text/javascript" src="extjs/ext-all.js"/>
    and

    Code:
    Ext.Loader.setPath({ 'Ext':'extjs/src'});
    What am I doing wrong ?
    --
    Bomslang,
    Software Engineer,
    HTML5 Developer | ExtJS, Sencha Touch, GXT Passionate | Json Supporter

    Twitter : @bomslang

    ----------------------------------------------------------------------------------

    # Learn about Sencha Products via it's Documentation : ExtJS | Sencha Touch | GXT

    # Check for correct Json here : JSONLint.com

    # Want to code Sencha Touch Online ? Try SenchaFiddle.com

    # Want to code and test ExtJS Online ? Try http://ext4all.com/ & http://jsfiddle.net/

    # Must Read : 20 things to avoid / do when starting with ExtJS or Sencha Touch

  4. #4
    Sencha User
    Join Date
    Jul 2012
    Posts
    10
    Vote Rating
    0
    TBakker is on a distinguished road

      0  

    Default


    Code:
    Ext.application({
        autoCreateViewport: true
    });
    You are missing a Viewport. You need to create one in "app/view/Viewport.js". Please refer to an simple example: http://try.sencha.com/extjs/4.1.0/co...d-binded-form/ and press "Edit Example".
    More MVC examples: http://try.sencha.com/tags/mvc .

    Hope this helps!

  5. #5
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,547
    Vote Rating
    873
    Answers
    3566
    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


    Try with ext-all-dev.js as dev has all the logs Ext JS will spit out. Also, ext-all.js does not have Ext.Loader enabled by default like debug and dev files do.
    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.

  6. #6
    Sencha Premium Member
    Join Date
    Apr 2012
    Location
    Mumbai, India
    Posts
    191
    Vote Rating
    0
    Answers
    10
    bomslang has a little shameless behaviour in the past

      0  

    Default


    @TBakker and @Mitch -
    I did include ext-all-dev.js.

    I tried what you said, but no o/p.
    app.js
    Code:
    Ext.Loader.setConfig({ 
        enabled: true
    });
    Ext.application({
        name: 'DemoApp',
        appFolder: 'app',
        autoCreateViewport: true,
        launch: function() {
        	Ext.Msg.alert('title');
        }
    });
    and index.html
    Code:
    <html>
    <head>
    	<title>ExtJS Examples</title>
    	<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" />
    	
    	<!--<script type="text/javascript" src="extjs/ext.js"/> -->
    	<script type="text/javascript" src="extjs/ext-all-dev.js"/>
    	<script type="text/javascript" src="app.js"/>
    	
    </head>
    <body>
    </body>
    </html>
    --
    Bomslang,
    Software Engineer,
    HTML5 Developer | ExtJS, Sencha Touch, GXT Passionate | Json Supporter

    Twitter : @bomslang

    ----------------------------------------------------------------------------------

    # Learn about Sencha Products via it's Documentation : ExtJS | Sencha Touch | GXT

    # Check for correct Json here : JSONLint.com

    # Want to code Sencha Touch Online ? Try SenchaFiddle.com

    # Want to code and test ExtJS Online ? Try http://ext4all.com/ & http://jsfiddle.net/

    # Must Read : 20 things to avoid / do when starting with ExtJS or Sencha Touch

  7. #7
    Sencha User
    Join Date
    Jul 2012
    Posts
    10
    Vote Rating
    0
    TBakker is on a distinguished road

      0  

    Default


    When I try to execute your code it just works fine for me. Which browser are you using (this should not matter but just for testing ).

    Try this:
    Code:
    Ext.application({    
      name: 'MyApp',    
      launch: function() {        
        Ext.Msg.alert('Hello World');    
    }});
    This is my html:
    HTML Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html><head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title></title>
    <link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
    
    <script type="text/javascript" src="ext/ext-all.js"></script>
    <script type="text/javascript" src="app.js"></script>
    </head>
    <body></body>
    </html>

  8. #8
    Sencha Premium Member
    Join Date
    Apr 2012
    Location
    Mumbai, India
    Posts
    191
    Vote Rating
    0
    Answers
    10
    bomslang has a little shameless behaviour in the past

      0  

    Default


    @Tbakker -

    That code structure is working fine for me too - but only in normal Eclipse Project.

    But ( as you can see the #1 post image dir structure ) when I try to run it in Dynamic Web Project in Eclipse inside the "web" folder, it doesn't run.

    Can you please check by making a folder structure like mine using Dynamic Web Project in Eclipse ?

    dir.PNG
    --
    Bomslang,
    Software Engineer,
    HTML5 Developer | ExtJS, Sencha Touch, GXT Passionate | Json Supporter

    Twitter : @bomslang

    ----------------------------------------------------------------------------------

    # Learn about Sencha Products via it's Documentation : ExtJS | Sencha Touch | GXT

    # Check for correct Json here : JSONLint.com

    # Want to code Sencha Touch Online ? Try SenchaFiddle.com

    # Want to code and test ExtJS Online ? Try http://ext4all.com/ & http://jsfiddle.net/

    # Must Read : 20 things to avoid / do when starting with ExtJS or Sencha Touch

  9. #9
    Sencha User
    Join Date
    Jul 2012
    Posts
    10
    Vote Rating
    0
    TBakker is on a distinguished road

      0  

    Default


    I think this is more of a Eclipse question than a Ext JS question because the code is fine

    I have one more solution for you to try,
    Dont write: <script type="text/javascript" src="app.js"/>
    Write: <script type="text/javascript" src="app.js"></script>

    https://www.ibm.com/developerworks/m...oject6?lang=en

  10. #10
    Sencha Premium Member
    Join Date
    Apr 2012
    Location
    Mumbai, India
    Posts
    191
    Vote Rating
    0
    Answers
    10
    bomslang has a little shameless behaviour in the past

      0  

    Default


    Thanks for your reply.

    Btw, I already saw that link before. But that didn't help me out.

    Could you run a ExtJS 4.1 Hello World project in Dynamic web project in eclipse by making the same directory structure as I have shown in the image ?

    Thanks
    --
    Bomslang,
    Software Engineer,
    HTML5 Developer | ExtJS, Sencha Touch, GXT Passionate | Json Supporter

    Twitter : @bomslang

    ----------------------------------------------------------------------------------

    # Learn about Sencha Products via it's Documentation : ExtJS | Sencha Touch | GXT

    # Check for correct Json here : JSONLint.com

    # Want to code Sencha Touch Online ? Try SenchaFiddle.com

    # Want to code and test ExtJS Online ? Try http://ext4all.com/ & http://jsfiddle.net/

    # Must Read : 20 things to avoid / do when starting with ExtJS or Sencha Touch