Thursday, July 30, 2009

The Developers - Episode 12: PC Supremists

click on the thumbnail to view
The Developers - Episode 12: PC Supremists

PC or Mac - we have an opinion on that!

Thursday, July 23, 2009

The Developers - Episode 11: Running Late


click on the thumbnail to view
The Developers - Episode 11: Running Late

We've all been late - and sometimes you gotta take one for the team!

Thursday, July 16, 2009

The Developers - Episode 10: Discretion is Advised


click on the thumbnail to view
The Developers - Episode 10: Discretion is Advised

What is said in the office, stays in the office.


Friday, July 10, 2009

The Developers - Episode 9: Shage 2.0



click on the thumbnail to view
The Developers - Episode 9: SHA-GE 2.0

SHA-GE!!! Nuff said.

Thursday, July 9, 2009

Persistent Column Widths in Dojo (dojox) DataGrids

Hi everyone, my name is RV David and it's my first time posting on the "DevProducts on Blogger" blog. Hopefully the following will help some of the developers who are scouring the dojo forums/the internet for a solution to achieving persistent column or field widths in the Dojox DataGrid component of the Dojo toolkit.

The DojoX DataGrid Component
The Dojox DataGrid component is simply amazing! It provides a neat and relatively painless way to produce datagrids and is brilliant in the way it handles pagination. It does, however, come with it's limitations.

The RIA
We have recently developed a RIA (Rich Internet Application) for one of our clients which makes full use of the DataGrid component. At any time, we would have a variable number of datagrids displayed on a page in separate Tab Containers for presentation.

We have configured the datagrids so that field widths are adjustable by users. However, once the user either refereshes the page, or navigates to another page, the datagrid is displayed with the default column widths and the users will again have to adjust the field widths to their preference.

Remember DataGrid Column/Field Widths
A request was made for the functionality to "remember" the width of the datagrid columns even after a user navigates to a different part of the application.

The main issue we had is that we could not find a way to (easily) detect that the field width is being resized - there were no onresize event hooks for columns or cells - please correct me if I'm wrong.

The Solution/Workaround
After some reasearch and development, we have come up with the following solution (more like a workaround really) to store field or column widths:

Step 1: Store the Column widths in Cookies
We create a function to traverse through all datagrids and use a naming convention to store field widths in cookies.

function rememberWidths() {
var grids = dijit.registry.byClass('dojox.grid.DataGrid');
grids.forEach(function(grid) {
for (var k in grid.layout.cells) {
var index = grid.layout.cells[k].index;
var field = grid.layout.cells[k].field;
if (field != null && field != "") {
var cookieName = grid.id + field;
dojo.cookie(cookieName, grid.layout.cells[k].unitWidth, {expires:3600});
}
}
});
}

Step 2: Call the function on window.unload.
Add the function to the window object's "onUnload" event so that when the user leaves the page, all field widths are stored in cookies.

dojo.addOnUnload(window, 'rememberWidths');

Alternatively, we could have achieved the same result in one step:

dojo.addOnUnload(window, function() {
var grids = dijit.registry.byClass('dojox.grid.DataGrid');
grids.forEach(function(grid) {
for (var k in grid.layout.cells) {
var index = grid.layout.cells[k].index;
var field = grid.layout.cells[k].field;
if (field != null && field != "") {
var cookieName = grid.id + field;
dojo.cookie(cookieName, grid.layout.cells[k].unitWidth, {expires:3600});
//console.log(cookieName);
}
}
});

Step 3: At this stage, we should now have the widths stored as cookies and can be referenced by the concatenation of the grid id and the field name. For example, we have a "users" datagrid so to retrieve the column width of the id field in the "users" datagrid, we'd call it by using dojo.cookie('usersid');

That's pretty much the concept, although, I must stress that this is a workaround. I kind of feel strange about hooking into the window's onunload event, but hey, this is how we got around it. If you have better solutions, please, share it with us and leave a comment.

Thursday, July 2, 2009

The Developers Epsisode 8 : Tribute


click on the thumbnail to view
The Developers - Episode 8: Tribute

DevProducts homage to the King of Pop. Rest In Peace M.J!