Highlighting the edit row when selected

[Zachary]

When I click on a row to edit the cursor is behind the text and I have to highlight and delete the text rather than type.

How can I have the entire text highlighted when I initiate an edit action

[Farveen Sulthana Thameeztheen Basha]

Hi Zachary, 

Greetings from Syncfusion Support. 

Query#:- How can I have the entire text highlighted when I initiate an edit action 

 

We have achieved your requirement using actionBegin event of the TreeGrid. In this event we have get the corresponding Input element and highlight the entire text using select method while editing when requestType as beginEdit. 

 

Refer to the code below:- 

App.Component.html:- 

 

<ejs-treegrid [dataSource] = 'data' height = '400' childMapping = 'subtasks'[treeColumnIndex] = '1' 

        [editSettings] = 'editSettings'[toolbar] = 'toolbar'(actionBegin) = "actionBegin($event)" > 

        <e-columns> 

            <e-column field='taskID' headerText='Task ID' width='70' textAlign='Right' isPrimaryKey='true' 

                [validationRules]='taskidrules'></e-column> 

           .     .   . 

 

</ejs-treegrid > 

 

App.Component.ts 

 

export class AppComponent { 

            public data: Object[] = []; 

 

             

            actionBegin(args) { 

                if ((args.requestType = 'beginEdit')) { 

                    setTimeout(() => { 

                        var element = args.cell.querySelector('input');  //get the Input element 

                        if (!isNullOrUndefined(element)) { 

                            element.select();  //highlight using select method 

 

                        }   

                    }, 10); 

                } 

            } 

Sample Link:- https://stackblitz.com/edit/angular-aty6fo?file=app.component.ts 

API link:- https://ej2.syncfusion.com/angular/documentation/api/treegrid/#actionbegin 

 

Please get back to us if you need any further assistance. 

Regards, 

Farveen sulthana T 

[Zachary]

It works. Thank you!

[Farveen Sulthana Thameeztheen Basha]

Hi Zachary,   

 

Thanks for your update. Please get back to us if you need any further assistance. We are happy to assist you.  

 

Regards,  

Farveen sulthana T