Form validation popup window message works only if

Question

I have a form which need to show validation error popup window message if clicked submit. Here is my form.

 <form ng-submit="register(user)">
<div class="list">
  <label class="item item-input">
    <input type="text" placeholder="First Name" ng-model="user.first" >
  </label>
  <label class="item item-input">
    <input type="text" placeholder="Last Name" ng-model="user.last">
  </label>
</div>
<button class="button button-positive">
  button-positive
</button>
</form>

Here is the validation controller file

 angular.module('starter.controllers',[])

.controller('DashCtrl', function($scope,$ionicPopup,Friends) {


    $scope.register=function(user){
      if(!user.first){ $ionicPopup.alert({
                       title: 'First Name Required!',
                       template:'Firstname'
                       });
      }else{
            if(!user.last){
                           $ionicPopup.alert({
                           title: 'Last Name Required!',
                           template:'Lastname'
                           });
              }else {


                        Friends.setall(user).then(function(msg){
                             console.log("From server"+msg.data);

                          });
              }

        }
    }

})

Validation works normally when start making changes. But it doesn't show any error messages If clicked submit without entering anything.How can i achieve this? also i want to show loading screen for the server request and it is dissmissed when the server request is complete.I am using ionicframework,and i know ionic.loading is used for this but How can i properly used this in my code?.Please help.

Answer 1

For the validation part of your question, I would just check for user along with user.firstname:

if(!user || !user.first){ $ionicPopup.alert({
  title: 'First Name Required!',
  template:'Firstname'
});

and you can use $ionicLoading, after injecting it into the controller, like this:

else {
  $ionicLoading.show({ template: 'Loading...' });
  Friends.setall(user).then(function(msg){
    console.log("From server"+msg.data);
    $ionicLoading.hide();
  });
}