Activates ExtJs HtmlEditor textarea when it is loaded

To make sure ExtJs htmleditor’s text area is automatically activated when it is loaded up. Do the following:

hideLabel : true,
labelSeparator : '',
name : 'description',
xtype : "htmleditor",
listeners : {
  initialize : function(editor) {
    editor.focus();
  }
}

Making ExtJs (Submenus and Portal) iPad and iPhone friendly

As far as I know there are two main areas in ExtJs applications that need some works for making it touch devices (such as iPad and iPhone) friendly. One area is where the components rely on mouse hover actions such as submenus, whereas the other one is the general drag & drop (DD) motions. For mouse hover actions, only a simple configuration is required. As for drag & drop, simply includes touchHandler code will do the trick. However, application such as portal requires workaround to make sure the portlet title bar supporting DD and at the same time the tool buttons in the title bar response to touch actions.

Mental picture of ExtJs 4 MVC Architecture

Highstock is working on ExtJs 4!! (Experimental)

Wahey!! I got Highstock working on ExtJs 4 after a full day hacking on my HighChart ExtJs 4 extension. Although HighStock shares common APIs to HighChart, the extension requires quite a few changes. Well, hopefully I can release the package probably sometime next week, need to create a lot of examples to make sure everything is working.

Simple GUI messages handling with ExtJS 3

I need to have a very simple object to handle all the GUI messages in one single file which is for the purposes of simple extension on internationalisation. Also I can just hand the messages file to someone easily to correct my crappy english and plug back in the application. The code also handles message formatting using Ext.Template class.

Enhance ExtJS Ticker with Store support

I need a ExtJS ticker and I found someone posted the code in the sencha forum which has an online demo. However, I need a number of extra features which are not supported. So again I have modified the code. Couple of the features are inspired by Mioplanet’s news ticker. Here are the main features:

• option for ExtJS Store object
• visually enhance with color labels
• ticker pauses when mouse hovers over
• support categorised message type such as: Warning, Info
• click event handler support for messages

ExtJS: note on using autoLoad

Part of my web application is to construct a html document with embedded graph images. Once the document is created, a Panel component uses autoLoad property to load & display the content. However, the rendering inside the component is different to a browser displaying the html document. The ordered list tag < ol > is missing.

Creating a login page with ExtJS

I need to polish up the login screen of my ExtJS application and come across the
WordPress style login designs which gives me some ideas. Here is my first design of the login page using ExtJS.

ExtJS Spinnerfield icon obscured

It took me a while to find out why the up /down arrow icon in the Ext.ux.SpinnerField is obscured. It looks like this

Create Context Menu on Highcharts graph with ExtJS 3

Since I released the changes for the Highcharts context menu mod, I received a few requests for a proper working example. So I have included an ExtJS 3 example file in my github Highcharts_ContextMenu. Check it out.