Verint | Telligent Community
Verint | Telligent Community
  • Site
  • User
  • Site
  • Search
  • User
Verint Community 12.x
  • Verint Community
Verint Community 12.x
API Documentation evolutionPager jQuery Plugin
  • User Documentation
  • Ask the Community
  • API Documentation
  • Manager Training
  • Developer Training
  • Tags
  • More
  • Cancel
  • New
  • API Documentation
  • +In-Process API Documentation
  • +Plugin API Documentation
  • +REST API Documentation
  • -Widget, Theme, and Automation APIs
    • +Automation Events
    • -Client-side APIs
      • +Client Messages
      • +Composer Plugins
      • +JavaScript API Modules
      • +jQuery Events
      • -jQuery Plugins
        • dynamicForm jQuery Plugin
        • evolutionBookmark jQuery Plugin
        • evolutionCodeEditor jQuery Plugin
        • evolutionComposer jQuery Plugin
        • evolutionFeature jQuery Plugin
        • evolutionHighlight jQuery Plugin
        • evolutionHtmlEditor jQuery Plugin
        • evolutionInlineTagEditor jQuery Plugin
        • evolutionLike jQuery Plugin
        • evolutionMasonry jQuery Plugin
        • evolutionModerate jQuery Plugin
        • evolutionPager jQuery Plugin
        • evolutionProgressIndicator jQuery Plugin
        • evolutionResize jQuery Plugin
        • evolutionScrollable jQuery Plugin
        • evolutionScrollSlider jQuery Plugin
        • evolutionSqueezeText jQuery Plugin
        • evolutionStarRating jQuery Plugin
        • evolutionTagTextBox jQuery Plugin
        • evolutionTextEditor jQuery Plugin
        • evolutionTheater jQuery Plugin
        • evolutionTip jQuery Plugin
        • evolutionToggleLink jQuery Plugin
        • evolutionTransform jQuery Plugin
        • evolutionUserFileTextBox jQuery Plugin
        • evolutionValidation jQuery Plugin
        • glowColorSelector jQuery Plugin
        • glowDateTimeSelector jQuery Plugin
        • glowDropDownList jQuery Plugin
        • glowLookUptextBox jQuery Plugin
        • glowModal jQuery Plugin
        • glowMultiUpload jQuery Plugin
        • glowOrderedList jQuery Plugin
        • glowPatternedTextBox jQuery Plugin
        • glowPopUpMenu jQuery Plugin
        • glowPopUpPanel jQuery Plugin
        • glowTabbedPanes jQuery Plugin
        • glowTabSet jQuery Plugin
        • glowTransition jQuery Plugin
        • glowTree jQuery Plugin
        • glowUpload jQuery Plugin
        • uilinks jQuery Plugin
      • +UI Components
    • +Dynamic Configuration
    • +LESS Functions
    • +Script API Types
    • +Script APIs

evolutionPager jQuery Plugin


jQuery.fn.evolutionPager

This plugin renders a paging UI, supporting both ajax and non-ajax based paging. It is typically not called directly, but rather by the page UI component, which is also not typically used directly, but rather by calls to the $core_v2_ui.Pager() Widget API method.

Usage

Initializes a pager where SELECTOR is a <span>.

$('SELECTOR').evolutionPager(options)

By default, this will render a set of paging links which navigate the browser.

If onPage and the other ajax-related options are provided, links will not navigate the browser, but publish paging event messages. The plugin will also subscribe to these same messages and use the supplied onPage function to request a new page of content to replace within the pagedContentContainer.

Options

  • currentPage: Current page index
    • default: 0
  • pageSize: Items per page
    • default: 10
  • totalItems: Total items
    • default: 0
  • showPrevious: (boolean) Whether 'previous' links should be shown
    • default: false
  • showNext: (boolean) Whether 'next' links should be shown
    • default: false
  • showFirst: (boolean) Whether 'first' links should be shown
    • default: true
  • showLast: (boolean) Whether 'last' links should be shown
    • default: true
  • showIndividualPages: Whether individual pages should be shown
    • default: true
  • numberOfPagesToDisplay: Number of individual pages to show
    • default: 5
  • pageKey: Name of the query string key to use to hold page index
    • default: 'pi'
  • hash: Explicit hash target for links
    • default: ''
  • baseUrl: Base URL
    • default: current URL (window.location.href)
  • template: template for rendering links

Ajax-Related Options

When provided, performs paging via usage of onPage (which will typically be defined to perform an ajax request) instead of navigation. Most of these are usually not necessary to define specifically, but are defined by usage of $core_v2_ui.Pager() where PagedContentFile or PagedContentUrl are passed.

  • onPage: function callback which is invoked to load a new page of content asynchronously. Passed parameters:
    • pageIndex: page index of content to load
    • complete: callback function to invoke when content is ready to be passed back to the plugin. Must be passed the content.
    • hash: object of other key/value pairs serialized in the current url's hash
  • pagedContentContainer: selector of element to update with newly received content
  • pagedContentPagingEvent: message to publish and subscribe to about a requested page change. Typically unique per widget and defined by $core_v2_ui.Pager().
  • pagedContentPagedEvent: message to publish and subscribe to about a requested page change. Typically unique per widget and defined by $core_v2_ui.Pager().
  • refreshOnAnyHashChange: when true, triggers an onPage for any change of the hash, not just the page key
    • default: false
  • transition: 'slide', 'fade', or 'null
    • default: null
  • transitionDuration: transition duration
    • default: 250

Default Template

<% foreach(links, function(link, i) { %>
    <% if(link.type === "first") { %>
        <a href="<%: link.url %>" class="first" data-type="first" data-page="<%= link.page %>" data-selected="false" title="<%= link.label %>">
            <span>&#171;</span>
        </a>
    <% } else if(link.type === "previous") { %>
        <a href="<%: link.url %>" class="previous" data-type="previous" data-page="<%= link.page %>" data-selected="false" title="<%= link.label %>">
            <span>&#60;</span>
        </a>
    <% } else if(link.type === "page") { %>
        <a href="<%: link.url %>" class="page<%= link.selected ? " selected" : "" %>" data-type="page" data-page="<%= link.page %>" data-selected="<%= link.selected ? "true" : "false" %>" title="<%= link.label %>">
            <span><%= link.page %></span>
        </a>
    <% } else if(link.type === "next") { %>
        <a href="<%: link.url %>" class="next" data-type="next" data-page="<%= link.page %>" data-selected="false" title="<%= link.label %>">
            <span>&#62;</span>
        </a>
    <% } else if(link.type === "last") { %>
        <a href="<%: link.url %>" class="last" data-type="last" data-page="<%= link.page %>" data-selected="false" title="<%= link.label %>">
            <span>&#187;</span>
        </a>
    <% } %>
    <% if(i < (links.length - 1)) { %>
        <span class="separator"></span>
    <% } %>
<% }); %>

  • Share
  • History
  • More
  • Cancel
Related
Recommended
  • Telligent
  • Professional Services
  • Submit a Support Ticket
  • Become a Partner
  • Request a Demo
  • Contact Us

About
Privacy Policy
Terms of use
Copyright 2024 Verint, Inc.
Powered by Verint Community