title: How to reload angularJs ng-table
body: <p>I have an ng-table. I have multiple ng-tables inside one controller. I am giving dynamic attributes i.e. <strong>ng-table="tableParams2" or ng-table="tableParams3"</strong> etc. to them.
  I am making an ajax request on button click function to update the data. My http request is being sent at backend. By after I click 3-4 times, I see in console my table is reloaded. By after data, my data remains constant, I don't see the reloaded content in table. Below is my code:</p>
  
  <p>Html:</p>
  
  <pre><code>&lt;button ng-click="qualifyX(2)" &gt;&lt;/button&gt;
  
  &lt;div class="dragable modal hide fade ui-draggable in" id="ptn_popup" aria-hidden="false" data-backdrop="false"&gt;
  &lt;div class="modal-header"&gt;
      &lt;a class="close" data-dismiss="modal" data-original-title="" title=""&gt;×&lt;/a&gt;
      &lt;h4&gt;Possible matched Companies&lt;/h4&gt;
  &lt;/div&gt;
  &lt;div class="modal-body" style="padding: 10px;"&gt;
      &lt;div id="ptn_qualify_res" class="grid-view"&gt;
          &lt;div class="summary"&gt;&lt;/div&gt;
          &lt;table ng-table="tableParams2" show-filter="true" class="items table table-striped table-bordered table-condensed"&gt;
              &lt;tr ng-repeat="business in $data"&gt;
                  &lt;td data-title="'Primary Trading Name'" sortable="'primary_trading_name'" filter="{ 'primary_trading_name': 'text' }"&gt;
                      {{business.primary_trading_name}}
                  &lt;/td&gt;
                  &lt;td data-title="'Primary Entity Name'" sortable="'primary_entity_name'" filter="{ 'primary_entity_name': 'text' }"&gt;
                      {{business.primary_entity_name}}
                  &lt;/td&gt;
                  &lt;td data-title="'Business Name(s)'" sortable="'business_names'" filter="{ 'business_names': 'text' }"&gt;
                      {{business.business_names}}
                  &lt;/td&gt;
                  &lt;td data-title="'Other Trading Name(s)'" sortable="'other_trading_names'" filter="{ 'other_trading_names': 'text' }"&gt;
                      {{business.other_trading_names}}
                  &lt;/td&gt;
                  &lt;td data-title="'State'" sortable="'state'" filter="{ 'state': 'text' }"&gt;
                      {{business.state}}
                  &lt;/td&gt;
                  &lt;td style="width:70px;"&gt;
                      &lt;a data-dismiss="modal" href="javascript:void(0)" data={{business.business_id}} class="ptn_qualify_view_link"&gt;
                          &lt;button type="button" class="btn btn-mini"&gt;&lt;i class="icon-eye-open"&gt;&lt;/i&gt; View &amp;nbsp;&lt;/button&gt;
                      &lt;/a&gt;
                  &lt;/td&gt;
              &lt;/tr&gt;
          &lt;/table&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="modal-footer"&gt;
      &lt;a data-dismiss="modal" class="btn" id="yw11" href="javascript:void(0);" data-original-title="" title=""&gt;Close&lt;/a&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>App.js</p>
  
  <pre><code>$scope.qualifyX = function(busID) {
      var penModal = $('#popups_container' + busID + ' #pen_popup');
      var pen = $('#popups_container' + busID).next().find('input#Custombusiness_primary_entity_name').val();
      var selectors = {pen: pen, penModal: penModal};
      $http.get(getPtnData + '?ptn=' + selectors.ptn).success(function(data) {
          selectors.ptnModal.find('#ptn_qualify_res').removeClass('grid-view-loading').addClass('grid-view');
          $scope['tableParams' + busID] = new ngTableParams(
                  {
                      page: 1, // show first page
                      count: data.length, // count per page
                      sorting:
                              {
                                  primary_trading_name: 'asc'     // initial sorting
                              }
                  }, {
              total: 0, // length of data
              getData: function($defer, params) {
                  var filteredData = params.filter() ?
                          $filter('filter')(data, params.filter()) :
                          data;
                  var orderedData = params.sorting() ?
                          $filter('orderBy')(filteredData, params.orderBy()) :
                          data;
  
                  params.total(orderedData.length); // set total for recalc pagination
                  $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
              }
          }); 
      });
  };
  </code></pre>
  
  <p>Create a somewhat similar <a href="http://plnkr.co/edit/PQwNKkMFxCFnzlEzpBEg?p=preview" rel="nofollow noreferrer">Plunker</a>, on every click I want to reload the table with new data.</p>