27 June 2013 Thursday

DHTMLX-Controls in XPages

Over the past weeks I have been working on a large XPages Project that got me into using more advanced GUI Controls than those coming with Designer. The customer was already using DHTMLX Controls in other products so I decided to go with this framework with the XPages side of things as well.

The integration pattern was very straight foreward, I had Backend-Request-Scope Beans, JSON-RPC-Services and XAgents to implement a REST-API and JSON as the data transport format. The DHTMLX-Controls integrate very well into the XPages environment and allow easy-to-use CRUD operations on complex controls like this scheduler control here:

Image:DHTMLX-Controls in XPages

The control offers drag&drop operations, a customizable edit box, creation of new events and more. Everything is stored as JSON-data that is returned to the Domino Server to track changes and additions or deletions.

Take a look at a GANTT Chart representation here:

Image:DHTMLX-Controls in XPages

This representation is similar to the one above, actually, they use the same services and data.

The DHTMLX Suite offers a ton of controls and components as well as an excellent documentation. To create more Desktop like applications, I think it's worth to take a look. It is a commercial product but there's a GNU GPL licensed version as well to get started.

Happy coding !

Heiko.

Heiko Voigt   |   27 June 2013 09:51:56   |    Domino  XPages    |  
  |   Next Document   |   Previous Document

Discussion for this entry is now closed.

Comments (5)

ps       27.06.2013 18:11:09

Could you share some code on OpenNTF or perhaps post some instructions?

Pierre Koerber       27.09.2013 7:43:05

Hello Heiko,

I'm doing an integeration of the scheduler in an xpage. It works very well in the browsers but I've got some trouble in the notes client. The ajax request seems to fail.

Did you success to make your project work in the notes client ?

Thank you and best regards.

Fatih Duranoglu       20.04.2015 23:56:13

Hi Heiko

Really good sample i'm working on gantt please share code or sample nsf with me or openntf

Csaba Kiss       24.04.2015 2:08:56

I used to work with DHTMLX 2 years ago and I found the framework great to work with, the documentation was atrocious or at least disorganized, but the community was very helpful. I would have never imagined that XPages would integrate well with DHTMLX. I wonder if I could pick your brain about your workflow or since your post is almost 2 years old by now, how you are getting along with DHTMLX.

Csaba Kiss       24.04.2015 5:46:06

Hi Heiko!

I tried to use dhtmlx on an Xpages, but I stumbled across a problem that I can't seem to solve. Whenever I need to load data from an xml file, such as a toolbar like this : toolbar.loadStruct("codebase/data/toolbar.xml");

This creates an ajax call to the domino server. The call looks like this in the Console:

{ Link }

When Domino sees the "?". it throws a fit:

HTTP Web Server: Unknown Command Exception [/dhtm-test.nsf/codebase/data/toolbar.xml?dhxr1429846086943=1] CN=test cadmin/O=home

I get a 400 Bad Request error. How did you work around this problem?