Easy Kanban Silos in XPages

Recently, I came across this post on the #dominoforever ideas forum:

My assumption when reading this is that the OP would like to have this capability in a web application since it’s in the XPages category.  Having done something similar in a previous project, I had some code I could dust off to create a quick demo to show how easily functionality like this can be implemented now in XPages.

The project had “silos” that allowed exactly for what the OP is asking for – drag from one column to another while updating the back end such that when the page is refreshed the “tiles” appear in the correct column.  Each tile represents one Notes document.  I took that, changed a few labels, and called it Kanban Silos:

Take a look at the working demo and drag and drop from one column to another.  Refresh the page and you’ll see the changes are reflected on disk.  (Note: If multiple people are accessing the demo at the same time the backend may not appear to be updating properly)

How does it work?

• Start with an XPage that contains the structure of the silos (includes Bootstrap and jQuery)
• Get data from a view via REST
  • In the ajax callback place the data in the appropriate column based on the status field
• Drag and drop tiles between columns
  • Once the drag is complete, call another rest service that updates the Notes document in the back end

That’s it!

The Code

If you are using source control in Domino Designer you can get the On Disk Project from GitHub.

Or, just go ahead and download the whole demo database.

Update 3/29

Initially, this was a quick demo  – silos.xsp contained hardcoded silos in raw html.  To make things more Xpage-y, I’ve modified the demo database so that silos.xsp now contains a repeat that looks up to a keyword.