Rows are not being updated after calling grid commit

[Sunny]

Hi,

I am having issue, that rows are not getting updated after calling the grid commit function.

See below code snippet, I had a debug point in the success function, and made sure there is an updated value being sent back in the response object. But I am not able to see the updated value in the grid. Can you please advice.


^{function saveChanges(addList,updateList,deleteList,rowIndxs){
   var grid = $('#stylesGrid').pqGrid('getInstance').grid;
   //var changes = grid.getChanges();
   //console.log(changes);
   if (addList.length || updateList.length || deleteList.length) {
      $.ajax({
         url: "/testPlanEdit.do",
         data : {
            list : JSON.stringify({
            updateList : updateList,
            addList : addList,
            deleteList : deleteList
         }),
         action :'modify'
         },
         dataType : "json",
         type : "POST",
         async : true,
         beforeSend : function(jqXHR, settings) {
            $(".saving").show();
         },
         success : function(changes) {
            grid.commit({
               type : 'add',
               rows : changes.addList
            });
            grid.commit({
               type : 'update',
               rows : changes.updateList
            });
            grid.commit({
               type : 'delete',
               rows : changes.deleteList
            });
            //refresh rows
            for(var j in rowIndxs){
                                        //grid.refreshRow({rowIndx:rowIndxs[j] });
               grid.refreshCell({rowIndx:rowIndxs[j],dataIndx: 'totalUnits' });
            }
         },
         complete : function() {   
            $(".saving").hide();
         }
      });
   }
}}

[paramvir]

Please check the values of rows (changes.addList, changes.updateList, ) passsed to commit method in success callback.

http://paramquery.com/pro/api#method-commit

Try to omit the rows parameter for troubleshooting.

[Sunny]

I did debug using firebug console, and see the updated values in the success callback. Also tried commit method omitting rows parameter, but no luck.

[paramvir]

Can you please share more details.

Are you able to see the red triangles at corner of cells ( indicator of cells marked dirty ) when you make the changes in grid. If not then you need to set trackModel: { on: true } and mention dataModel.recIndx ( primary key ).

commit is supposed to remove red triangles in cells. Do they not get removed even when you omit the rows parameter to commit method.

If you are still facing issues, please share a jsfiddle so that I can have a look. you can replace remote data with local data for jsfiddle.

http://jsfiddle.net/kw77c0sg/

[Sunny]

There is no problem with red triangles, they get disappered as soon as the commit method is called. I also have trackModel{on:true} and also recIndx is defined which is Primary Key in datamodel.

Do you have any sample demo to show, when user updates a field in UI, it will be saved in DB and when the row returns back from back end, it should contain other fields to updated, which should be refreshed in UI.

Same with Adding row as well, When I add a row by copying from existing one and made recIndx as null for the new row, after successful comit from backend,am not able to update the Primary Key for new row. It behaves weird, as two rows contains the same recIndx, which eventually results in PrimaryKey Violation in grid.

Thanks.

[paramvir]

Same with Adding row as well, When I add a row by copying from existing one and made recIndx as null for the new row, after successful comit from backend,am not able to update the Primary Key for new row. It behaves weird, as two rows contains the same recIndx, which eventually results in PrimaryKey Violation in grid.

Have you copied the 2nd row by reference. Try to make a deep copy.

var rowData2 = rowData1; //incorrect.

var rowData2 = $.extend( true, {}, rowData1 ); //correct.
rowData2[ dataModel.recIndx ] = null;

[Sunny]

Hi,

I tried to make a deep copy in the example of 'Auto Save' demo at http://paramquery.com/pro/demos24/editing_instant.

I replaced the 'New Product' button functionality with below code, and expecting to see the 'Product Id' which is the recIndx to be populated in the new row, but it doesn't. Can you please advice.


^{{ type: 'button', icon: 'ui-icon-plus', label: 'New Product', listener:
                        { "click": function (evt, ui) {
                             var rowData = $grid.pqGrid( "getRowData", {rowIndx:1} );
                     
                            var rowData2 = $.extend( true, {}, rowData );
                     rowData2['ProductID'] = null;
                            var rowIndx = $grid.pqGrid("addRow", { rowData: rowData2,checkEditable:false });
                            $grid.pqGrid("goToPage", { rowIndx: rowIndx });
                            $grid.pqGrid("setSelection", null);
                            $grid.pqGrid("setSelection", { rowIndx: rowIndx, dataIndx: 'ProductName' });
                            $grid.pqGrid("editFirstCellInRow", { rowIndx: rowIndx });
                        }
                        }
                    }}


Thanks.

[paramvir]

Thanks for sharing a good working example. rowData2['ProductID'] = null; is causing the issue here.

rowData2['ProductID'] = undefined; //works fine.

delete rowData2['ProductID']; //could also be used.

[Sunny]

Perfect! It worked, thank you.

[Sunny]

Hi Admin,

When we use 'Commit' method with type 'add', we update the primarykey(recIndx, which is generated at server side) and can be displayed in UI for that row. Is there a way, when we use 'Commit' method with type 'update', the row data in the grid should be updated with the data that comes back from server that matches the primary key ?

Looks like the commit method for update operation works for only data changes made on the client side. I have requirement,that when a cell status gets changed by user from 'A' to 'B', I have to populate the partial data for that row from the database into the grid. I did debug, and can see the changes are coming back from server are being passed in to the commit method ...

Thanks.

[paramvir]

commit() method works for only data changes made on the client side.

You could use updateRow method (with history and track paramters set to false) or directly manipulate rowData of matching rows to pass/update extra fields from the server into the rows.

The matching rows could be found with either iterating over the dataModel.data or with use of search() method.

[angelahlp]

could you give an example for the solution for this?