Skip to content
This repository was archived by the owner on Feb 2, 2025. It is now read-only.
This repository was archived by the owner on Feb 2, 2025. It is now read-only.

Bootstrap + Scroller issues #189

Closed
Closed
@DunkiesTier

Description

@DunkiesTier

It appears when you are using both .withBootstrap() and .withScroller(), the scroller-type pagination does not work properly. Instead of loading the data is you scroll, the dataTable instead only shows the number of records you've selected in "Show x Entries".

html:

<div class="container">
    <div data-ng-controller="DataTableAjax as table">
        <table data-datatable="" data-dt-options="table.dtOptions" data-dt-columns="table.dtColumns" class="row-border table-striped hover"></table>
    </div>
</div>

javascript:

            var app = angular.module("test", ['datatables', 'ui.bootstrap']).controller('DataTableAjax', DataTableAjax).controller("PositionControl", PositionControl);

            function DataTableAjax(DTOptionsBuilder, DTColumnBuilder) {
                var vm = this;
                vm.dtOptions = DTOptionsBuilder
                        .fromSource('test.json')
                        .withScroller()
                        .withOption('deferRender', true)
                        .withOption('scrollY', 600)
                        .withOption('responsive', true)
                        .withBootstrap()
                        ;
                console.log(vm.dtOptions);

                vm.dtColumns = [
                    DTColumnBuilder.newColumn('id').withTitle('ID'),
                    DTColumnBuilder.newColumn('firstName').withTitle('First name'),
                    DTColumnBuilder.newColumn('lastName').withTitle('Last name')
                ];
            }

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions