Ext JS 3.0 Cookbook

I just recieved a review copy of Jorge Ramon's book Ext JS 3.0 Cookbook from Packt Publishing.

I will be posting a detailsed review in a couple of weeks. I spent about 20 minutes so far just browsing the book and I really like the way the book is laid out. The book is full of "recipes" each recipe starts with the result, then a guide on how to do it yourself and then an explanation of what it is you are doing.

I find this type of book very good because it concentrates on providing real world solutions. Now lets see how those recipes turn out in my Ext JS kitchen.

Happy Coding...

Mini DVI Adapter

I spent some time the last week or so working sporadically on an intro Presentation for ExtJS. Basically highlighting some of the cool things like Ext Direct. It also happens to be my last day at the company.


Ext JS 3.0 Final Released

I posted a little while ago that Ext JS 3.0 was available, well that was not the final release. Ext announced today on their blog yesterday that the final release of 3.0 is now available for download.


Ext JS 3.0 Released

Although not announced yet on their blog I noticed today that Ext JS 3.0 is now available for download.


Ext JS 3.0 Remoting Made Simple with Ext:Direct

Yesterday Ext JS announced via their blog the release of Ext:Direct a new package to help developers write less code by streamlining communication between client and server.


EXT:Core 3 Beta Available

ExtJS has just release the beta of their upcoming version 3 of their Core library. They have spent some time refactoring the code and have reduced the overall footprint. You can download the release and give it a try.


AIR MP3 Player by EXTJS

The gang over at ExtJS certainly don't sit still for very long. I noticed that they have just developed an AIR MP3 player using their ExtJS library, or more correctly enhancements to their Ext.air package.


SEO & Ajax

How do you provide your customers with the Ajax functionality they want and still optimize the site for search engines?


Ext On Demand Data Loading

Aaron Conran over at EXTJS posted a really interesting entry today on On Demand Data Loading. The functionality produced looks much like that of the data paging capability using Lifecycle and Flex in that the data is loaded into the grid when the user scrolls past a certain point.


ExtJS 2 Upgrade Woes

I have been playing around a bit more lately with ExtJS 2.0 and at the same time with ColdEXT (since ColdEXT is based on the 2.0 version). There have been some rather dramatic changes since the 1.1 version.



I got a chance to play around a little bit this evening with ColdEXT. If you don't know what it is, it is a really good custom tag library that for a fair portion of the EXTJS library that is pretty easy to use.

