Sencha Inc. | HTML5 Apps

Common Ext JS errors

Published Sep 17, 2010 | The Sencha Dev Team | FAQ | Easy
Last Updated Jul 11, 2011

This FAQ is most relevant to Ext JS, 2.x, 3.x.

This article is currently due for review
We suspect that this article may be out-of-date or contain incorrect information.
But we are constantly editing articles, so we promise we will get to this one soon.

This article lists some questions and common issues you might experience when building Ext JS applications.

"Ext is undefined"

This almost always means that you are missing one of your include files (or a path is invalid), or the include files are not in the proper order. Each include file depends on the previous one, and if anything in the chain is missing, an error will occur. This message simply means that Ext was never properly loaded, and the first piece of application code that calls into Ext will get this error.

This could also mean that the type attribute on one or more of your script tags is incorrectly set. For example:

<script type="text/javasscript" src="/somepath.js"></script>
<script type="text/javascript" src="/somepath.js"></script>

The first tag will not correctly load the javascript even if "somepath.js" is the correct location of your script file. (Notice the mis-spelling of javascript in the type attribute). The second tag will work just fine.

You can also check the "Net" tab in Firebug to verify that all of your paths are correct. Any invalid include paths will show up in red as invalid links.

My code does not work in Internet Explorer, but it works fine in Firefox

You might have an extra comma somewhere in your code that causes Internet Explorer to stop parsing the code correctly (also check if you have commented out all firebug commands that will confuse IE). The most common symptom is that your code works without any errors in other browsers, but not in IE. You can read more discussion about this issue in the forums. Here is an example of what to watch out for:

testFunc = function() {
    return {
        titlebar: true,                            
        collapsible: true,  // <--- BOOM goes the comma! :D
    }
}

or:

configOption: [
        arrayEl1,
        ArrayEl2,  // <-- Will NOT blow up here, but creates an extra element
    ]

This adds an extra element of value undefined to the end of the Array, and some Components which process Arrays may be adversely affected by this.

A helpful tool to use is JSLint, which parses and verifies the validity of your code. It's very handy in general, and will catch this problem easily.

Another way is to run the page in Opera with the Error Console set to display Javascript errors. This often pinpoints problem areas of code much better than IE.

If you have a minified version of your code, you can search for ",]" or ",}", this way you can find some of the "extra commas". You can also search in your "not minified" code with regular expressions like ,[\s ]*\] .

"sp is undefined"

This is usually when calling Ext.extend and the superclass you pass has not been defined. Check your namespace and for spelling errors, etc.

"XX has no properties"

It means that XX is not a valid object reference. This error is commonly caused by a reference to a non-existent (or non-available) element for which the specified id does not exist in the DOM. There are many cases in which you can specify an element by id. For example:

// constructors:
var tb = new Ext.Toolbar('toolbar');
 
// creating Element references:
var saveBtn = Ext.get('save-button');

The string passed must be the id attribute of a valid HTML element, e.g.

<div id="toolbar"></div>
<input id="save-button" type="button" value="Save" />

If an element with such an id does not exist in your document, has not yet been created, or if the code is executed before the DOM has been fully loaded (tip: always use Ext.onReady when your code depends on the availability of any DOM elements), then you will end up with an undefined variable that will throw this error message the first time you attempt to access it as an object.

Security Warning in IE using SSL

If you're getting that annoying security warning that asks you if you want to download insecure items in IE over SSL, don't fret. You just have to remember to set your BLANK_IMG_URL to the local version of s.gif.

Share this post:
Leave a reply

Written by The Sencha Dev Team

1 Comment

Tamesh

3 years ago

IE is giving “null” is null or not an object and mozila is giving ct is null.

I am getting the error
In IE is giving “null” is null or not an object and mozila is giving ct is null

Below i have metioned the code plz help.

callFunction = function(){
alert(“call”);
}

Ext.onReady(callFunction );

Leave a comment:

Commenting is not available in this channel entry.