Focus the cell when editing

[Costa]

Hi. When you double-click a cell in a grid, the current row goes into edit mode. In this case, the focus passes to the first cell on the left. This behavior is completely unnatural, and also requires additional mouse clicks to select the desired cell. I propose and ask you to correct this behavior and transfer focus to the cell in which the click was made. This applies, in all likelihood, not only to ASP.NET Core but also to grids on other technologies.

Thanks!

[Sathyanarayanamoorthy Eswararao]

Hi Costa, 

Thanks for contacting Syncfusion support. 

According to your query you need to focus the cell which is double clicked while editing. We have achieved your requirement in the below code example using the actionComplete event and recordDoubleClick event of grid. 

Refer the below code example. 

 

<ej-grid id="FlatGrid" allow-paging="true" allow-filtering="true" action-complete="actionComplete" record-double-click="doubleClick"> 

     

                          ……. 

 

   <e-edit-settings allow-adding="true" allow-editing="true" allow-deleting="true"></e-edit-settings> 

    <e-columns> 

                    ….. 

        </e-column> 

    </e-columns> 

</ej-grid> 

 

<script> 

    function doubleClick(args) { 

        this.model.columnName = this.getColumnByIndex(args.cellIndex).field; 

    } 

    function actionComplete(args) { 

        if (args.requestType == "beginedit") { 

            var elem = $("#FlatGrid" + this.model.columnName); 

            if (elem.hasClass("e-dropdownlist")) 

                elem.closest(".e-ddl").focus(); 

            else if (elem.hasClass("e-numerictextbox")) 

                elem.siblings('input:visible').first().select().focus(); 

            else 

                elem.focus().select(); 

        } 

    } 

</script> 

In the RecordDoubleClick, we can get the column name using cell index. Based on the  column name, you can focus the element that you have clicked in the ActionComplete event. Here, this.model.columnName is implicit variable and we are adding it manually.  

 

We have prepared a sample for your convenience which can be downloaded from below location. 

 

Sample: http://www.syncfusion.com/downloads/support/forum/137308/ze/Editing-1399890374.zip

Refer to the following Help Document. 

 

https://help.syncfusion.com/api/js/ejgrid#events:actioncomplete  

 

https://help.syncfusion.com/api/js/ejgrid#events:recorddoubleclick  

 

Regards, 

Sathyanarayanamoorthy