How to disable saveRow event ui-grid

Question

I am using ui-grid to display my table in UI. I have a requirement where I don't want table to auto-save the data. I want user to edit all data in a table and click a button to update all the edited data.

Above behavioud is working fine but only problem what I am getting is whenever a user edits a cell in a row, after few seconds, that cell becomes grey and uneditable. On browser cnsole I am getting this error:

A promise was not returned when saveRow event was raised, either nobody is listening to event, or event handler did not return a promise

Because of above JS error, whole row becomes un-editable. How to tell ui-grid to don't save the data unless I click my button.

If I handle saveRow event then my button is not working. Please help me in this regard.

Here are the snippets of relevant codes:

    var grid = {
                    data : 'hwData['+key+']',
                    paginationPageSizes: [25, 50, 75],
                    paginationPageSize: 25,
                    enableGridMenu: true,
                    enableFiltering: true,
                    enableSelectAll: true,
                    enableColumnResize : true,
                    exporterCsvFilename: 'myFile.csv',
                    exporterMenuPdf: false,
                    exporterCsvLinkElement: angular.element(document.querySelectorAll(".custom-csv-link-location")),

                    onRegisterApi: function(gridApi){
                          $scope.gridApi.push(gridApi);
                          gridApi.edit.on.afterCellEdit($scope,function(rowEntity, colDef, newValue, oldValue){
                              if(oldValue  == newValue){
                                    return false;
                              }


                                $("#test").prepend('<font color= "red"> ' +colDef.name+ 'Edited  ');


                           })
                          },

..............some more code
..............
$.ajax({
                                        type:'POST',
                                        url:'/HardwareInventory/ajax/storage/edit_owned_storage',
                                        data: jsonHostNames,
                                        dataType:"json",
                                        contentType: "application/json; charset=utf-8",
                                        success : function(result){
                                            if(result.status == "Success"){

                                                location.reload(true);
                                            }else{
                                                bootbox.alert("Either hostname is not correct or you don't have permission to edit this team's data");


                                            }
                                        },
                                        statusCode: {
                                            500: function(){
                                                alert("Oops!, there has been an internal error");
                                            }
                                        },
                                        complete: function(result){
                                        }
                                    });
                                }
                            });

Answer 1

Set "rowEditWaitInterval :-1" in your grid options and it will never call saveRow method by default , so you can save modified data in your custom method. And you can access dirtyrows like this

var dirtyRows = $scope.gridApi.rowEdit.getDirtyRows($scope.gridApi.grid);

Answer 2

@Jha : Have a look on below url where I have just added fake save method, which will not save any data until you will define your save function inside it. http://plnkr.co/edit/T0TLGLpLsk25vY6SUnzR?p=preview

// Save each row data

gridApi.rowEdit.on.saveRow($scope, $scope.saveRow);
$scope.saveRow = function (rowEntity) {
        var promise = $q.defer();
        $scope.gridApi.rowEdit.setSavePromise(rowEntity, promise.promise);
        promise.resolve();
    };

The above code will resolve your error"A promise was not returned when saveRow event was raised, either nobody is listening to event, or event handler did not return a promise". Do not forget to add "$q" in controller function. I hope your save function will also work properly.