Pagination
TEST CASES
- Flexibility to set the page limit that ishow many pages can be displayed on the screen at once using showPageCnt variable. Here the page limit is set as 5.
- Option to visit the specific page number by adding it in the given input box and either clicking Enter or the Go To button handling the case if entered page number exceeds the total number of pages.
- Implemented previous and next arrow functionality along with the necessary checks(which occurs when the page number is either 1st or last).
- Initialization and Configuration: The script starts by initializing variables like pageNo, selected_entry, counter, totalPages, showPageCnt, and perPageEntries, totalPages defines the total number of pages, and showPageCnt is the maximum number of visible page numbers in the pagination section.
- NavigatePage Function:This function is called when the user manually enters a page number and presses Enter. It validates the input, checks if the entered page number is within bounds, and updates the pagination accordingly.
- handleNumberResiriction Function:This function restricts the input to numeric values and handles the Enter key press to trigger the NavigatePage function.
- updatePage Function:This function updates the page and selected entry, highlights the active page, and triggers any necessary actions like API calls.
- updatePageMainSection Function:This function generates the HTML for the main pagination section, creating clickable page number elements.
- highlightSelectedPage Function:This function highlights the currently selected page.
- leftNavigationHandler and rightNavigationHandler Functions:These functions handle the left and right arrow navigation respectively. They update the counter, recalculate the first and last page indices, and update the pagination display accordingly.
- applyPagination Function:This function generates the pagination UI elements based on the configuration. It handles cases where the total number of pages is less than or greater than showPageCnt.
- Document Ready Event:The $(document).ready event ensures that the pagination is applied when the page loads.