Add element to grids pager

2 posts, 1 answers
  1. Matjaž
    Matjaž avatar
    80 posts
    Member since:
    Jul 2015

    Posted 05 Oct Link to this post

    How can I properly add element to grids pager? I want to add some additional label, buttons ...

    I tried with:

    this.grid.wrapper.find('.k-pager-wrap.k-grid-pager').prepend("<div>test</div>")

    and it works, but problem is, that every time setOptions is called, pager is destroyed and recreated. So I detach my div before calling setOptions and after that prepend it again:

    this.footer.detach();
    this.grid.setOptions(gridOptions);
    this.getKendoPagerWrapper().prepend(this.footer);

    but the problem is that also resize destroy pager (I have grid in PageControl in Window). When user resize/maximize/restore/minimize window grid.resize is called which destroy pager and all events, on custom element (this.footer) added to grids pager, are gone.

  2. Answer
    Rosen
    Admin
    Rosen avatar
    3234 posts

    Posted 07 Oct Link to this post

    Hello Matjaž,

    In order to achieve this you could use the dataBound event of the Grid widget, similar to the following:

     

    dataBound: function() {
      var pagerElement = this.pager.element;
      if (!pagerElement.find(".myCustomElement").length) {
        pagerElement
            .prepend('<div class="myCustomElement">test</div>');
      }
    }

     

    Regards,
    Rosen
    Telerik by Progress
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
  3. Kendo UI is VS 2017 Ready
Back to Top