Pulling Data Piece by Piece in a Data Table. | Help

Pulling Data Piece by Piece in a Data Table. | Help

TurksEmperorTurksEmperor Posts: 6Questions: 2Answers: 0

Hello, I have a lot of data in my table. For this reason, there is a lot of waiting while the page is loading. my table displays 10 rows on the first page.
I have a request like this;
When the page is first opened, it only needs to display the first 10 lines. can we load the second page only when we click the next button?
Is it possible to do this?

My English is not very good. I'm sorry for that.
The codes I use in the table are as follows.

 $(function () {
        // Setup - add a text input to each footer cell
        $('#example5 tfoot th').each(function () {
            var title = "Arama Yap"/* $(this).text();*/
            $(this).html('<input type="text" placeholder="' + title + '" />');
        });

        // DataTable
        var table = $('#example5').DataTable({

            dom: 'Bfrtip',
            lengthMenu: [
                [10, 25, 50, 100, 500, 1000, -1],
                ['10 Satır Göster', '25 Satır Göster', '50 Satır Göster', '100 Satır Göster', '500 Satır Göster', '1000 Satır Göster', 'Hepsini Göster']
            ],
            buttons: ['pageLength'],
            "buttons": [{
                text: 'Yeni Personel Ekle',
                className: 'btn-info',
                action: function (e, dt, node, config) {
                    alert('Personel Eklemek İçin Personel Tablosunun Yukarısında Bulunan Açılabilen Alana Dokunun.');
                    /*location.href = "/PersonelList/Create";*/

                }
            },
            {
                extend: 'colvis',
                text: '<i">Sütun Aç/Kapa</i>',
                className: 'btn-warning',

            },
            {

                extend: 'pageLength',
                text: '<i">Satır Göster</i>',
                className: 'btn-warning',

            },
            {
                extend: 'copyHtml5',
                text: '<i">Kopyala</i>',
                className: 'btn-success',
                exportOptions: {
                    columns: [0, ':visible']
                }
            },
            {
                extend: 'excelHtml5',
                className: 'btn-success',
                exportOptions: {
                    columns: ':visible'
                }
            },

            {
                extend: 'pdfHtml5',
                className: 'btn-success',
                exportOptions: {
                    columns: [0, 1, 2, 3, 4, 5, 6]
                }
            },
            {
                extend: 'print',
                message: 'Tozlu.com',
                className: 'btn-danger',
                exportOptions:
                {
                    columns: [0, 1, 2, 3, 4, 5, 6]
                }

            }

            ],
            select: true,
            fixedHeader: true
        });

        // Apply the search
        table.columns().every(function () {
            var that = this;

            $('input', this.footer()).on('change', function () {
                if (that.search() !== this.value) {
                    that
                        .search(this.value)
                        .draw();
                }
            });
        });
    });

Replies

  • colincolin Posts: 12,621Questions: 0Answers: 2,156

    This section of the FAQ should help, it discusses various techniques to improve performance. deferRender, or serverSide should help you out,

    Cheers,

    Colin

  • TurksEmperorTurksEmperor Posts: 6Questions: 2Answers: 0

    Your guidance got me the result I was looking for.
    Thank you very much for your interest.
    :smile:

Sign In or Register to comment.