According to http://ko.infragistics.com/samples/aspnet/hierarchical-data-grid/batch-updating, a save button that just does a post back is supposed to fire off the row add/update/delete server side events. However, when I do this that does not seem to happen. The events are not fired unless I press enter after editing a cell in the new row. I've attached an example site with a WHDG that illustrates the problem. Why is it that enter key press can cause a post back that will fire off the server events but pressing a save button will not? Is there some special setting that enables this?
Thanks
Hello bartsipes,
Thank you for posting in our community.
I tested your sample, however it works properly on my side. I tried to edit one cell and then press the button, and RowUpdating event fired properly. Also RowAdding and RowsDeleting events fire as expected. I didn't change anything in your sample. Could you please explain me in details how exactly are you testing these events whether they fire properly?
Looking forward to your response.
Sincerely,
Tsanna
Hi Tsanna, I tried again and you are correct the RowUpdating event is being fired properly. However, I'm not able to get RowAdding to fire.
For the child add my steps are:
For the parent add my steps are:
Hello bartstripes,
RowAdding server side event is going to be triggered either when Enter key is pressed or Tab key is pressed to the last cell in the row. This is the moment when after entering data to Add New Row it loses focus. Only then this row is inserted in WebHierarchicalDataGrid and its underlying data source.
Some further reference about Row Adding feature could be found at:
http://help.infragistics.com/doc/ASPNET/2014.1/CLR4.0/?page=WebHierarchicalDataGrid_Enabling_Row_Adding.html
I tested your sample and the RowAdding event is correctly triggered when the enter key is pressed or when the last cell from the row is tabbed.
I hope you find this information helpful.
Please let me know if you need any further assistance with this matter.
Hi Vasya, thanks for the info. That doesn't quite do what I need as I want to permit edits and adds and not have them committed until the user presses the save button. So I tried turning on BatchUpdating but the server side row adding event still does not fire. Shouldn't row adds be batched along with row updates? The documentation says "Determines whether CRUD operations batch on the client or immediately go back to the server." so the create operation should be included as part of the batch.
I've attached my sample website with batch updating turned on that does not fire row adding.
When BatchUpdating feature of the Editing behavior is enabled all the changes, such as row adding, exist only on the client side and they are not persisted to the server until a postback is executed. In this scenario in order to get a row added on the client side you will have to either press enter key or tab the last cell in the row. This functionality will allow you to add unlimited number of rows before changes are persisted to the server by clicking your button, that will cause the postback. Additionally, you have unlimited undo capability(all changes can be reverted before a postback is fired). Once a postback occurs(your button is clicked) RowAdding event is fired once for every row that you already added on the client side.
Some further reference about BatchUpdating feature could be found at:
http://help.infragistics.com/doc/ASPNET/2014.1/CLR4.0/?page=WebHierarchicalDataGrid_Batch_Updating_Overview.html
Regarding your sample, I enabled the BatchUpdating feature :
<ig:EditingCore AutoCRUD="True" BatchUpdating="true">
I am adding 2 rows in the grid. Once I fill all the cells for the first row I press enter and I add one more row, again I press enter in order to add this row on the client side. Afterwards, I am causing a postback with the button. Once the button is clicked RowAdding event is fired twice - once for every row. Everything is working as expected on my side.
I have attached the modified sample for your reference.
Please let me know if you have any additional questions regarding this matter.
Hi Vasya, thanks for the sample. I've run it and I still have the issue of RowAdding not being fired. The reason for this is that I don't press tab or enter after filling in the last cell in the new row. For me and many of my users, we are going to naturally stop using keys and switch to the mouse to press the submit button. But unless tab or enter has been pressed the grid will not fire the RowAdding event. This is very frustrating. How can I adjust the behavior of the grid to fire the row adding event or (or mark the row for adding in the case of batch updating) when cell focus is lost like when they go to press the submit button? Is there a client side API that I can call?
After looking further into your requirement what I can suggest is handling RowAdding`s ExitedEitMode client side event, In this event it could be checked whether the cell that is exiting edit mode is the last cell in row. If this is true from the sender of the event a reference to the new row could be retrieved. Afterwards, in order to add the new row I am looping trough the new row`s cells and I am pushing them in an array which afterwards is added to the rows collection. For example:
function WebHierarchicalDataGrid1_RowAdding_ExitedEditMode(sender, eventArgs) { var cellIndex = eventArgs.getCell().get_index(); var cellsCount = sender.get_rows().get_row(0).get_cellCount(); //check if this is the last cell from the row if (cellIndex == cellsCount - 1) { var rowToBeAdded = []; var row = sender.get_behaviors().get_editingCore().get_behaviors().get_rowAdding().get_row(); for (var i = 0; i < row.get_cellCount() ; i++) { rowToBeAdded.push(row.get_cell(i).get_value()); row.get_cell(i).set_text(""); } sender.get_rows().add(rowToBeAdded); } }// -->
function WebHierarchicalDataGrid1_RowAdding_ExitedEditMode(sender, eventArgs)
{
var cellIndex = eventArgs.getCell().get_index();
var cellsCount = sender.get_rows().get_row(0).get_cellCount();
//check if this is the last cell from the row
if (cellIndex == cellsCount - 1) {
var rowToBeAdded = [];
var row = sender.get_behaviors().get_editingCore().get_behaviors().get_rowAdding().get_row();
for (var i = 0; i < row.get_cellCount() ; i++) {
rowToBeAdded.push(row.get_cell(i).get_value());
row.get_cell(i).set_text("");
}
sender.get_rows().add(rowToBeAdded);
}// -->
Please note that if you need to perform any validation before committing the row (for example whether all the cells on grid have values) this sgould be preformen here before adding the row.
I am attaching your modified sample for your reference.