CODEWITHSUNDEEP
angularjsdatatable
vinothini
vinothini

Reputation: 2604

In angular datatable how to change show records per page options

In jquery data table I can change records per page option by

"aLengthMenu": [[50, 100, 150, 200, -1],
[50, 100, 150, 200, "All"]],

Anyone know how to achieve this in angular?

I tried

$scope.dtOptions = DTOptionsBuilder.newOptions().withOption('order', [1, 'asc']).withDisplayLength(250);

and

$scope.dtOptions = DTOptionsBuilder.newOptions().withOption('order', [1, 'asc']).withOption('LengthMenu', [[50, 100, 150, 200, -1], [50, 100, 150, 200, "All"]])

I want to show 50, 100, 150, 200

I searched at http://l-lin.github.io/angular-datatables/#/api but couldn't found

Upvotes: 7

Views: 13017

Answers (4)

sam ruben
sam ruben

Reputation: 385

$scope.dtOptions = DTOptionsBuilder.newOptions().withDisplayLength(10) 
// Default page size - 10,25,50,100

You can customize your list by using: 

$scope.dtOptions = DTOptionsBuilder.newOptions().withOption('lengthMenu', [10, 25, 50, 100])

Upvotes: 2

Ramith Nambiar
Ramith Nambiar

Reputation: 1

If you have multiple datatable in the project and wants to add LengthMenu as all you can add it in Run block 

app.run(['DTDefaultOptions',function(DTDefaultOptions) {
    DTDefaultOptions.setOption('lengthMenu',[[10, 20, 25, 50, -1],[10, 20, 25, 50, 'All']]);
}]);

If you want to add any option which are supported by Jquery Datatable you can use 

DTDefaultOptions.setOption(key, value);

Upvotes: 0

Ted Carbone
Ted Carbone

Reputation: 96

I found the answer!

So there is a variable you use in the datatable called $scope.dtOptions and there is a way to add on to that with .withOption('lengthMenu', [50, 100, 150, 200]);

Now, technically that changed the length options not the length, but in my case all I need is to set the lowest length option to the length I want, and I effectively changed the default length of the table.

Example:

$scope.dtOptions =   DTOptionsBuilder.newOptions()
    .withDOM('<"html5buttons"B>lTfgitp')
    .withButtons([])
    .withOption('order', [1, 'asc'])
    .withOption('lengthMenu', [50, 100, 150, 200]);

Upvotes: 6

Chris Mitchell
Chris Mitchell

Reputation: 904

You were close... use 'lengthMenu' option and only one array:

$scope.dtOptions = DTOptionsBuilder.newOptions().withOption('order', [1, 'asc']).withOption('lengthMenu', [50, 100, 150, 200])

Upvotes: 12

Related Questions