Problem with Pagenation and the Showing line

Andreas S. · August 2016

I have a Problem with the Pagenation and the Showing Text. The Table has only 3 Entries and the Pagenation show me " Previous 1 2 3 4 5 ... next" - Buttons. The 3 entries are shown in the tables. I can selected and editing the entries. On the left line in the Pagenation Line are following text: Showing 0 to 0 of 0 entries (filtered from NaN total entries)1 row selected. I use the last Version of Datatables, editor, Buttons, Select with bootstrap support. The Datatables debugger: http://debug.datatables.net/egoqed

Thanks for Helps

Andreas

my JS code is this:

$(document).ready(function(){
    $('<div class="loading">Loading</div>').appendTo('body');

    editor = new $.fn.dataTable.Editor({
    ajax: 'assets/lib/ev_server_processing.php',
        table: '#athletelist',
        fields: [{
            label: 'First name:',
      name: 'firstname'
        },{
            label: 'Last name:',
      name: 'lastname'
        },{
            label: 'Name Prefix:',
            name: 'nameprefix'
    },{
            label: 'Birthday:',
            name: 'birthday',
            type: 'datetime'
    },{
      label: 'Nationality:',
             name: 'nation',
             type: 'select'
    },{
            label: 'Reg ID:',
            name: 'regid'
    }]
  });

    var table = $('#athletelist').DataTable({
        initComplete: function(settings, json){
            $('div.loading').remove();
            table.buttons().container().appendTo($('#athletelist_wrapper .col-sm-6:eq(0)'));
    },
      lengthChange: false,
        processing: true,
      serverSide: true,
      ajax: 'assets/lib/ev_server_processing.php',
      autoWidth: false,
      columns: [
        { data: null, render: function(data, type, row){
            if(!data.nameprefix){
                name = data.lastname+', '+data.firstname;
            }else{
                name = data.nameprefix+' '+data.lastname+', '+data.firstname;
            }
            return name;
        }, width: '20%' },
        {   data: 'birthday'},
        { data: null, render: function(data, type, row){
            age = getAge(data.birthday, '');
            return age.years;
        }},
        { data: 'nation'},
        { data: 'regid'},
        { data: 'id'},
        { data: null, defaultContent: '', orderable: false},
        { data: null, defaultContent: '', orderable: false}
    ],
    select: true,
    buttons: [
            { extend: 'create', editor: editor },
        { extend: 'edit', editor: editor },
        { extend: 'remove', editor: editor },
            {   extend: 'collection', text: 'Export',
                    buttons: [
                    {   extend: 'copyHtml5', ClassName: 'btn btn-sm btn-default', text: '<i class="fa fa-files-o"></i>', titleAttr: 'Copy'},
                    {   extend: 'excelHtml5', ClassName: 'btn btn-sm btn-default', text: '<i class="fa fa-file-excel-o"></i>', titleAttr: 'Excel'},
                    {   extend: 'csvHtml5', ClassName: 'btn btn-sm btn-default', text: '<i class="fa fa-file-text-o"></i>', titleAttr: 'CSV'},
                    {   extend: 'pdfHtml5', ClassName: 'btn btn-sm btn-default', text: '<i class="fa fa-file-pdf-o"></i>', titleAttr: 'PDF'},
                    { extend: 'colvis', ClassName: 'btn btn-sm btn-default', text: '<i class="fa fa-list-ul"></i>', titleAttr: 'Column visibility'}
                ]
        }
    ]
  });

});

server side Code:

if((include PLUGIN_DIR.'DTables/Editor/1.5.6/php/DataTables.php') == FALSE){ echo 'Failed include Edit'; }

use
  DataTables\Editor,
  DataTables\Editor\Field,
  DataTables\Editor\Format,
  DataTables\Editor\Mjoin,
  DataTables\Editor\Upload,
  DataTables\Editor\Validate;

