Answers

• lenamtl Posts: 265Questions: 65Answers: 1

  April 2020 edited April 2020

  Hi,

  I have fixed this way for now

  JS
  // refresh
  if(performance.navigation.type == 2){
  location.reload(true);
  }

  The 2 indicates the page was accessed by navigation into the history.
• kthorngren Posts: 21,523Questions: 26Answers: 4,986

  April 2020

  That problem doesn't happen on the Gyrocode StateSave example page:
  https://www.gyrocode.com/projects/jquery-datatables-checkboxes/examples/basic/state-saving/

  At least not with Chrome. Does the second table work for you?

  Kevin
• lenamtl Posts: 265Questions: 65Answers: 1

  May 2020 edited May 2020

  Hi,

  His example is in an embed Iframe to display JSfiddle code, to reproduce we will need a real web page.

  I have tested using Chrome and Opera, I have google about checkbox & back button, and this seem to happend often...

  I suspect this is because the target use different column or maybe this is related to
  'selector': 'td:nth-child(2)',

  The values of the checkbox state are not saved in savestate.
  But checkboxes are still checked when I come back on the page If click back button
• kthorngren Posts: 21,523Questions: 26Answers: 4,986

  May 2020

  I suspect this is because the target use different column or maybe this is related to
  'selector': 'td:nth-child(2)',

  Your code snippets seem to work here:
  http://live.datatables.net/doyukiku/1/edit

  Do the examples I asked about work correctly with your browser?

  Are you using any of these options?
  stateLoadCallback
  stateLoadParams
  stateLoaded
  stateSaveCallback
  stateSaveParams

  Kevin
• lenamtl Posts: 265Questions: 65Answers: 1

  May 2020

  Yes the example work ok but it is different from mine and is embed from jsfiddle into an iframe .

  I may be wrong but I don't think we cannot replicate the case on a fiddle / bin because it is not a normal web page.

  Yes I use stateSaveCallback, stateLoadCallback

  If I select checkboxes and refesh the page manually
  Resul the checkboxes get deselected = OK perfect

  If I select checkboxes and go to another page then click back
  (using browser back button)
  Result the checkboxes are still selected = Not OK

  I have checked the checkbox state are not saved into localstorage,
  if I refresh the page manually the result is ok, unchecked.
  So this is something about the back button and page that is not refreshed .

  Maybe something stay into the Dom cache, is there a way to log something to investigate...

  Also I'm using Yadcf, responsive, button, column reorder, show hide column
  I don't think this is related but just incase..
• kthorngren Posts: 21,523Questions: 26Answers: 4,986

  May 2020 edited May 2020

  You can open the jsbin outside of the environment:
  http://live.datatables.net/sicigavo/1

  If I select checkboxes and go to another page then click back
  (using browser back button)
  Result the checkboxes are still selected = Not OK

  I tried the same with the above link and the checkboxes aren't saved.

  Do you have a link to your page that can be looked at?

  I have google about checkbox & back button, and this seem to happend often...

  What did you find?

  Does this problem occur with checkboxes outside of Datatables?

  Kevin
• lenamtl Posts: 265Questions: 65Answers: 1

  May 2020 edited May 2020

  Hi,

  I have recreated the case here https://jsfiddle.net/lenamtl/fzr46ut9/

  Select All or a few checkboxes
  Then click on the link Visit W3Schools
  Then click on back browser button
  = the checkboxes are still checked

  To fix this I'm now using this snippet

  var perfEntries = performance.getEntriesByType("navigation");
  
      if (perfEntries[0].type === "back_forward") {
          location.reload(true);
      }
  
• kthorngren Posts: 21,523Questions: 26Answers: 4,986

  May 2020 edited May 2020 Answer ✓

  I think I found the issue (and your example confirms it). Finally realized you are using a DOM sourced table. My test case had Ajax data. Found this article regarding Autocompletion. The problem not related to Datatables, Statesave or the Gyrocode checkboxes. Its related to how browsers remember information in input fields. Since you have DOM sourced table the inputs in the DOM will be remembered. With Ajax the table is overwritten with the Ajax data.

  You can use turn off the autocomplete attribute on the checkboxes. See this example:
  http://live.datatables.net/tuzalugo/4/edit

  I used this code to add autocomplete="off" to all the select checkboxes:

        initComplete: function (row) {
          $('th.dt-checkboxes-cell').find('input').attr('autocomplete', 'off');
          $('.dt-checkboxes').attr('autocomplete', 'off');
        }
  

  You can test it by clicking the Upward/Right facing arrow next to Auto-run JS in the Output tab. The web page will open into a new window. There are two tables the top one sets the autocomplete attribute and the bottom one doesn't. Place check marks in both tables, go to a new site then back. The top table will be cleared and the bottom not

  Kevin
• lenamtl Posts: 265Questions: 65Answers: 1

  May 2020

  Hi,

  I knew that for the form but didn't thought that could applied to an input in a table

  Here is my final code to also applied to dt-checkboxes-select-all

  initComplete: function (row) {
      $('th.dt-checkboxes-cell').find('input').attr('autocomplete', 'off');
      $('th.dt-checkboxes-select-all').find('input').attr('autocomplete', 'off');
      $('.dt-checkboxes').attr('autocomplete', 'off');
      },
  

  Thanks again for your time I always appreciate your help
• lenamtl Posts: 265Questions: 65Answers: 1

  May 2020 edited May 2020

  To fix it directly into the plugin file dataTables-chexboxes.js

  if(ctx.aoColumns[i].mRender === null){
      colOptions['render'] = function(){
          //return '<input type="checkbox" class="dt-checkboxes">';
            return '<input type="checkbox" class="dt-checkboxes" autocomplete="off">';
      };
  }
  
  //selectAllRender: '<input type="checkbox">'
    selectAllRender: '<input type="checkbox" autocomplete="off">'