Syncfusion AI Assistant

How can I help you?

Capture the current page number in ASP.NET Core PDF Viewer

28 Feb 20262 minutes to read

Retrieve the page number of the currently displayed page using the currentPageNumber property. This is useful for tracking navigation or implementing custom page navigation logic.

Follow these steps to capture the current page number on demand.

Step 1: Follow the Getting Started with ASP.NET Core PDF Viewer guide to set up a basic PDF Viewer sample with required script and style references.

Step 2: Add a button and script to retrieve and display the current page number. Place the following code in the Razor view after the PDF Viewer component:

<button onclick="currentPage()">Get Current Page</button>

<div style="width:100%;height:600px">
    <ejs-pdfviewer
        id="pdfviewer"
        documentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf">
    </ejs-pdfviewer>
</div>

<script>
    function currentPage() {
        var viewer = document.getElementById('pdfviewer').ej2_instances[0];
        var pageNumber = viewer.currentPageNumber;
        alert('Current page number is ' + pageNumber);
    }
</script>
<button onclick="currentPage()">Get Current Page</button>

<div style="width:100%;height:600px">
    <ejs-pdfviewer
        id="pdfviewer"
        documentPath="https://cdn.syncfusion.com/content/pdf/pdf-succinctly.pdf"
        serviceUrl="/Index">
    </ejs-pdfviewer>
</div>

<script>
    function currentPage() {
        var viewer = document.getElementById('pdfviewer').ej2_instances[0];
        var pageNumber = viewer.currentPageNumber;
        alert('Current page number is ' + pageNumber);
    }
</script>

The script retrieves the PDF Viewer instance and accesses the currentPageNumber property to display the current page in an alert dialog when the button is clicked.

View sample on GitHub