Topic: How to remove "Rows per page" and dropdown from Datatables?
Using table version of Datatables, how can I remove the "Rows per page" and dropdown from the pagination? .. also how can I change the font size of the rest of the pagination?
I do not find any documentation on this.
<div class="datatable pagination-sm" data-mdb-entries="5" data-mdb-sm="true" data-mdb-full-pagination="false" data-mdb-hover="true" data-mdb-pagination="true" data-mdb-maxHeight="500">
<table style="max-width: 500px; max-height: 500px;">
<thead>
<tr>
<th class="th-sm" data-mdb-sort="true" data-mdb-fixed="true" data-mdb-width="100">Aktiv dato</th>
<th class="th-sm" data-mdb-sort="false" data-mdb-fixed="true" data-mdb-width="350">Note</th>
<th class="th-sm" data-mdb-sort="false" data-mdb-fixed="true" data-mdb-width="50">Aktiv</th>
</tr>
</thead>
<tbody>
<tr>
<td>16-11-2021</td>
<td>Some text</td>
<td>
<button type="button" class="btn btn-primary btn-floating btn-sm">
<i class="fas fa-download"></i>
</button>
</td>
</tr>
</tbody>
</table>
</div>
Unfortunately, there is no option to disable only certain pagination elements. You can easily hide them using css:
.datatable-select-wrapper {
display: none;
}
To change the part size you also need to use css too:
.datatable-pagination-nav {
font-size: 2rem;
}
Stig Kølbæk pro premium priority commented 3 years ago
Great @Grzegorz Bujański that fixed my issue :-) .. while I have you, is it possible to style the pagination like in the example here https://mdbootstrap.com/docs/standard/navigation/pagination/ under "Disabled and active states"
Grzegorz Bujański staff commented 3 years ago
Unfortunately not. This would require changes directly in the component. But I will add this to our idea board, and maybe one day we will add the ability to use such pagination.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: Yes
- Technology: MDB Standard
- MDB Version: MDB5 3.10.0
- Device: Firefly
- Browser: Chrome
- OS: Win 11
- Provided sample code: No
- Provided link: No