javascriptpagedjs

How to render only specific pages with Paged.js


I am using Paged.js to render an HTML coming from an HTTP request. My aim is to show only the first page of generated result rather than display all pages of the result generated by Pagedjs.

My initial guess is to use Chunker for this but not sure if it has the power to control pages in the output.


Solution

  • You can extend the Page.Hander and override the afterRendered hook, to hide all pages except the first one.

    <script>
    document.addEventListener("DOMContentLoaded", function () {
        class MyHandler extends Paged.Handler {
            afterRendered(pages) {
                pages.forEach((page, index) => {
                    if (index > 0) {
                        page.element.style.display = 'none';
                    }
                });
            }
        }
    
        Paged.registerHandlers(MyHandler);
        Paged.preview(document.querySelector(".print-content"));
    });
    </script>