Save Selected Content

[Aron Ko]

Hi. Do you have for RichTextEditor events such as @onselect? I would like to activate a button after selecting text in the editor. And also, if possible, save the selected text to a variable when Rich Text Editor is focused out. 

Thanks.

<SfRichTextEditor>
   <RichTextEditorEvents Blur="@BlurHandler"><RichTextEditorEvents>
</SfRichTextEditor>
@code{

    public async Task BlurHandler(BlurEventArgs args)
    {
        var selectedText = await RteObj.GetSelectionAsync()
    }
}

[Vinitha Jeyakumar]

Hi Aron Ko,

Your requirement to have an event trigger when we select a text in the RichTextEditor can be achieved by using the selectionchange event listener with JsInterop on Created event like below,

Code snippet:

Index.razor

 

div class="control-section">
    <SfRichTextEditor ID="defaultRTE" ShowCharCount="true" Height="500px" @bind-Value="Val">
       
        <RichTextEditorEvents Created="Created"></RichTextEditorEvents> 
        <RichTextEditorToolbarSettings Items="@Tools" />
    </SfRichTextEditor>
</div>


@code {
    public string Val { get; set; } = "Editor";
    public async void Created()
    {
        await jsRuntime.InvokeAsync<object>("accessDOMElement"); 
    }

Host.cshtml

 

function accessDOMElement() {
   
    document.addEventListener('selectionchange', function (evt) {
        
        if (evt.currentTarget.activeElement == defaultRTE) {
        // here you can add your code.
            
        }
    });
  
}

Regards,

Vinitha