CODEWITHSUNDEEP
angularjsdatatable
Ted Carbone
Ted Carbone

Reputation: 96

Datatables Angular JS set page length

How do I set the page length in an AngularJS Datatable? Right off the bat, people are going to want to say this ...

$('#example'String).dataTable( {

  "pageLength"String: 50

} );

This answer will not work for me because I am not defining my datatable like that. I am creating it like this with ng...

<table datatable="ng" id="orderTable" dt-options="dtOptions" class="table table-striped table-bordered" ng-init="initTableData()">

Then I am defining the <thead> and <tbody>, then within the <tbody> I am defining the <tr> with ng-repeat like so...

 <tr ng-repeat="order in orders track by $index">

So the table is getting created on the fly with AngularJS and HTML. With this design, how can I change the pageLength without having to switch to the previously mentioned pattern at the top of my question?

Upvotes: 1

Views: 3959

Answers (1)

user7888164
user7888164

Reputation: 49

The default length Menu is 25, 50, 100...

You can set the initial display length as below.

$scope.dtOptions = DTOptionsBuilder.newOptions().withPaginationType('full_numbers').withDisplayLength(25);

In case you want to define your own length Menu, do as below with initial display length of table as 5.

$scope.dtOptions = DTOptionsBuilder.newOptions().withPaginationType('full_numbers').withDisplayLength(5).withOption('lengthMenu', [[5, 10, 15, 20, 25,-1],[5,10,15,20,25,"All"]]);

From angular-datatables API info, it is evident under DTOptionsBuilder that withDisplayLength(iDisplayLength) is used to set the number of items per page to display where iDisplayLength is your preferred size.

Upvotes: 4

Related Questions