PDA

View Full Version : Inline Editable grid integration with Srping via JSON



wojaczek
1 Dec 2015, 4:01 AM
Hi there,
I'm working on integration between inline editable grid with REST services based on Spring 4.
Everything works quite well but Dates.
Here is the description of solution I used:
1) I'm using JavaScriptObjects to pack/parse data while communicating with server side.
2) JavaScriptObject are also used in column model
3) JSO class has 3 String fields and one date (and ID, obiously)
4) Application logic assumes, that once user clicks "new item" button empty row is added to the table and POST request is sent to server to obtain new ID for the row. This part works well.
5) After I have new row inserted into table every editCompleted event generates new PUT request to resource pointed by ID. After successfull PUT I refresh the model and display values that are in DB, just to be in-sync
6) Problems appear when I have not-null value in Date field. Editing snd sending value to the Spring works well but I had to introduce one hack to serve dates generated by JSONObject(JSO).toString(). It treats Date type value as a JSON object so the Date field looks like: dateField : {jsdate: long_value}. But i'm able to read and store the value in DB.
I'm responsing in the same way.
JSO object got from JSON looks ok.
While GXT is filling the grid model, exception is thrown:
Uncaught com.google.gwt.event.shared.UmbrellaException: Exception caught: undefined(anonymous function) @ Impl.java:108
This exception is thrown only when date field is not null.
So here goes the code used:
JSO contains two methods for serving date field:


public final native Date getVisaExpiredDate() /*-{ return this["visaExpiredDate"]; }-*/;
public final native void setVisaExpiredDate(Date visaExpiredDate) /*-{ this["visaExpiredDate"] = visaExpiredDate; }-*/;

Value provider is as follows:


ValueProvider<EmployeeJSO, Date> visaExpiredDate();

Column config is:


ColumnConfig<EmployeeJSO, Date> visaExpiredDateColumn =
new ColumnConfig<EmployeeJSO, Date>(properties.visaExpiredDate(), 220, "VisaExpDate");
visaExpiredDateColumn.setCell(new DateCell(DateTimeFormat.getFormat("MM/dd/yyyy")));

Editable grid is configured as follows:


DateTimeFormat dateFormat = DateTimeFormat.getFormat("MM/dd/yyyy");
DateField visaExpEditor = new DateField(new DateTimePropertyEditor(dateFormat));
visaExpEditor.setClearValueOnParseError(false);
editableGrid.addEditor(visaExpiredDateColumn, visaExpEditor);

Sending to server:


JSONObject objectToSend = new JSONObject(employeeJSO);
builder.sendRequest(new JSONObject(employeeJSO).toString(), new RequestCallback() {..});

loading is done like that:


List<EmployeeJSO> list = new ArrayList<EmployeeJSO>();
JSONArray array = JSONParser.parseLenient(response.getText()).isArray();
for (int i = 0; i<array.size(); i++){
EmployeeJSO obj = array.get(i).isObject().getJavaScriptObject().cast();
list.add(obj);
}
store.clear();
store.addAll(list);

JSON that goes to the server (it's corrclty parsed, Spring creates all needed objects


{"id":20, "firstName":"test", "lastName":null, "companyName":null, "visaExpiredDate":{"jsdate":1450911600000}}

JSON that retrieves all objects from the server:


[{"id":20,"firstName":"test","lastName":null,"companyName":null,"visaExpiredDate":{"jsdate":1450911600000}}]


Does anyone have an idea what I did wrong?
GWT version:


<dependency>
<groupId>com.google.gwt</groupId>
<artifactId>gwt-user</artifactId>
<version>2.6.1</version>
</dependency>

GXT version:


<dependency>
<groupId>com.sencha.gxt</groupId>
<artifactId>gxt</artifactId>
<version>3.1.1</version>
</dependency>