Monday, July 22, 2013

Creating an Updatable REST Service for use in a Dojo Data Grid

In my latest project, I am using a REST Service to pull data for use in a Dojo Data Grid.  I am using Brad Balassaitis's excellent blog series as a guide.   One issue that I came across was that I wanted to allow the users to edit values in columns and have them saved to the back end data.   

After much searching I found a link to XPages Extension Library book which says on page 178 that the xe:viewJsonService is read only, and that to perform edits or deletes, you must use the xe:viewItemFileService.  I already had the viewJsonService working, so before replacing it, I created a second REST service using viewItemService.  I copied all the columns and properties from one to the other, and the new one would give an "Internal Error 500".
This is the error you get when using the 'pathInfo' to view the service in your browser 
UPDATE:  It is not true that you must use the viewItemFileService.  You can use the viewJsonFileService to perform updates.   The error was caused because the PUT method was not allowed on the server.  In hindsight, I would not recommend using the viewItemFileService at all.

I did a lot of searching and could not find much on the subject until I came across this Stack Overflow where the asker was having the same issue as me.  Buried in the comments, Knut Herrmann answered the question.  On a related note, I really bugs me when Stack Overflow questioners abandon their question after they get their issue fixed.  This asker never responded to Knut if it worked, so that he could update his answer.

The fix, thanks to Knut, is that you use the 'keys' property instead of the 'categoryFilter', both are properties of the service.  I moved my code unedited from the categoryFilter to the keys and it worked with no errors.

It is OK that your view is categorized.   At first I thought this was the issue, because it began working after I removed the category.   The reason it worked was that the REST service ignored the Category Filter since there was not category.  I have since put the view category back and it still works perfectly.


To Sum up:

  • You must use viewItemFileService for backend Updates and Deletes
  • Don't use this:  <xe:this.categoryFilter><![CDATA[#{javascript:return myBean.getThisUNID();}]]></xe:this.categoryFilter>  Causes error 500
  • Use this: keys="#{javascript:return myBean.getThisUNID();  Works!

UPDATE:

This doesn't work as perfectly as I thought.   The REST service returns a different JSON format that causes blank rows in the data grid.   

These blank rows shouldn't be there
This is the REST service data
If anyone knows how to either modify the rest service or datagrid to suppress the blank rows, please comment!

March 2015 UPDATE:
Here is what I did to fix the issue with the blank rows.  I had to take a different approach. Please see this Stack Overflow question: http://stackoverflow.com/questions/29153238/how-to-configure-an-xeviewfileitemservice-on-an-xpage-to-filter-the-data-in-a-c/29182174#29182174

1 comment:

  1. I use this code in onstyleRow event of the grid to solve the blank rows issue which using viewJsonService:
    var row = arguments[0];
    var rowItem = djxDataGrid1.getItem(row.index);
    var rowCount = Object.keys(restService1._index).length - 1; //-1 for omit the onUpdate event
    if(row.index >= rowCount){
    row.customStyles += 'display:none;';
    }

    ReplyDelete