search

swimlane / ngx-datatable

✨ A feature-rich yet lightweight data-table crafted for Angular
http://swimlane.github.io/ngx-datatable/
MIT License
4.63k stars 1.68k forks source link

do I need to add any external css for Pagination to Show? #1362

Open siva563 opened 6 years ago

siva563 commented 6 years ago 
   <ngx-datatable style="padding:2%;" class="bootstrap" [rows]="rows" [columnMode]="'force'" [headerHeight]="50" [rowHeight]="'auto'"
      [limit]="20" [selectionType]="'checkbox'" [selectAllRowsOnPage]="false" (select)='onSelect($event)' [externalPaging]="false"
      [count]="page.totalElements" [offset]="page.pageNumber" [limit]="page.size" (page)='setPage($event)'>
      <ngx-datatable-column [width]="30" [sortable]="true" [canAutoResize]="false" [draggable]="false" [resizeable]="false" [headerCheckboxable]="true"
        [checkboxable]="true">
      </ngx-datatable-column>
      <ngx-datatable-column name="FirstName"></ngx-datatable-column>
      <ngx-datatable-column name="LastName"></ngx-datatable-column>
      <ngx-datatable-column name="Gender"></ngx-datatable-column>
      <ngx-datatable-column name="MobileNo"></ngx-datatable-column>
      <ngx-datatable-column name="City"></ngx-datatable-column>
      <ngx-datatable-column name="Picode"></ngx-datatable-column>
      <ngx-datatable-column name="Status"></ngx-datatable-column>
      <ngx-datatable-column name="CreatedBy"></ngx-datatable-column>
      <ngx-datatable-column name="Process"></ngx-datatable-column>
    </ngx-datatable>

This is my code I am using, But I am not able to see the Pagination below on table, could you please some one help me, need add any external css files to show the pagination.

Thanks in advance !!!!

mak2xt commented 6 years ago

You have to add [footerHeight]="height" to ngx-datatable tag

onsightit commented 6 years ago

I have footerHeight="50" and the numbers show but do not have any styling. I've tried Material and Bootstrap.

ashokthrymr commented 5 years ago

[externalPaging]="false" change it to [externalPaging]="true"

cjfigueiras commented 5 years ago

@siva563 maybe you need include in angular.json styles needed for it:

"node_modules/@swimlane/ngx-datatable/release/index.css", "node_modules/@swimlane/ngx-datatable/release/themes/material.css", "src/assets/fonts/data-table/icons.css"

CyberZen53 commented 4 years ago

I am having the same or similar issue. I only see "1 2 3" for my pager but no icons. #issuecomment-481803417 did not resolve for me. Also not seeing sort icons even though sorting is working.