When using ServerSide I am not page

When using ServerSide I am not page

emmanuel921218emmanuel921218 Posts: 11Questions: 4Answers: 0

I want to use serverSide since I charge about 70K data and that proves that when making filters the screen is encouraged too much until it gets passed

`var genealogytable = $('#genealogy').DataTable({
destroy: true,
serverSide: true,
ajax:"reloadTab/?idsponsor=" + idsponsor + "&&period=" + period + "&&type=" + typee,

    columns: [ 
        {
            data: null,
            className: "center",
            defaultContent: '<a href="javascript:void(0)" onclick="addRowGen(this.parentNode.parentNode.id)">' + 
                '<img src="{{ asset('img/add2.png')}}" width="30px"/>' + 
            '</a>'
        },

        {
            'targets': 0,
            'searchable':false,
            'orderable':false,
            'className': 'dt-body-center',
            'render': function (data, type, row){
                return '<td> <p><label> <input type="checkbox" id="emailGenealog[]" name="email[]" class="check_mailGenealogy" onclick="mailRowGen(this.parentNode.parentNode.parentNode.parentNode.id)" name="" value="'+row.email+'" /><span></span></label></p> </td>';
            }
            //defaultContent: '<td> <p><label> <input type="checkbox" id="emailGenealog[]" name="email[]" class="check_mailGenealogy" onclick="mailRowGen(this.parentNode.parentNode.parentNode.parentNode.id)" name="" value="" /><span></span></label></p> </td>'
        },
        {data: 'Line'},
        {data: 'Level'},
        {data: 'associateid'},
        {data: 'associatename'},
        {data: 'Distributor_status' }
        {data: 'email'},
        {data: 'mobile_number'},
        {data: 'alternative_number'},
        {data: 'country'},
        {data: 'PinRank'},
        {data: 'PayRank'},
        {data: 'InactiveMonths'},
        {data: 'RenewalDate', type:"text"},
        {data: 'SignupDate', type:"date"},

    ],
    rowId: function(a) {
        return a.email +' '+ a.associateid;
    },
      "columnDefs": [
        { 
          "targets": 2,  
          className: "text-right line_number", 
        },
        { 
          className: "level text-right", 
          "targets": 3 
        },
        { 
          className: "associateid text-right", 
          "targets": 4 
        },
        { 
          className: "associatename text-left", 
          "targets": 5,
          "width": 80,
        },
        { 
          className: "distributor_status text-left", 
          "targets": 6 
        },
        { 
          className: "email text-left", 
          "targets": 7 
        },
        { 
          className: "mobile_number text-right", 
          "targets": 8,
          "width": "10%" 
        },
        { 
          className: "alternative_number text-right", 
          "targets": 9 
        },
        { 
          className: "country text-left", 
          "targets": 10 
        },
        { 
          className: "PinRank text-left", 
          "targets": 11 
        },
        { 
          className: "PayRank text-left", 
          "targets": 12 
        },
        { 
          className: "InactiveMonths text-right", 
          "targets": 13 
        },
        { 
          className: "RenewalDate text-right", 
          "targets": 14 
        },
        { 
          className: "SignupDate text-right", 
          "targets": 15 
        },
        { 
          className: "periodo1 text-right", 
          "targets": 16 
        },
        { 
          className: "periodo1 text-right", 
          "targets": 17 
        },
        { 
          className: "periodo1 text-right", 
          "targets": 18 
        },
        { 
          className: "periodo1 text-right", 
          "targets": 19 
        },
        { 
          className: "periodo1 text-right", 
          "targets": 20 
        },
        { 
          className: "periodo2 text-right", 
          "targets": 21 
        },
        { 
          className: "periodo2 text-right", 
          "targets": 22 
        },
        { 
          className: "periodo2 text-right", 
          "targets": 23 
        },
        { 
          className: "periodo2 text-right", 
          "targets": 24 
        },
        { 
          className: "periodo2 text-right", 
          "targets": 25 
        },
        { 
          className: "periodo3 text-right", 
          "targets": 26 
        },
        { 
          className: "periodo3 text-right", 
          "targets": 27 
        },
        { 
          className: "periodo3 text-right", 
          "targets": 28 
        },
        { 
          className: "text-right periodo3", 
          "targets": 29,
          "width": "25%"
        },
        { 
          className: "text-right periodo3", 
          "targets": 30,
          "width": "25%"
        },
      ],
    select: true,
    dom: 'Bfrtip',
    lengthMenu: [
        [ 10, 25, 50, 100 ],
        [ '10 rows', '25 rows', '50 rows', '100 rows' ]
    ],
    buttons: [
        'pageLength',
        {
          extend:    'excelHtml5',
          text:      'Excel',
          titleAttr: 'Excel',
          className: 'btn  waves-light'
        },
    ]
});`

Answers

  • colincolin Posts: 15,118Questions: 1Answers: 2,583

    What happens when the table loads? Is data being returned? If there's an issue, it's normally because the server isn't responding correctly to the client. The protocol is discussed here. Also see examples here.

    Cheers,

    Colin

  • emmanuel921218emmanuel921218 Posts: 11Questions: 4Answers: 0

    @colin
    I really paint all the data, don't create the page

This discussion has been closed.