Question #1: Is $(ui.element).data("row-idx") always equals to ui.owner._rowIndex?
Question #2: Is ui.owner._rowIndex the right index to get the corresponding row from the view?
I want to be sure I will always get the right Description and Name from the view:
$(document).delegate("#MyGrid", "iggridupdatingeditrowended", function (evt, ui) {
if ($(ui.owner.element).data("level") === 0) { // It's a Parent
var pRow = $('#MyGrid').data("igGrid").dataSource.dataView()[ui.owner._rowIndex];
// Show category's decription console.log(pRow.Description);
} else { // It's a Child
var pRow = $(ui.owner.element).parents("tr[data-container='true']").prev("tr");
// Get parent's index var pViewIdx = $(pRow).data("row-idx");
// Get children var cRows = $('#MyGrid').data("igGrid").dataSource.dataView()[pViewIdx].Products.Records;
// Show the name of the edited product console.log(cRows[ui.owner._rowIndex].Name); }});
Hello Luis,
The editRowEnded event exposes a property called rowID off of the ui event argument. It is recommended that you use this for accessing rows rather than the index and then pass that value to the grid's findRecordByKey method to get access to the record you want. In the case of hierarchical grid you're going to want to find the container grid widget for the record and then call findRecordByKey off of the widget. Fortunately, the ui also exposes the container grid in the form of ui.owner.grid. Using this, you can simplify the logic that you have to the following:
$('#MyGrid').on('iggridupdatingeditrowended', function (evt, ui) { var row = ui.owner.grid.findRecordByKey(ui.rowID); if (row.Description) { // Show category's description console.log(row.Description); } else if (row.Name) { // Show the name of the edited product console.log(row.ShipName); } });
Hello Jason, I have a new issue, this time related to iggridupdatingrowadded, in this case findRecordByKey returns null for a new child when the parent is new too. I have solved that using ui.values for every cell, it works even with hidden columns. May I trust this solution? Is there a better way?
$(document).delegate("#MyGrid", "iggridupdatingrowadded", function (evt, ui) {if (ui.owner.element.data("level") === 0) { // Parent console.log(ui.values["ParentId"]); } else { // Child. console.log(ui.values["ChildId"]); } });
A problem I have found with ui.values is that sometimes it does not contains all cells, I'm not sure why, looks like if you don't change a cell's value, then, that cell will not be part of ui.values, but I am not sure because when I compare ui.values to ui.oldValues, some cells have the same value even if I have not changed them. :( What's going on here?
OK Jason, thank you, now I understand why findRecordByKey is not good for that event. Thanks a lot!
You are correct about all of this. The way to handle hidden columns is to add a value manually to the values collection. As for not being able to use findRecordByKey, this method is used to find a record within the dataSource. At the time of rowAdding the record hasn't been committed yet and therefore cannot be found by that approach.
Ok, I solved this part of the mistery -still waiting for the answer about ui.values to access new child rows. By default, ui.values does not contains values for cells of new rows if they (the cells) are hidden, what we need to do is to set them. For example, if we have a cell called RowState that we don't want users to see it because it is for system use only, then we have to set its value in the iggridupdatingrowadding's event:
$(document).delegate("#Grid", "iggridupdatingrowadding", function (evt, ui) { ui.values["RowState"] = 0; });
Am I right Jason?