It looks like Justin Carter spent a fair amount of time working on this custom tag library. He has a few examples packed into the zip file as well as on his blog but as of yet is lacking any extensive how-to guides (but most of you shouldn't have too much time figuring it out if you have had any exposure at all to EXT).


EXT Update Supports Adobe Air

Jack and the team over at Ext JS released an update to their popular Ajax framework. This update was release to provide better support for the newly released Adobe Integrated Runtime (AIR).

The sample application built for AIR using the EXT framework was also subsequently updated and is now available (source included) for download.

You can read more about the amazing Simple Task application on the EXT JS blog.

I took the application for a test drive and I have to say it's pretty damn cool. I especially like ability to drag-n-drop tasks from Outlook to Simple Task.

InfoQ on ExtJS

I stumbled upon a nice little article over at infoQ about how the ExtJS Ecosystem Continues to Expand. The article targets how new server side tools for ExtJs are sprouting up for ruby-on-rails, Java and of course Coldfusion.

The article also specificaly mentions the efforts by Dan Vega and Justin Carter to tie into the 2.0 version of ExtJs (Coldfusion officially only supports version 1.0).

It's good to see both Ext and Coldfusion getting a bit more exposure.

Happy Coding...

EXTJS Offers Consulting Services

The crew over at ExtJS have been hard at working rolling out the 2.0 version of their fine Javascript Framework and now that they have practically rewritten their entire API they have decided to 'relax' a bit and begin offering professional services and training".

It's great to see them branching out to the professional services as I generally see that as the only way to really make an open source project work in the long term. The training services is also a good idea for getting up to speed quickly I just hope they plan to offer online training (CBT style) as well. On-site training is all well and good but I think providing e-training subscription would be a definite boon to a lot of small development shops.

Keep up the great work!

Liferay to Standardize UI on jQuery

I read an interesting article on the jQuery Blog today about how the lead on the jQuery UI team, Paul Bakaus, has been hired by Liferay inc. to "bring Jquery UI to the next level"

Additionally Paul mentions that Liferay will be standardizing all their products to use jQuery. This tight integration of jQuery by Liferay is sure to catapult jQuery's popularity even more.

This is quite an interesting partnership and will undoubtedly have an impact on the company I work for as well as we have been flip/flopping between ExtJs and jQuery but since we plan on doing a lot more work with Liferay I imagine there will be more a lean towards jQuery.

EXT 2.0 Released

Today marks the official release of EXT JS v2.0. There have been some major improvements as well as additions to this release. A few of the impressive additions/changes include:


EXTJS 2.0 Alpha

For those of you who like the new Ajax tags of Colfusion 8 the framework, ExtJS, has released the Alpha version of their next major release.

This release is a rather large upgrade to the code base that Coldfusion uses and fully separates its reliance or dependence on other frameworks (yahoo ui toolkit for example).

The host of new features are too many to go into here so you can read about the major and exciting new features here. You can also read more about the general release news on their blog.

All I can say is that Jack Slocum and his crew do a fantastic job and I am continually impressed with the quality and level of their work. Add on top of that the three licensing options (open source, oem/reseller, and commercial) and you end up with a product that everyone can use.

An important thing to note is that this release while extensive has not significantly increased the size of the library. The whole library measures in at 522kb (thats everything you need) and it is possible to reduce that size rather significantly by importing only the library files that you need for a specific task. Though that being said the general practice is to include the ext-all.js file and be done with it.

Happy Coding...

CFGRID Cell Renderer Revisited

As I mentioned in my post on Monday via a post on Ray Camden's site creating customized cell renderers are possible, though not officially supported in CFGRID.

What that actually means is that CF doesn't provide a simple way of specifying a cell render for a grid column as shown in the hypothetical code snipet below:


EXT Ajax Grid Part 4

We continue where we left off in EXT Grid Part 3. I won't bother this time in having the entire script block again rather just focusing on the next part of interest.


EXT Ajax Grid Part 3

In this post we will begin to dissect the javascript code used to create the EXT Ajax Grid.

In Part 1 I simply introduced you to the Javascript in a complete example without really explaining any of the code.

I will do my best to break it down in to manageable chunks. Starting with setting up the Anonymous function and then going onto setting up of the data store.

Here is the complete Javascript block once again for reference:


Ext Tree adding a Context Menu

In the previous Ext Tree and Coldfusion Example post we set up an EXT treeview bound to a Coldfusion component.

In this example we will be building upon that example to add a dynamic context menu to our tree. The context menu will be populated by calling a function in a Coldfusion component.

Step 1

The first thing we need to do is include the below snippet of code in the head section of our page, but after the ext-all.js.


Ext Tree and Coldfusion Example

The EXT tree is, in my opinion, a much better implementation of a dynamic ajax tree than what the yahoo utility toolkit starts out with, and subsequently what Adobe decided to use for the CFTREE tag. Once again I am really amazed at the quality work that Jack and his crew have done. The tree itself is relatively simple to set up as either a static tree or dynamic tree. In the example code I will be showing I have set up the tree to have a lazy loader. This means that I will only be showing the root (and in this case the first set of children) of the tree and each time a node is clicked a call will be made to populate that nodes children.


EXT Ajax Grid Part 2

This is the second installment of building an Ajax grid using the EXT UI and Coldfusion.

In Part 1 we included the library files and set up the Javascript and HTML to render our Grid with paging.

In this entry we will set up an Ajax wrapper component and a component to populate our grid.

We need an Ajax wrapper component in this example because we are not using Coldfusion 8, the Ajax component will act as an intermediary component to instantiate our component and output the results. We could also use a standard cfm page but I prefer to use a component.


<cffunction name="getFiles" access="remote" output="yes">
    <cfargument name="start" default="1" required="yes"/>
    <cfargument name="limit" default="10" required="yes"/>
    <cfargument name="sort" default="" required="yes"/>
    <cfargument name="dir" default="" required="yes"/>
    <cfargument name="callback" default="" required="no"/>
<!--- the ext grid sends a 0 for the start by default, the startrow attribute on the cfoutput tag must be greater than 0 so we take care of that here before calling the component.--->        
        <cfif start eq 0>
            <cfset start = 1>
        <cfset obj = createobject("component","fileExplorer")/>
        <cfset retval = obj.getFilesExt(start,limit,sort,dir,"/dev/crucial")/>


EXT Ajax Grid Part 1

I recently posted an example on using one of the Coldfusion 8 Ajax CFGRID. I also mentioned at the time that it's based upon the GUI Library found at ExtJS.com. Well I thought it would be a good idea to also show an example on how to set up a grid using the library.

In Part one I will introduce you to the front end part, that is the javascript code to set up the grid, as well as what files you need to include in order to get it working. The next part we will go through the Javascript. And then in the final part I will show you how I set up the return data. Since I do not have Coldfusion 8 on my hosting provider we will build then entire thing using Coldfusion 6 or MX tags and functions.

So lets get started....

There are some necessary files you need to include at the top of the page that you want to have the grid on. The files are the base Yahoo utilities file, an yahoo to ext adapter and then the main ext library. Jack recently moved away from dependence on a third party base library and has created his own so in the future we won't need to have the yui-utilities included but the ext base library instead.

If you don't have the base library yet you can get it from the Extjs download area.

Put the code below into the html head of your page making sure to change the paths to where you have your resources.

<!-- these two library's must be included before any others -->
<script type="text/javascript" src="resources/javascript/yui-utilities.js"></script>
<script type="text/javascript" src="resources/javascript/ext-yui-adapter.js"></script>
<!-- the main ext library -->
<script type="text/javascript" src="resources/javascript/ext-all.js"></script>
<!-- this is the main styleshee, it is also broken down into separate stylesheets for each 'widget' -->
<link rel="stylesheet" type="text/css" href="resources/css/ext-all.css"/>

The next thing we will do is set up our grid. In the head area of your HTML document drop in the following:


EXT 2.0 FeedViewer 3

This week Jack Slocum over at www.extjs.com announced the new prototype demo application FeedViewer for the upcoming release of EXT 2.0.

EXT started out as an extension to Yahoo's UI Toolkit but has grown into it's own framework, when EXT 2.0 is finally released it will no longer be dependent on any framework for it's base but will have its own. This will mean that EXT will be able to co-exist with other frameworks, which of course gives more flexibility to the developer.

He has completely re-wrote the application into a more class oriented application

"FeedViewer 3 features it's code broken up into logical classes. This makes the code much more organized and easier to maintain."

You can take a look at the demo at: http://extjs.com/playpen/ext-2.0-dev/examples/feed-viewer/view.html

The code is indeed well organized and commented and I would encourage everyone to take a look.

Powered By Railo


Subscribe via RSS
Follow garyrgilbert on Twitter Follow me on Twitter
Or, Receive daily updates via email.


adobe air ajax apple cf community cfml coldfusion examples ext flash flex google javascript jquery max2007 max2008 misc open source programming railo software technology ui

Recent Entries

No recent entries.


An Architect's View
Rey Bango

Wish List

My Amazon.com Wish List