find next Cell in DataGrid with frozen column

hello, syncfusion Teams.


 When the cellSave function event works , I want to find the information of the next Cell the Row and change the "bgColor".


At this time, QueryCellInfo cannot be used because it does not have changed information.

I tried to use the code as below, but I can't find the following by Frozen Column.

Let me know if you have any solution.


thanks


function treeCellSave(args) {
                   var test = true;
                    var argCell = args.cell;
                    while (test) {
                        argCell.bgColor = "";
                        if (argCell.nextSibling == null) {
                            break;
                        }


                        argCell = argCell.nextSibling;


                    }
}



3 Replies

RR Rajapandi Ravi Syncfusion Team March 1, 2022 11:03 AM UTC

Hi Taewook, 

Greetings from Syncfusion support 

We have analyzed your query and we could see that you like to use get the next cell element in cellSave event and facing the problem with frozenColumn. To achieve your requirement, we suggest you use the below way. Please refer the below code example and sample for more information. 

 
cellSave: function(args) { //cellSave event of Grid 
                var rowIndex = +args.cell.getAttribute('index'); //rowIndex 
                var cell = args.cell.nextElementSibling; 
                if (cell === null && (args.column.index < gridInstance.columns.length - 1)) { 
                    cell = gridInstance.getMovableRows()[rowIndex].cells[0]; //get the movable cell 
                } 
            } 
 

Screenshot:  

 

Regards, 
Rajapandi R 



TK TaeWook Kang replied to Rajapandi Ravi March 7, 2022 12:51 PM UTC

Hi,  Rajapandi Ravi.


Thanks for the reply.

As a result of testing, it was confirmed that it was used without any problem.


However, one problem occurred.

There is no problem when editing in the existing Row. 

but, when adding a new Row, when the cellSave function works, 'argCell = Grid.getMovableRows()[rowIndex]' becomes undefined.


Can you solve this problem when it is added?


argCell = argCell.nextSibling;
if (argCell === null && (argsCol < Grid.columns.length - 1)) {
       argCell = Grid.getMovableRows()[rowIndex];
       argCell = argCell.cells[0]; //get the movable cell
}





RR Rajapandi Ravi Syncfusion Team March 8, 2022 01:36 PM UTC

Hi TaeWook, 

Thanks for the update 

In our previous update, we suggest you use getMovableRows() method to get the next cell from cellSave event. In your query, while adding a record you are facing the undefined because the getMovableRows() method returns the rows from the content. So, we suggest you use the getMovableDataRows() method, it will return your adding rows and you can get next cell to achieve your requirement. Please refer the below code example and sample for more information. 


<script> 
    function cellsave(args) { 
        var gridInstance = this; 
        var rowIndex = +args.cell.getAttribute('index'); //rowIndex  
        var cell = args.cell.nextElementSibling; 
        if (cell === null && (args.column.index < gridInstance.columns.length - 1)) { 
            cell = gridInstance.getMovableDataRows()[rowIndex].cells[0]; //get the movable cell  
        }  
    } 
</script> 





Screenshot: 

 

Regards, 
Rajapandi R 



Loader.
Up arrow icon