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

**bomslang** · 5 Sep 2012 4:31 AM

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 ?

**TBakker** · 5 Sep 2012 5:06 AM

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'});

**bomslang** · 5 Sep 2012 5:18 AM

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 ?

**TBakker** · 5 Sep 2012 5:26 AM

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!

**mitchellsimoens** · 5 Sep 2012 5:42 AM

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.

**bomslang** · 5 Sep 2012 5:58 AM

@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>

**TBakker** · 5 Sep 2012 6:11 AM

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>

**bomslang** · 5 Sep 2012 6:39 AM

@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

**TBakker** · 6 Sep 2012 1:45 AM

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

**bomslang** · 6 Sep 2012 3:59 AM

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

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

Thread Tools

Search Thread

Display

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

Tags for this Thread