Problems with ServerSide: true

Problems with ServerSide: true

marcel.haldemannmarcel.haldemann Posts: 7Questions: 0Answers: 0

Hi,

I got some issues with ServerSide processing. As soon as serverSide Processing is enabled there are 2 Problems:

  1. Try: add something(add Button), then edit a few fileds (inline), then Try to add another -> now Dialog is coming anymore, also delete doesn't work anymore. (sometimes it works for a while)
    -> there is a error in the Firefox consol log: TypeError: idx is undefined
    On Line: 4873 in datatables.editor.js:
    ```var col = dt.settings()[0].aoColumns[ idx.column ];

  2. I used the code "Tab between colums", from you example. This codes is not working on if i set ServerSide: true

I've no problems and all works perfect as long as i set ServerSide: false, but as soon as i change ServerSide to true the above mentioned problems occur.

To test it:
with the issues (only difference ServerSide: true):
http://sils.convercom.ch/datatablesIssue/

without any issues (only difference ServerSide: false):
http://sils.convercom.ch/datatablesIssue/

http://sils.convercom.ch/datatablesClient/

Is there migth a problem with ServerSide: true ? or are im doing something wrong/forgot some thing ?

Thanks in advise,
Marcel

Replies

  • marcel.haldemannmarcel.haldemann Posts: 7Questions: 0Answers: 0

    the link without issues is: http://sils.convercom.ch/datatablesClient/ i double posted the one with issues

  • allanallan Posts: 54,579Questions: 1Answers: 8,533 Site admin

    Hi!

    1) Could you show me the PHP you are using here? It looks like the ServiceKey is the primary key for the table, and you almost certainly don't want that to be editable. I'm wondering if that is at least part of the problem.

    2) This is a known issue unfortunately. Let me get back to you on that one!

    Regards,
    Allan

  • marcel.haldemannmarcel.haldemann Posts: 7Questions: 0Answers: 0
    edited March 2015

    ServiceKey is Unique and an int, thus i just defined it as primaryKey and it should be editable. However i can add an autoincrement primary and change the ServiceKey it to unique if this migth be the problem.
    PHP Code:

    include( "lib/DataTables.php" );
    use DataTables\Editor, DataTables\Editor\Field, DataTables\Editor\Format, DataTables\Editor\Join, DataTables\Editor\Validate;
    
    Editor::inst( $db, "camelrouting", "serviceKey" )
        ->fields(
            Field::inst( "serviceKey" )->validator( function($val, $data, $opts) { if ( ! preg_match( '/^[0-9]{1,9}$/', $val ) ) { return "Muss eine Zahl sein, maximal 9 Stellen"; } return true; } ) 
            Field::inst( "prefix" )->validator( function($val, $data, $opts) { if ( ! preg_match( '/^[A-F0-9]{1,16}$/', $val ) ) { return "Muss eine Hex-Zahl sein"; } return true; } ) ,
            Field::inst( "shortNumberRouting" )->validator( function($val, $data, $opts) { if ( ! preg_match( '/^[YN]{1}$/', $val ) ) { return "Gültig ist Y oder N"; } return true; } )  )
        ->process( $_POST )
        ->json();   
    
  • marcel.haldemannmarcel.haldemann Posts: 7Questions: 0Answers: 0

    I now added a column called id as PK/Autoincrement and changed the PrimaryKey filed in php to "id". The Problems is still the same.

    Editor::inst( $db, "camelrouting2", "id" ) ->fields(

    Here the new version: http://sils.convercom.ch/datatablesPkAuto/

  • marcel.haldemannmarcel.haldemann Posts: 7Questions: 0Answers: 0

    php for PkAuto:

    include( "lib/DataTables.php" );
    use DataTables\Editor, DataTables\Editor\Field, DataTables\Editor\Format, DataTables\Editor\Join, DataTables\Editor\Validate; 
    Editor::inst( $db, "camelrouting2", "id" )
        ->fields(
            Field::inst( "serviceKey" )->validator( function($val, $data, $opts) { if ( ! preg_match( '/^[0-9]{1,9}$/', $val ) ) { return "Muss eine Zahl sein, maximal 9 Stellen"; } return true; } ) ,
            Field::inst( "prefix" )->validator( function($val, $data, $opts) { if ( ! preg_match( '/^[A-F0-9]{1,16}$/', $val ) ) { return "Muss eine Hex-Zahl sein"; } return true; } ) ,
            Field::inst( "shortNumberRouting" )->validator( function($val, $data, $opts) { if ( ! preg_match( '/^[YN]{1}$/', $val ) ) { return "Gültig ist Y oder N"; } return true; } )  )
        ->process( $_POST )
        ->json(); 
    
  • allanallan Posts: 54,579Questions: 1Answers: 8,533 Site admin

    Super - thanks for the updates!

    This is very certainly a bug in Editor. Basically it wasn't waiting for the table to redraw when in server-side processing mode. I have a fix that will be in the next release, but if you would like to apply it immediately, in the Editor JS file find the following:

            // If there is an inline edit box, it needs to be tidied
            this
                .off( 'close.killInline' )
                .one( 'close.killInline', fn )
                .blur();
    
            return true;
    

    and replace with:

            // If there is an inline edit box, it needs to be tidied
            var that = this;
    
            this
                .one( 'close', function () {
                    // On close if processing then we need to wait for the submit
                    // to complete before running the callback as submitOnBlur was
                    // set to true
                    if ( ! that.s.processing ) {
                        fn();
                    }
                    else {
                        // Need to wait for the submit to finish
                        that.one( 'submitComplete', function () {
                            // If server-side processing is being used in DataTables,
                            // wait for the draw to finished
                            var table = new $.fn.dataTable.Api( that.s.table );
                            if ( that.s.table && table.settings()[0].oFeatures.bServerSide ) {
                                table.one( 'draw', fn );
                            }
                            else {
                                fn();
                            }
                        } );
                    }
                } )
                .blur();
    
            return true;
    

    Its a bit more complicated, that should do the job internally.

    There is one change needed externally as well:

    editor.inline( this, { "submitOnBlur": true } );

    needs to be changed to:

    editor.inline( table.cell( this ).index(), { "submitOnBlur": true } );
    

    and

    $('#cocoDataTbl').DataTable( {

    to

    var table = $('#cocoDataTbl').DataTable( {
    

    The reason for this is that when server-side processing is enabled when the table is redrawn it the DOM elements are destroyed and new ones created - so this, i.e. the original cell clicked on, no longer exists! Using the cell index resolves this.

    I will abstract that out in a future version, but that is a fair amount of work most likely rather than a little bug fix.

    Let me know how you get on with it!

    Regards,
    Allan

  • marcel.haldemannmarcel.haldemann Posts: 7Questions: 0Answers: 0
    edited March 2015

    Hi Allan,

    Thanks for the help. This solves both Problems.

    kindly,
    Marcel

This discussion has been closed.