title: Data pushing into table(array) before success in angularjs xeditable table
body: <p>I want to insert the added data into table only after the post request is successful, but it will add before checking the post request. So how do I insert the table row data only after success.</p>
  
  <p>Also, showCategories (categories gotten from the api) is not working, but gender (getting from local) is working. In select box (category data options is showing) but I cannot select the category data. I used same thing as gender select box, but gender select box is working but not category. Where did I make my mistake?</p>
  
  <p><strong>Html</strong></p>
  
  <pre><code> &lt;table class="table table-bordered table-hover table-condensed"&gt;
          &lt;tr style="font-weight: bold"&gt;
              &lt;td style="width:5%"&gt;No.&lt;/td&gt;
              &lt;td style="width:20%"&gt;Name&lt;/td&gt;
              &lt;td style="width:10%"&gt;Gender&lt;/td&gt;
              &lt;td style="width:30%"&gt;Profile photo&lt;/td&gt;
              &lt;td style="width:20%"&gt;Category&lt;/td&gt;
              &lt;td style="width:30%"&gt;Action&lt;/span&gt;
              &lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr ng-repeat="user in users"&gt;
              &lt;td&gt;{{$index+1}}&lt;/td&gt;
              &lt;td&gt;
                  &lt;span editable-text="user.name" e-name="name" onbeforesave="checkName($data, user._id)" ng-model="userName" e-form="rowform" e-required&gt;
                        {{ user.name}}
                      &lt;/span&gt;
              &lt;/td&gt;
              &lt;td&gt;
              &lt;span editable-select="user.gender" ng-model="gender" e-name="gender" e-form="rowform" e-ng-options="s.value as s.text for s in genders"&gt;
                    {{ showGender(user) }}
              &lt;/span&gt;
  
              &lt;/td&gt;
  
              &lt;!-- ng-show="tableform.$visible" --&gt;
              &lt;td class="text-center" &gt;
                      &lt;img ng-src="/api/media/{{user.media_id}}" alt="No Image" style="margin-bottom:20px;width:100%;"&gt;
                      &lt;a class="btn btn-success" ui-sref="media({_id: user._id })" style="border: .0625rem solid transparent;margin: 10px 0px;padding: .465rem 1rem;"&gt; Upload File&lt;/a&gt;
                  &lt;!-- &lt;input type="file" flow-button   value="Upload"&gt; --&gt;
              &lt;/td&gt;
              &lt;td&gt;
                   &lt;span editable-select="user.category" e-name="category" e-form="rowform" e-ng-options="c.value as c.name for c in categories"&gt;
                    {{ showCategories(user) }}
                   &lt;/span&gt; 
              &lt;/td&gt;
              &lt;td style="white-space: nowrap"&gt;
                  &lt;!-- form --&gt;
                  &lt;form editable-form name="rowform" onbeforesave="saveUser($data,user_id)" ng-show="rowform.$visible" class="form-buttons form-inline" shown="inserted == user"&gt;
                      &lt;button type="submit" ng-disabled="rowform.$waiting" class="btn btn-primary"&gt;
                          save
                      &lt;/button&gt;
                      &lt;button type="button" ng-disabled="rowform.$waiting" ng-click="rowform.$cancel()" class="btn btn-default"&gt;
                          cancel
                      &lt;/button&gt;
                  &lt;/form&gt;
                  &lt;div class="buttons" ng-show="!rowform.$visible"&gt;
                      &lt;button class="btn btn-primary" ng-click="rowform.$show()"&gt;edit&lt;/button&gt;
                      &lt;button class="btn btn-danger" ng-click="deleteUser(user)"&gt;delete&lt;/button&gt;
                  &lt;/div&gt;
              &lt;/td&gt;
          &lt;/tr&gt;
      &lt;/table&gt;
  </code></pre>
  
  <p>and  <strong>controller</strong></p>
  
  <pre><code>.controller('mainCtrl', function($scope, $stateParams, $timeout, userService, categoryService, $filter, $q, verifyDelete, $window, $rootScope, $http, $state, $mdDialog) {
      categoryService.init(function(category_response) {
          $scope.categories = category_response.data.result;
          $scope.category = JSON.parse(JSON.stringify(getCategory($stateParams._id)));
          console.log($scope.category);
      });
  
      function getCategory(id) {
          for (var i = 0; i &lt; $scope.categories.length; i++) {
               console.log(i);
              if ($scope.categories[i]._id === id) {
  
                  return $scope.categories[i];
  
              }
          }
          return {
              name: ''
          };
      }
  
      userService.init(function(user_response) {
          $scope.users = user_response.data.data;
      });
  
  
      $scope.genders = [{
          value: 'male',
          text: 'Male'
      }, {
          value: 'female',
          text: 'Female'
      }];
  
      $scope.loadCategories = function() {
          return $scope.categories.length ? null : $http.get('/api/categories/list').success(function(data) {
              $scope.categories = data;
          });
      };
  $scope.showGender = function(user) {
  var selected = [];
  if(user.gender) {
     selected = $filter('filter')($scope.genders, {value: user.gender});
  }
  return selected.length ? selected[0].text : 'Not set';
   };
  
  
    $scope.showCategories = function(user) {
          var selected = [];
          if (user.category_id) {
              selected = $filter('filter')($scope.categories, {
                  category_id: user.category_id
              });
          }
          console.log(selected);
           return selected.length ? selected[0]._id : 'Not set';
      };
  
    $scope.saveUser = function(user) {
      // console.log(name);
      if(user._id){
  
          $http.put('/api/users/'+user._id, user, $scope)
          .then(function(response) {
            $state.reload();
               }, function(response) {
  
              });
  
      }
      else{
          $http.post('/api/users/', user, $scope)
          .then(function(response) {
              $state.reload();
  
               }, function(response) {
                  $scope.errorMessage=response.data;
                   $scope.errorValMessage = true;
                  $timeout(function () {
                  $scope.errorValMessage = false;
                  }, 2000);
  
  
  
              });
  
      }
   };
  $scope.addUser = function(user) {
  $scope.inserted = {
      name:'',
       gender:null,
       email:'',
       password:'',
      re_password:'',
      category:null
  };
  $scope.users.push($scope.inserted);
  };
  
  
  })
  .run(function(editableOptions) {
      editableOptions.theme = 'bs3';
  });
  </code></pre>
  
  <p><strong>api data for users</strong></p>
  
  <pre><code> {"total_rows":2,"start":0,"data":[{"_id":"572c7696d17dde185e059390","name":"aaaaaaaaaaa","gender":"female","email":"","password":"","re_password":"","category_id":"ordinary"},{"_id":"572c76c3d17dde185e059392","name":"cccccccccc","gender":"male","email":"","password":"","re_password":"","category_id":"ordinary"}]}
  </code></pre>
  
  <p>Can anyone please help me. Thanks in advance</p>