Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Webhierarchicaldatagrid - changes cell on change another cell in the same row


I am working in a Webhierarchicaldatagrid and I need to change a cell after change another cell in  the same row. Below is a screenshot to clarify what I mean. I need to change a cell in the Amount column then the cell in the Total cost should be auto calculated and below the grid there is the sub total should be calculated to.

I tried to do this through RowUpdated event as shown below, but the issue is that the event is not fired after change any editable cell in the Webhierarchicaldatagrid, below is my code to create the RowUpdated event for my Webhierarchicaldatagrid  which is named (UG1).

And finally, below is the Webhierarchicaldatagrid in the aspx file.

Knowing that my application in a webforms application using visual basic as backend and the infragistics version is "Infragistics45.Web.v22.1, Version=22.1.20221.11".

  • 1360
    Offline posted

    Hello Hossam,

    This could be achieved by handling the CellValueChanged event on the client side, the cell could be checked if it is from the Amount column and after that the needed changes could be done with the following code:


    function CellValueChanged(sender, eventArgs)
                    var currentCell = eventArgs.get_cell(); 
                    var rowIndex = currentCell.get_row().get_index();                
                    var grid = $find("WebHierarchicalDataGrid1");
                    if (currentCell.get_column().get_key() == "UnitPrice") {
                        // I assume the indexes are matching the one in the screenshot provided in the post 
                        //calculate total based on amount and rate
                        var total = currentCell.get_value() * grid.get_gridView().get_rows().get_row(rowIndex).get_cell(4).get_value();
                        //set the valuue of the total column
                        // calculate the sub total and populate the sub total field
                        //if you need to iterate the rows collection you can get its lenght with the following line:
                        document.getElementById("SubTotalTextBox1").value = total;

    If you need some more information regarding the Client-Side Object Model you can review all the properties, methods and events of the WebHierarchicalDataGrid here:

    Please let me know if you have any questions.

    Ivan Kitanov

Reply Children
No Data