Skip to content
Related Articles

Related Articles

Blaze UI Pagination Methods

View Discussion
Improve Article
Save Article
  • Last Updated : 10 May, 2022
View Discussion
Improve Article
Save Article

Blaze UI is a framework-free open-source UI toolkit. It provides a great foundation for building scalable websites faster. Blaze UI comes with a lot of pre-styled components and many utilities so that developers don’t have to build everything from scratch. All of its components rely solely on native browser features so it can be used without any library or framework. In this article, we will be seeing Blaze UI Pagination Methods

The currentPage() method returns a Promise which resolves into a numeric value that refers to the index (starting from 1) of the currently selected page.

Syntax:

document.querySelector(".selector").currentPage();

Example 1: This example illustrates the use of the currentPage() method to get the index of the currently selected page.

HTML




<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible"
        content="IE=edge">
    <meta name="viewport" content=
        "width=device-width, initial-scale=1.0">
    <title>Pagination Methods - Blaze UI</title>
    <link rel="stylesheet" href=
     
    <!-- We need the Blaze UI Javascript because
        we are using a component which requires
        js to work -->
    <script type="module" src=
    </script>
     
    <style>
        body {
            font-family: sans-serif;
            text-align: center;
        }
    </style>
</head>
 
<body>
    <h2 style="color: green;">
        GeeksforGeeks
    </h2>
     
    <h3>Pagination Methods - currentPage() Method</h3>
 
    <div class="u-window-box-large">
        <blaze-pagination id="pagination1"
            pages="11" page="1">
        </blaze-pagination>
         
         
<p>Current Page Index: <span id="result"></span></p>
 
         
        <button class="c-button c-button--info"
            onclick="getCurrentPageNumber()">
            Get Current Page Number
        </button>
    </div>
 
    <script>
        function getCurrentPageNumber() {
            document.querySelector("#pagination1")
                .currentPage().then(function (currentPageIndex) {
                document.querySelector("#result")
                    .innerText = currentPageIndex;
            });
        }
    </script>
</body>
 
</html>


Output:

 

Reference: https://www.blazeui.com/components/pagination/


My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!