title: Toggle show/hide columns in fooTable
body: <p>I am trying to hide couple of columns based on drop down selection.Tried all the possibilities but nothing working out for me. Here is my source,</p>
  
  <p>My fooTable HTML,</p>
  
  <pre><code>&lt;table class="footable table" id="M-AMA-AUT-401-00NP_fooTable" data-sort="false" &gt;
      &lt;thead&gt;
          &lt;tr class="fooTable-Header-Color"&gt;
          &lt;th id="th_Omselement"&gt;OMS Element&lt;/th&gt;
          &lt;th id="th_OmsDomain"&gt;OMS Domain&lt;/th&gt;
          &lt;th data-sort-ignore="true" data-hide="phone"&gt;Priority&lt;/th&gt;
          &lt;th data-sort-ignore="true" data-hide="phone"&gt;Finding&lt;/th&gt;
          &lt;th data-sort-ignore="true" data-hide="phone"&gt;Comments&lt;/th&gt;
          &lt;th data-sort-ignore="true" data-hide="phone"&gt;Finding type&lt;/th&gt;                                                             
          &lt;/tr&gt;
      &lt;/thead&gt;
   &lt;/table&gt;
  </code></pre>
  
  <p>My code,</p>
  
  <pre><code>             if($typeSelected=='OMS'){
                  $('.footable').data('footable').reset();
                  $('#th_Omselement').data("hide", "");    
                  $('#th_OmsDomain').data("hide", "");
  
                  $('.footable').data('footable').footable();
  
                  /*$("#th_Omselement").show();
                  $("#th_OmsDomain").show();
                  $('#'+id+'_td_Omselement').show();
                  $('#'+id+'_td_OmsDomain').show();*/
              }
              else {
                  $('.footable').data('footable').reset();
                  $('#th_Omselement').data("hide", "all");
                  $('#th_OmsDomain').data("hide", "all");
                  $('.footable').data('footable').redraw();
  
  /*              $("#th_Omselement").hide();
                  $("#th_OmsDomain").hide();
                  $('#'+id+'_td_Omselement').hide();
                  $('#'+id+'_td_OmsDomain').hide();*/
              }
  </code></pre>