Answers

• kthorngren Posts: 21,336Questions: 26Answers: 4,951

  October 2020

  You need to include the select extension files (JS and CSS). See the Select Install docs for the steps.

  Kevin
• lortz Posts: 12Questions: 4Answers: 0

  October 2020 edited October 2020

  Thank you, I just forgot to include them into the fiddle but I had included them into my actual project. Now it works on the fiddle (https://jsfiddle.net/va7yzdr4/16/) but, oddly enough, it doesn't on my project. Let me explain better: if I put these options:

  $(document).ready(function() {
      var table = $('#myTable').DataTable({
          "order": [[ 1, "desc" ]],
          dom: 'Bfrtip',
          "stripeClasses": ['odd', 'even'],
          stateSave: true,
          "stateDuration":  -1,
          stripHtml: false,
          select: {
              info: true,
              style: 'multi',
              selector: 'td'
          }
      });
  });
  

  it works fine (I can select the rows). But, as soon as I change the selector into:

  $(document).ready(function() {
      var table = $('#myTable').DataTable({
          "order": [[ 1, "desc" ]],
          dom: 'Bfrtip',
          "stripeClasses": ['odd', 'even'],
          stateSave: true,
          "stateDuration":  -1,
          stripHtml: false,
          select: {
              info: true,
              style: 'multi',
              selector: 'td:nth-child(2)'
          }
      });
  });
  

  it stops working, I think, because I cannot see the info when I select the rows and I can select the rows not only by clicking on the 2nd column (as it should be) but by clicking on any column. Why does this happen?
• kthorngren Posts: 21,336Questions: 26Answers: 4,951

  October 2020

  I added the info: true option to your test case. Yes, it does work as expected in your test case.
  https://jsfiddle.net/g4xdaky5/

  Why does this happen?

  Hard to say without seeing the problem. There must be more to your Javascript than you are showing. Are you reinitializing the Datatable? Do you html5 data attributes on the -tag table` tag enabling select?

  Kevin
• lortz Posts: 12Questions: 4Answers: 0

  October 2020

  I'm not reinitializing the Datatable. What do you mean with your last question?

  I tried to copy the computed HTML code of my actual project into jsfiddle with the exact same js and css and it works perfectly on jsfiddle, but not on my website.

  How can I debug it? The browser console shows no errors at all.
• kthorngren Posts: 21,336Questions: 26Answers: 4,951

  October 2020

  What do you mean with your last question?

  Many Datatables options can be defined using HTM5 attributes as documented here:
  https://datatables.net/manual/options#HTML-5-data-attributes

  How can I debug it?

  Good question. What happens if you remove the whole select option:

          select: {
              info: true,
              style: 'multi',
              selector: 'td:nth-child(2)'
          }
  

  Are you still able to select rows? If so then its being enabled somewhere else presumably overwriting the above.

  Provide a link to your page so we can take a look.

  Kevin
• lortz Posts: 12Questions: 4Answers: 0

  October 2020

  Yes, I can still select the rows when I remove that portion of the code.

  I cannot link the page since it's not on the internet... how can I check where it's being loaded? Or how can I override it?
• kthorngren Posts: 21,336Questions: 26Answers: 4,951

  October 2020

  how can I check where it's being loaded? Or how can I override it?

  That is all custom to your code. I've suggested all the places I can think to look. With the select option removed and you select a row does the info element show selected rows? If not then it sounds like you have other code to select rows that is not using the select extension.

  Kevin
• lortz Posts: 12Questions: 4Answers: 0

  October 2020

  OK, I found the code that was selecting the rows, removed it and now it all works as expected! Many, many thanks for the help!