Grid is not enough !!! Javascript Grids for your reports …

Hi,

Working with Jedox and saying Grid is not enough is little sarcastic… There cells all over the places !!!

Well I thought to bring out this topic for a simple reason that though in the product such as Jedox there are enough grid to keep one busy, but by the nature of them they are still little limited to certain features which the power of widgets combined with JavaScript multiple mature grid components can spark life in your applications.

Limitations by not using Widgets/JS Grid Combo:

1. If you tend to use a vertical dyna-range (Jedox), it dynamically expands the whole set of rows across all columns (like insert row functionality) though good enough but from a ease of use design perspective it severely limits the report/app design, as many of the times when working with dyna-ranges with only small number of columns such as 2~5  we would had to leave the rest of the columns unused as when the report is rendered any content on the same will be pushed down as the dyna-range will insert set of rows to represent the table.

CropperCapture[11]

As you can see in the image above, the coloured area next to dyna-range is wasted real estate on the UI as we are unable to put any functionlaity as button or report

2. Advanced features such as paged report, which I have posted in my last articles is hard to get in practice as so many aspects of paging has to be taken care of when designing it manually, some thing off the self is more ease and robust to put in working.

3. Rich UI, Jedox in itself is a well designed product but at some places you need search functionality, richer UI and more features as business gets demanding.

And the list continues as you browse through the new flashy grid controls offered by the JavaScript technology.

Solution

So in order to over come the above limitations, I have built a  sample report showcasing the usage of popular JavaScript Grids as follows:

1. Data Table

http://datatables.net/

CropperCapture[12]

2. Handson JS Grid

http://handsontable.com/

CropperCapture[13]

3. ExtJS Grid

http://dev.sencha.com/extjs/5.0.0/examples/index.html

CropperCapture[14]

In all the above tables the data is sourced from Macro (except ExtJS, in which its local but can be easily amended to any source).

In the above file the widgets are driven by custom HTML code files to which the widget refers to and sends the data array to be displayed on the grid. Thus now you can more effectively use the UI area for user functionality and build comprehensive applications with good means of reporting as well.

This above method can greatly help you to develop richer UI’s and leverage more power of Jedox as BI portal.

Hope this trick helps !!!

Downloads:

http://amolpandey.com/home/downloads/blog24_download.zip

Leave a Reply

Your email address will not be published. Required fields are marked *

*