Enable or Disable Text Selection in Syncfusion PDF Viewer

The Syncfusion PDF Viewer provides the EnableTextSelection property, which allows you to control whether users can select text within the displayed PDF document. This feature can be toggled programmatically during runtime.

Configure Text Selection on Initialization

You can set the initial text selection behavior when initializing the PDF Viewer control by configuring the EnableTextSelection property. By default, text selection is enabled, but you can disable it as shown in the following example:

@using Syncfusion.EJ2
@{
    ViewBag.Title = "Home Page";
}

<div>
    <div style="height:500px;width:100%;">
        @Html.EJS().PdfViewer("pdfviewer")
            .DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf")
            .ResourceUrl("https://cdn.syncfusion.com/ej2/30.1.37/dist/ej2-pdfviewer-lib")
            .EnableTextSelection(false)
            .Render()
    </div>
</div>

Toggle Text Selection Dynamically

You can change the text selection behavior at runtime using buttons, menu options, or other UI elements. The following example demonstrates how to toggle text selection with button clicks:

@using Syncfusion.EJ2
@{
    ViewBag.Title = "Home Page";
}

<div>
    <div style="height:500px;width:100%;">
        <button onclick="enableTextSelection()">EnableTextSelection</button>
        <button onclick="disableTextSelection()">DisableTextSelection</button>
        @Html.EJS().PdfViewer("pdfviewer")
            .DocumentPath("https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf")
            .ResourceUrl("https://cdn.syncfusion.com/ej2/30.1.37/dist/ej2-pdfviewer-lib")
            .EnableTextSelection(false)
            .Render()
    </div>
</div>

<script type="text/javascript">
    function enableTextSelection() {
        var viewer = document.getElementById('pdfviewer').ej2_instances[0];
        viewer.enableTextSelection = true;
    }

    function disableTextSelection() {
        var viewer = document.getElementById('pdfviewer').ej2_instances[0];
        viewer.enableTextSelection = false;
    }
</script>

Use Cases and Considerations

  • Document Protection: Disabling text selection helps prevent unauthorized copying of sensitive content.
  • Read-only Documents: In scenarios where documents are meant for viewing only, disabling text selection can provide a cleaner user experience.
  • Interactive Applications: Toggle text selection based on user roles or document states in complex applications.
  • Controlled Access: Implement conditional text selection depending on user permissions or document sections.

Default Behavior

By default, text selection is enabled in the PDF Viewer. Set the EnableTextSelection property to false explicitly if you want to disable this functionality.

NOTE

When text selection is disabled, users will not be able to select or copy text from the document, which can be useful for protecting document content in certain scenarios.

View sample in GitHub