Answers

• garretthyder Posts: 9Questions: 2Answers: 0

  December 2020

  Seems this is pretty well across the board for JS snippets on the site, some examples;
  https://datatables.net/forums/discussion/34247/how-to-get-a-cell-from-a-selected-row-in-datatables
  https://datatables.net/reference/api/cell().data()
  https://datatables.net/examples/basic_init/hidden_columns.html
• tangerine Posts: 3,348Questions: 36Answers: 394

  December 2020

  The HTML is required for the purpose of displaying the code. Actual usage of the code does not deploy the HTML.
• garretthyder Posts: 9Questions: 2Answers: 0

  December 2020

  Hi @tangerine that's not actually correct. The HTML shouldn't be displayed or copied as it defeats the purpose of the code snippet. Copying one of those sections gives you useless code see below;

  <span class="token keyword">var</span> table <span class="token operator">=</span> <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">'#example'</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">DataTable</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

  <span class="token function">$</span><span class="token punctuation">(</span><span class="token string">'#example tbody'</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">on</span><span class="token punctuation">(</span> <span class="token string">'click'</span><span class="token punctuation">,</span> <span class="token string">'td'</span><span class="token punctuation">,</span> <span class="token keyword">function</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
  <span class="token function">alert</span><span class="token punctuation">(</span> table<span class="token punctuation">.</span><span class="token function">cell</span><span class="token punctuation">(</span> <span class="token keyword">this</span> <span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">data</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">)</span><span class="token punctuation">;</span>
  <span class="token punctuation">}</span> <span class="token punctuation">)</span><span class="token punctuation">;</span>

  The current syntax highlighting system used on this website is broken, hoping a sysadmin sees this.
  Cheers
• tangerine Posts: 3,348Questions: 36Answers: 394

  December 2020

  Show / hide a row based on its current state, adding the row content as needed.:

  var table = $('#example').DataTable();
   
  $('#example tbody').on('click', 'td.details-control', function () {
      var tr = $(this).parents('tr');
      var row = table.row( tr );
   
      if ( row.child.isShown() ) {
          // This row is already open - close it
          row.child.hide();
          tr.removeClass('shown');
      }
      else {
          // Open this row (the format() function would return the data to be shown)
          row.child( format(row.data()) ).show();
          tr.addClass('shown');
      }
  } );
  

  If you are using "View page source", then don't.
• colin Posts: 15,142Questions: 1Answers: 2,586

  December 2020

  Yep, just copy if from the tabs on the bottom of the page...

  Colin
• kthorngren Posts: 20,275Questions: 26Answers: 4,765

  December 2020 Answer ✓

  I think @garretthyder is saying that when looks at the examples he is seeing what he shows in his screenshots. Where we aren't seeing that problem. We are seeing this:

  

  @garretthyder It may be a particular browser with the problem. Have you tried others and what browser are you using that is showing the problem.

  Kevin
• colin Posts: 15,142Questions: 1Answers: 2,586

  December 2020 Answer ✓

  Another trick is to view the page in private browsing mode in case any extensions are causing the problem,

  Colin
• garretthyder Posts: 9Questions: 2Answers: 0

  December 2020

  Thank you all, greatly appreciate troubleshooting through that. It did come down to an extension, the 'axe - Web Accessibility Testing' extension found here;
  https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd
  *I'll report an issue to them.

  Sorry for the delay in my replies, just found I had to enable email to get notifications from the forum here.
• garretthyder Posts: 9Questions: 2Answers: 0

  December 2020

  I confirmed with axe and they're aware of the issue quoting;

  We’re aware of the issue, it’s been a long standing issue with the syntax highlighter (prism) that we’ve been using.
  https://github.com/dequelabs/axe-core/issues/1868
  https://github.com/dequelabs/axe-core/issues/2711
• colin Posts: 15,142Questions: 1Answers: 2,586

  December 2020

  Thanks for reporting back, that was a confusing one!

  Colin