title: Footable along with Angular.js
body: <p>I m trying to use footable(<a href="http://themergency.com/footable-demo/responsive-container.htm" rel="noreferrer">http://themergency.com/footable-demo/responsive-container.htm</a>) along with angular.js.</p>
  
  <p><img src="https://i.stack.imgur.com/tBH0h.png" alt="enter image description here"></p>
  
  <p>As the window size is reduced, Column 3, 4, 5 are only shown when plus sign is clicked. </p>
  
  <p>Angular.js provides filtering capabilities, so when I put some search string like below:</p>
  
  <p><img src="https://i.stack.imgur.com/ObebV.png" alt="enter image description here"> </p>
  
  <p>Rows in the table are filtered.</p>
  
  <p>Now the problem is when I try to remove this search string as below:</p>
  
  <p><img src="https://i.stack.imgur.com/8GERU.png" alt="enter image description here"></p>
  
  <p>all the rows are again show, but the UI is distorted.</p>
  
  <p>I tried to get a callback in angular.js using </p>
  
  <pre><code>$scope.$watch('searchStringID', function() {
  $('#tableId').trigger('footable_initialize');
  }
  </code></pre>
  
  <p>but did not work, if anybody can suggested how to address this issue.</p>
  
  <p>Thanks.</p>