Text selected on enter text box

Hello

Is it possible to get a SfTextBox to select all the text in the text box when it gets the focus.  I can make this happen on an SfAutoComplete as shown below (field=Task):



But on the text box the following happens (the cursor is placed at the end with no text selected):



Thanks



3 Replies 1 reply marked as answer

JC Joseph Christ Nithin Issack Syncfusion Team April 12, 2021 01:30 PM UTC

Hello Ditchford, 

    Greetings from Syncfusion support. 

    We have checked your query. When the ‘Multiline’ property is set to true the SfTextBox acts as a TextArea. By default when a TextArea gets focused the cursor is placed at the end of the text, instead of selecting the entire text. However, you can still select the text in the SfTextBox, when it gets focused by using the javascript method ’Select’ of the input object in the focus event of the SfTextBox. This can be achieved by using JsInterop. Please refer the below code snippet. 

Razor file: 

<div> 
   <div> 
        <SfTextBox @ref="textObj" ID="multiline" Multiline="true" CssClass="e-outline" Placeholder="Outlined" FloatLabelType="@FloatLabelType.Always" Focus="textFocus"></SfTextBox> 
    </div> 
</div> 
 
@code{ 
    [Inject] 
    protected IJSRuntime JsRuntime { get; set; } 
    SfTextBox textObj; 
 
    public async Task textFocus(FocusInEventArgs args) 
    { 
        await JsRuntime.InvokeVoidAsync("onTextFocus"); 
    } 
} 


 

JS File: 

 
window.onTextFocus = () => { 
    document.getElementById("multiline").select(); 
 
} 

 




Please find the attached sample and revert for more queries. 

Regards, 
Joseph Christ Nithin I. 


Marked as answer

DI Ditchford April 12, 2021 04:35 PM UTC

Hey

Ah, yes of course...thank you.


JC Joseph Christ Nithin Issack Syncfusion Team April 13, 2021 05:10 AM UTC

Hello Ditchford, 

  We are glad to hear that your issue has been resolved. Please let us know if you need any further assistance on this. 

Regards, 
Joseph Christ Nithin I. 


Loader.
Up arrow icon