Colvis+Colreorder+saveState problem

Colvis+Colreorder+saveState problem

EASEAS Posts: 1Questions: 1Answers: 0

Dear colleagues,
I am using Datatables and am very happy with it. However, when I use ColReorder, Colvis and the save state it appears that sometimes unexpected things happen.

What do I want to achieve:
* There are multiple tables generated on the backend, each with a separate ID and different columns, but same general markup.
* JQuery initializes all of these tables (by class) with the following function.
* The user can customize the table (sorting, filtering, col-Reorder, Col-Visibility etc.)
* The changes are sent as AJAX to my server and fetched from the server upon loading a table.

All works beautifully except the column reordering and visibility. In 1.10.0 everything worked, but from time to time restored very old settings in the column reordering. In the newest version even that does not work, the columns can not be properly deslected.

I suppose this is to do with wrong column indices as - supposingly solved here https://datatables.net/forums/discussion/35423/colvis-menu-colreorder-button-colvis-problem

To the details:
I am using the latest download with all the plugins. I initialize my stuff using

function initVorgangsListe() {
    $('.datatables-voll').DataTable({
        retrieve: true, 
        dom: 'lBfrtip',
        buttons: [
                'colvis',
                'excel',
                'print',
                {
                    extend: 'csv',
                    text: 'CSV',
                    fieldSeperator: ';',
                    charset: 'utf-8',
                    exportOptions: {
                        modifier: {
                            search: 'none',
                            fieldSeperator: ';',
                            charset: 'utf-8'
                        }
                    }
                }
        ],
        // https://datatables.net/reference/api/buttons.exportInfo() für Details zur Buttonkonfiguration
        colReorder: true,
        select: false,
        stateSave: true, 
        stateDuration: 0, 
        scrollX: true,
        "stateSaveCallback" : function (settings, data) {
            // Send an Ajax request to the server with the state object
            // var dataString = JSON.stringify(data);
            // var uri = './FIS_Controller?zeige=datatablessavestate&tabelle=' + $(this).attr('id') + '&json=' + dataString;
            // $.get(uri);
            $.post("./FIS_Controller",
                    {
                        zeige: "datatablessavestate",
                        tabelle: $(this).attr('id'),
                        json: JSON.stringify(data)
                    },
                    function(data, status){
                       // alert("Data: " + data + "\nStatus: " + status);
                    });
          },
          "stateLoadCallback": function (settings) {
                var o;
                // Send an Ajax request to the server to get the data. Note that
                // this is a synchronous request since the data is expected back from the
                // function
                $.ajax( {
                  "url": "./FIS_Controller?zeige=datatablesloadstate&tabelle=" + $(this).attr('id'),
                  "async": false,
                  "dataType": "json",
                  "success": function (json) {
                    o = json;
                  }
                } );
                return o;
          }, 
          
          "language" : {
                "sEmptyTable":      "Keine Daten in der Tabelle vorhanden",
                "sInfo":            "_START_ bis _END_ von _TOTAL_ Einträgen",
                "sInfoEmpty":       "0 bis 0 von 0 Einträgen",
                "sInfoFiltered":    "(gefiltert von _MAX_ Einträgen)",
                "sInfoPostFix":     "",
                "sInfoThousands":   ".",
                "sLengthMenu":      "_MENU_ Einträge anzeigen",
                "sLoadingRecords":  "Wird geladen...",
                "sProcessing":      "Bitte warten...",
                "sSearch":          "Suchen",
                "sZeroRecords":     "Keine Einträge vorhanden.",
                "oPaginate": {
                    "sFirst":       "Erste",
                    "sPrevious":    "Zurück",
                    "sNext":        "Nächste",
                    "sLast":        "Letzte"
                },
                "oAria": {
                    "sSortAscending":  ": aktivieren, um Spalte aufsteigend zu sortieren",
                    "sSortDescending": ": aktivieren, um Spalte absteigend zu sortieren"
                },
                "decimal": ",",
                "thousands": "."
            }

      
    });
    
}

What happens is that I can unselect some columns, but not others. The colvis buttons change from active to inactive or vice versa, but the table does not change.

Answers

  • colincolin Posts: 15,142Questions: 1Answers: 2,586

    Hi @EAS ,

    There's a lot going on there. We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

    Cheers,

    Colin

This discussion has been closed.