title: AngularJS refresh smart table after inserting new record in Bootstrap Modal Form
body: <p>I use angular-bootstrap and and Angular Smart table.
  I have a modal form which adds new records to database and shows the list in my smart table. Adding new records is working fine but how do I refresh my smart table after a new record is inserted into the database.</p>
  
  <p><strong>Controller</strong></p>
  
  <pre><code>//ajax request to gather data and list in smart table
  october.controllers['dashboard/feeds'] = function ($scope, $filter , $request, $modal, $log, $http) {
  
      $scope.api = $request('onFeeds', {success: function(data, scope){
          this.success(data).done(function() {
              $scope.rowCollection = [];
              $scope.rowCollection = angular.fromJson(data.result);
              $scope.displayedCollection = [].concat($scope.rowCollection);
  
  
              });
          }
      });
  }
  
  //Modal
  
  var ModalInstanceCtrl = function ($scope, $modalInstance,  $request, $filter) {
  
  
      $scope.save = function (data) {
  
          $request('onAddFeed',
  
          {data:data, 
                  success: function(data){
                  this.success(data);
                      $scope.refresh();
                      $modalInstance.close();
  
              }
          });
  
      };
  };
  </code></pre>
  
  <p>Template </p>
  
  <pre><code>        &lt;script type="text/ng-template" id="myModalContent.html"&gt;
              &lt;div class="modal-header"&gt;
                  &lt;h3 class="modal-title"&gt;neue Feed eintragen!&lt;/h3&gt;
              &lt;/div&gt;
              &lt;div class="modal-body"&gt;
                  &lt;form class="form-horizontal" role="form"&gt;
                    &lt;input type=hidden ng-init="formInfo.user_id = {% endverbatim %} {{ user.id }} "&gt;  
                    {%verbatim %}
                    &lt;div class="form-group"&gt;
                      &lt;label for="inputName3" class="col-sm-2 control-label"&gt;Feed Name&lt;/label&gt;
                      &lt;div class="col-sm-8"&gt;
                        &lt;input class="form-control" id="inputName3" placeholder="Feed Name" ng-model="formInfo.name"&gt;
                    &lt;/div&gt;
                &lt;/div&gt;
                &lt;div class="form-group"&gt;
                  &lt;label for="inputEmail3" class="col-sm-2 control-label"&gt;Feed Type&lt;/label&gt;
                  &lt;div class="col-sm-8"&gt;
                    &lt;select ng-model="formInfo.feed_type" class="form-control"&gt;
                        &lt;option&gt;Select Feed Source&lt;/option&gt;  
                        &lt;option value="api"&gt;API&lt;/option&gt;
                        &lt;option value="xml"&gt;XML&lt;/option&gt;
                        &lt;option value="csv"&gt;CSV&lt;/option&gt;
                        &lt;option value="json"&gt;JSON&lt;/option&gt;
                        &lt;option value="upload"&gt;Upload&lt;/option&gt;
                    &lt;/select&gt;
                &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="form-group" ng-show="formInfo.feed_type =='api'"&gt;
              &lt;label for="selectAPI" class="col-sm-2 control-label"&gt;Select API&lt;/label&gt;
              &lt;div class="col-sm-8"&gt;
                &lt;select ng-change="selectAction(item.id)" ng-model="formInfo.network_id" ng-options="item.id as item.name for item in networks" class="form-control"&gt; &lt;/select&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="form-group" ng-repeat="setup in setups"&gt;
              &lt;label for="setup" class="col-sm-2 control-label"&gt;{{setup}}&lt;/label&gt;
              &lt;div class="col-sm-8"&gt;
                  &lt;input ng-model="formInfo['api_credentials'][setup]" class="form-control" placeholder="Enter your {{setup}}"&gt;
  
           &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="form-group" ng-show="formInfo.feed_type =='xml' || formInfo.feed_type =='csv' "&gt;
              &lt;label for="inputPassword3" class="col-sm-2 control-label"&gt;Source&lt;/label&gt;
              &lt;div class="col-sm-8"&gt;
                  &lt;div class="input-group"&gt;
                    &lt;div class="input-group-addon"&gt;&lt;i class="fa fa-link"&gt;&lt;/i&gt;&lt;/div&gt;
                  &lt;input ng-model="formInfo.source" type="text" class="form-control" id="sourceInput" placeholder="URL"&gt;
          &lt;/div&gt;
  
        &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;span&gt;{{formInfo}}&lt;/span&gt;
  &lt;/form&gt;
  &lt;/div&gt;
  &lt;div class="modal-footer"&gt;
      &lt;button type="submit" class="btn btn-primary" ng-click="save(formInfo)"&gt;Save&lt;/button&gt;
      &lt;button type="button" class="btn btn-warning" ng-click="cancel()"&gt;Cancel&lt;/button&gt;
  &lt;/div&gt;
  &lt;/script&gt;
  </code></pre>