Editable Grid using ui-grid

Following from ~~#54~~, I am building an example of being able to edit the row in the ui-grid.

The approach is this:

ui-grid has a plug-in rowEdit, that lets you edit the row details, and will track when you want to save ( usually, just a timer from your last keystroke) When it wants to save , it invokes a callback getSavePromise(rowEntity) . You return a promise in response to this, which will go off and save the record.

the rowEdit plug in uses the state of this promise to manage the UI to indicate whether the record is clean, being saved, saved, failed... etc

Now, when you read a collection with restangular, it decorates each object in that collection (it "restangularizes" them) with additional methods that correspond to standard REST formulations. In particular, you get a post() method, that POSTs the object itself to the rest Url api/<object type>/id

e.g. api/schools/KPS002

This method returns a promise.

So - if the restanulgarized data is displayed in the UI grid; then the getSavePromise callback just needs to look like this:

function getSavePromise(row) {
 return row.post();
}

Then the saving needs to be implemented on the server...

Comments (1)