Data Table Pagination

hari.kishor · October 28, 2018, 10:30am

Hi,
How to apply Pagination in DataTable?

bharat_Suthar · October 28, 2018, 11:24am

try this , might help you out.

hari.kishor · October 28, 2018, 11:30am

@bharat_Suthar We want the pagination option which is in the frappe datatables.
We want to load no of records at once but want to show only 20 records on one page and on next page 20 and so on. Please help us out we have attached screenshot of requirement please go through it, we want the same through custom script.

bharat_Suthar · October 28, 2018, 11:42am

you can either do as they did in framework like this code -

github.com

frappe/frappe/blob/develop/frappe/public/js/frappe/ui/listing.html#L20


      
          	<div class="no-result text-center" style="display: none;">
          		{%= no_result_message %}
          	</div>
          	<div class="result">
          		<div class="list-headers"></div>
                  <div class="list-loading text-center">
                  	{%= frappe.messages.get_waiting_message(__("Loading") + "..." ) %}
                  </div>
          		<div class="result-list"></div>
          	</div>
          	<div class="list-paging-area">
          		<div class="row">
          			<div class="col-xs-6">
          				<div class="btn-group btn-group-paging">
          					<button type="button" class="btn btn-default btn-sm btn-info" data-value="20">20</button>
          					<button type="button" class="btn btn-default btn-sm" data-value="100">100</button>
          					<button type="button" class="btn btn-default btn-sm" data-value="500">500</button>
          				</div>
          			</div>
          			<div class="col-xs-6 text-right">
          				<button class="btn btn-default btn-more btn-sm">{%= _more %}...</button>

or you can use plugin -

tmatteson · October 28, 2018, 4:21pm

I would recommend instead of trying to paginate, to make a fixed-height container/frame and with a down carrat or arrow and then with an onclick expand that into a full page… we’re talking about an afternoon of DOM manipulation instead of fighting with a library that’s not designed to do what you’re asking.