Editor::inst( $db, 'entries_test' )
    ->fields(
            Field::inst( 'id' ),
            Field::inst( 'firstname' )->validator( 'Validate::notEmpty' ),
            Field::inst( 'lastname' )->validator( 'Validate::notEmpty' ),
        Field::inst( 'nameprefix' ),
        Field::inst( 'birthday' )
          ->validator( 'Validate::dateFormat', array(
                "format"  => Format::DATE_ISO_8601,
              "message" => "Please enter a date in the format yyyy-mm-dd"
           ))
           ->getFormatter( 'Format::date_sql_to_format', Format::DATE_ISO_8601 )
           ->setFormatter( 'Format::date_format_to_sql', Format::DATE_ISO_8601 ),
        Field::inst( 'nation' )->validator( 'Validate::notEmpty' ),
        Field::inst( 'regid' )
    )
        ->process( $_POST )
    ->json();

allan · August 2016

Could you change:

ajax: 'assets/lib/ev_server_processing.php',

to be:

ajax: {
  url: 'assets/lib/ev_server_processing.php',
  type: 'POST'
}

I believe the problem is that the server-side is looking for POST data, but by default DataTables sends a GET request.

You should only need server-side processing (serverSide) when you have tens of thousands of records.

Allan

Andreas S. · August 2016

I chanced the ajax command, but now I get following error:

{"error":"Unknown field: (index 0)","data":[]}

if I set server side to false the error is gone, but no Data are shown. The processing windows of the Datatable are never gone.

I need Serverside, because we expect a huge new data and we have about 36000 results data of our Athletes.

I checked the JSON Data with the given tools on your side, and the are valid

allan · August 2016

Keep the code as I suggested above, but also change the data: null in your first column to be: data: 'lastname'.

The problem you are running into is that the column's display data is being created on the client-side, so the server-side (which is doing the sorting) doesn't know what to sort on. Setting a value will allow it to sort on the lastname. Obviously you might want to change that. Since the data for display is being created at the client-side there is no way to sort on that data server-side.

Allan

Andreas S. · August 2016

Thanks for your help. Problem solved, but now I tried to insert another Data to the Table, The SQL column name is ISO3166-1-Alpha-2 and I get an console.log script error with 'Alpha not defined'.
I could rename the Column name but I can not do this, because many other Web Apps use this db.

Andreas

allan · August 2016

Can you give me a link to the page so I can debug it please. There should be no issue with using ISO3166-1-Alpha-2 with the columns.data property.

Allan

Andreas S. · August 2016

It is difficult, because I have my developer environment on my laptop.

But try this link:
http://www.a-timing.wien/finswimming/index.php?l=en&mo=mli

I have another question. Is it possible to build a dummy name on the serverside script and under this name I merge two field?
for example First und lastname. The editor have those fields, but for the Datatable i give a dummy name (Name) and combine last and firstname behind this var.

allan · August 2016

Thanks for the link - the issue is that it is invalid Javascript rather than a DataTables error. Try using data.nation_codes['ISO3166-1-Alpha-2'].

Is it possible to build a dummy name on the serverside script and under this name I merge two field?

Technically yes, you could use CONCAT with your SQL server to create the concatenated field and then query that, but that isn't something that Editor's PHP libraries currently support I'm afraid.

Allan

Andreas S. · August 2016

I try it, but now the console.log => Expected identifier, I'am not sure why javascript give that error.

At CONCAT I've thought, but how can send my own query to the libraries. with a join I read in the Manuals it is possible?

allan · August 2016

The client / server data interchange used by Editor is documented here.

Allan

Andreas S. · August 2016

I tried to find the problem with the Expected identifier the whole weekend. I think the data.nation_codes['ISO3166-1-Alpha-2'] did not work. Would you have any other suggestions how the problem can be solved?

Andreas S. · August 2016

I solved the Expected identifier Problem with
Field::inst( 'nation_codes.ISO3166-1-Alpha-2 as ISO3166' )

Andreas

allan · August 2016

The console in Chrome is telling me you have a Javascript syntax error here:

'<img title="'+data.nation_codes.name_en+'" src="assets/images/flags/rect/24/'+data.nation_codes['ISO3166-1-Alpha-2'].+'.png" />';

And it is correct. You do. There is an extra . before the +'.png.

Allan

Andreas S. · August 2016

uhh, I think I need new classes. Thanks a lot for help.

Problem with Pagenation and the Showing line

Problem with Pagenation and the Showing line

Answers

Howdy, Stranger!

Categories

DataTables

Problem with Pagenation and the Showing line

Problem with Pagenation and the Showing line

Answers

Howdy, Stranger!

Quick Links

Categories

DataTables