Forums Ultimate UI for ASP.NET Web Forms
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
Close
IT Department
145
In JavaScript - Change cell value in Grid2 from GRID1_CellEditing_ExitedEditMode
posted

I have two grids. I need to do this client side in JavaScript. When a cell value of Grid1 is changed I need to find and change a cell value in Grid2. TI can't find an example of what I am trying to do. Thanks in advance for providing one.

Parents
No Data
Reply
  • 1700
    Offline posted

    Hello,

    In order to achieve this, you can use the EditingClientEvents CellValueChanged event. In it the value of the cell as well as the row index and column index could be obtained, which can be used to modifying the cell value of the other grid. Below I am pasting the markup as well as the JavaScript that demonstrates what I have explained above:

    HTML:

    <ig:WebScriptManager ID="WebScriptManager1" runat="server"></ig:WebScriptManager>
            <ig:WebDataGrid ID="WebDataGrid1" runat="server" Height="350px" Width="400px" DefaultColumnWidth="150px" DataKeyFields="id">
            <Behaviors>
                <ig:Activation>
                </ig:Activation>
                <ig:ColumnResizing>
                </ig:ColumnResizing>
                <ig:EditingCore>
                    <EditingClientEvents CellValueChanged="WebDataGrid1_Editing_CellValueChanged"/>
                    <Behaviors>
                        <ig:CellEditing>          
                        </ig:CellEditing>
                    </Behaviors>
                </ig:EditingCore>
                <ig:Selection>
                </ig:Selection>
            </Behaviors>
        </ig:WebDataGrid>
        <ig:WebDataGrid ID="WebDataGrid2" runat="server" Height="350px" Width="400px" DefaultColumnWidth="150px"  DataKeyFields="id">
        </ig:WebDataGrid>
     

    JavaScript:

     function WebDataGrid1_Editing_CellValueChanged(sender, eventArgs) {
            
            grid2 = $find("WebDataGrid2");           
            let currentCell = eventArgs.get_cell();
            let value = currentCell.get_value();
            let rowIndex = currentCell.get_row().get_index();
            let columnIndex = currentCell.get_column().get_index();

            grid2.get_rows().get_row(rowIndex).get_cell(columnIndex).set_value(value);

        }

    Please let me know if you have any questions.

    Regards,
    Ivan Kitanov

Children