Replies

• kthorngren Posts: 21,324Questions: 26Answers: 4,949

  March 2021

  Can't tell by looking at your source code but are you using columns.adjust() when opening a tab? See this example for more information.

  Kevin
• raugul Posts: 7Questions: 0Answers: 0

  March 2021

  I think not, could you help me?
• raugul Posts: 7Questions: 0Answers: 0

  March 2021

  I use only 3 plugins
  1.TablePress
  2.TablePress Extension: Responsive Tables
  3.Elementor (tabs)
• raugul Posts: 7Questions: 0Answers: 0

  March 2021

  Where can I install this js Code?

  var table = $('#example').DataTable();

  $('#container').css( 'display', 'block' );
  table.columns.adjust().draw();
• colin Posts: 15,240Questions: 1Answers: 2,599

  March 2021

  This blog post here discusses WP installation - it's for both Editor and DataTables, but the principle will apply for just DataTables. Take a look at that and see if it gets you on the right path.

  Colin
• raugul Posts: 7Questions: 0Answers: 0

  March 2021

  I don’t understand how to do this in my case?
  Can you help me?
• colin Posts: 15,240Questions: 1Answers: 2,599

  March 2021

  What have you tried? Which part of the blog post I referenced isn't working for you?

  Colin
• raugul Posts: 7Questions: 0Answers: 0

  March 2021

  I don't understand where to install the JS code in my case
  I have already imported Tables about 50 pieces
  I use the shortcode [table id=3 responsive=collapse responsive_breakpoint= "phone" /] to insert under the spoiler
  When opening a spoiler or tab from a mobile device, the table does not become collapse, but if you start interacting with it, it becomes collapse

  my site

  https://подшипник78.рф/conicheskie/
• kthorngren Posts: 21,324Questions: 26Answers: 4,949

  March 2021

  When opening a spoiler or tab

  Are there event handlers you can create for these? If so then in the event handler use columns.adjust(). The example I linked to uses the Bootstrap tab open event handler to run execute columns.adjust(). Sorry, I'm not familiar with the framework you are using to provide a specific answer.

  Kevin
• raugul Posts: 7Questions: 0Answers: 0

  April 2021 edited April 2021

  I solved the problem thank you

  <script>
  jQuery(function($) {
  $(".elementor-tab-title").on("click", function(){
      tabTitle = $(this);
      setTimeout(reDrawAdaptiveCustom(tabTitle), 2000);
      
      
  });
  function reDrawAdaptiveCustom(tabTitle){
  var table = tabTitle.closest('.elementor-toggle-item').find('.tablepress').DataTable();
  table.columns.adjust().draw();
  }
  });
  </script>
  

  Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.