ColdFusion RIA

I hadn't looked at the Ext JS library in a while, but this weekend, I took a look at it with the idea of eventually building out a full CRUD grid using Ext JS and ColdFusion. It took some time, particularly trying to figure out the phantom records implementation, but its done now.

View the Demo

And as always, time to look at the code.

[More]

It has been a while since I made my last blog post as work has kept me very busy. Over the weekend I saw that a new jqGrid version had been released and that it contained in-built advanced searching (called multiple search). I also thought it was a good time to revisit my earlier blog post on a full CRUD grid and update it to 3.6 specifications.

This implementation uses the following jqGrid features:

1. Inbuilt Form based Add, Edit, Delete and Search functionality
2. Search is done using new Multiple Search feature
3. Exploration of a few additional colModel parameters

View the Demo : this is all realtime, any updates made will be reflected in the grid.
Now, lets look at the code

[More]

I downloaded the jQuery UI library a few weeks back (should have done it earlier too). I started playing around with it, but work has been so busy did not get much time to look at it. Finally, found some time to do a basic tabs, accordians, sliders, progress bar demo. Its very basic, good start to learing how some of the things work.

View Demo

The progress bar demo is probably the most complex one, so code for it follows.

[More]

jqGrid 3.5 was released yesterday. It includes lots of good features, including a new rendering engine for faster loading. It also now supports jQuery UI ThemeRoller themes, so to start off itself you have access to variety of styles and can create your own easily too.

So I went ahead and created a demo that shows the grid in all these themes.
View Demo

How I did this style selection switch, follows

[More]

Just a quick post about how to go about adding custom buttons to the cfgrid's paging toolbar. I believe this has changed from Ext 1.1 (which ColdFusion 8 implements) to Ext 3.0 (which ColdFusion 9 implements).

You can see the normal cfgrid here. It comes with no buttons, and it as such with a grid implementation it would suit us if we could show add/edit/delete buttons.

So, you can get your pretty icons and add some nice buttons to the grid allowing users to perform operations. I have one up with an add button.

Code follows

[More]

One of the exciting new feature in ColdFusion 9 is its ORM implementation. ORM in simplest terms allows us to access the database using objects, or in in even more simpler terms you don't have to write any queries for simple CRUD functions. To learn more about ColdFusion 9 ORM visit Adobe's ColdFusion 9 ORM Docs and Introducing ORM in ColdFusion 9 Beta.

This post will look at implementing a cfgrid using ORM. This will be first in a series starting from just implementing the grid to read data ending with a full fledged CRUD cfgrid with ORM.

[More]

If you look at Ext JS examples for 3.0 release you will notice a lot of (New) stuff. The 3.0 release includes a bunch of new plugins to the normal Ext grid framework. A couple of these plugins deal with rendering a different type of paging bar.

Note: The demos/samples for ColdFusion 9 will be a bit slow to load due to them being hosted on a cheap VPS server (the best I could do).

Out of the box, the normal ColdFusion 9 cfgrid has the standard Ext JS paging bar. A demo of the ColdFusion 9 cfgrid can be viewed here: Demo unavailable.

We will now replace the standard paging bar with a Sliding Pager and a Progress Bar Pager in this blog post.

[More]

With the release of ExtJS 3.0 and the ColdFusion 9 beta I have been digging into the library more. One of the libraries for the grids that ExtJS Core offers is Numbering the grid rows on the current page. ColdFusion doesn't have that option, so I decided to implement it. It was quite simple actually.

Note: This was all done on ColdFusion 9 beta and Ext JS 3.0. ColdFusion 8 ships with ExtJS 1.1 and I am not sure whether the RowNumberer class was present in version 1.1 or not. Also, since we don't have a ColdFusion 9 beta host (or if there is one I haven't found it), you will have to do with screenshots.

So, here is how the grid looks (and this thing looks a lot better than the ColdFusion 8 grid)

[More]

With the recent release of ExtJS 3.0, I have been looking at the library again. I decided to do a simple Grid implementation using ExtJS. ExtJS is probably one of the best looking JS libraries out there out of the box and when implemented its extremely quick. The main issue as has been when integrading jQuery with ColdFusion was passing the JSON back in the proper format for the grid.

Have a look at the Demo First Here.

[More]

So, previously I blogged about basic jqGrid implementations with Filter/Search and Inline Edit capabilities. The grid here now builds on all that, and implements Add and Delete functionality. I also changed the theme to the new steel theme (available in version 3.4 zip), its much more professional looking compared to the others in my opinion.

This implementation doesn't exactly follow the previous posts. For this grid I am using:

1. Inbuilt Form based Add, Edit and Delete functionality
2. Custom Built Search Dialog Screen
3. Custom Refresh Action
4. Use jqModal for the custom search dialog.

See The Demo. DB being changed realtime, any operations you perform will happen.

[More]