ExtJS Hack: How To Get Selected Index of ExtJS ComboBox

ExtJS ComboBox doesn't advertise, in its documentation, any way to get the selected index of a ComboBox. Looking at the code I realized we can use the undocumented property selectedIndex. However there is a catch.

Full article (64 words) »

ExtJS Hack: Dynamic ComboBox & Remote On-Demand Loading With Local Filtering

In ExtJS you can create ComboBox which loads data from the server. You can also code so that new data is loaded from the server in response to an event like changing selection of another ComboBox. However it also means that the filtering is done remotely which is slow.

In ExtJS ComboBox automatic filtering is a nifty capability where the ComboBox items are automatically filtered to show only the values which matches the text you typed so far. It can also auto-fill the rest for you. This powerful capability comes at a price for remote mode. Every time the data is filtered by sending a query to the server which can be slower than local query.

In many use cases the full data is already on the client side, fetched during the initial loading of the ComboBox. Subsequent filtering can be easily done on the client side. Let's see how we can solve it.

Update: I have also filed a defect in ExtJS forum to hopefully incorporate the functionality in the core with suggested solutions. The defect details has been provided at the end of this post.
Full article (719 words) »

How To Make AJAX Calls With ExtJS Easily

Simple things should be simple. While starting with ExtJS, I saw a screencast on Grid which used a rather dubious method of making an AJAX call using an actual form element. I hunted for a better option and I came across a better option - Ext.data.Connection. Here's an working example on how you can easily make AJAX call in ExtJS library.

Full article (292 words) »

ExtJS: Ext.LayoutDialog Gotchas

After much debugging I realized that in creating dialogs using Ext.LayoutDialog class of ExtJS library we must specify the configuration for east, west, north and south properties, as required, in the LayoutDialog config (see below for more requirements, details and a working example). This should be done before you add the content panels to the layout of the dialog. Otherwise you will get some really hard to debug errors.

Full article (247 words) »

Solving: Permission denied to get property HTMLDivElement.nodeType when calling method: [nsIDOMEventListener::handleEvent] nsresult: 0×8057001e (NS_ERROR_XPC_JS_THREW_STRING) location: data: no

This is a sporadic error that I have seen in Firefox browsers while using the Ext JS components. It is not harmful in any way but is annoying. It is filed as a Firefox defect and has been fixed for 3.0a5pre. In the earlier version here is how you can fix it for Firefox.

Full article (85 words) »

Solutions: Internet Explorer 6 Visibility Bug With ExtJS ComboBox on Toolbar

An Ext JS, a beautiful Javascript Library, ComboBox on a Toolbar fails to display when the browser window is resized or there is another div with 100% width. The problem is most likely related to resizing of the Toolbar which causes the ComboBox to stop displaying.

Full article (374 words) »

Protected by Comment Guard Pro