How to not send an $http request if the inputs are empty[solved]

i have an $http request.when i press the button,the request is fired.but i want to block the request if the form’s inputs are empty.in the inputs i tried with Required.but it didn’t work
here’s my code

controller code


$scope.submit=function()
{

var loginServiceUrl = 'https://www.yabiladi.com/newsapi/login.json';
var loginServiceData = {
    user: $scope.username,
    password: $scope.password
}

$http.post(loginServiceUrl, loginServiceData).
    then(function (res){
        $scope.drapeau=0;
        console.log(res);
        $scope.user=res.config.data.user;
        
    }).catch(function(response){
            //rien   
})
                
}

html code



  <div ng-if="flag==2" ng-controller="loginCtrl">
<div ng-show="drapeau">
        <label for="field1"><span>Username:</span>    <div class="loginform"><input type="text"  class="input-field" name="field1" value="" ng-model="username"  /></div></label>
           <label for="field2"><span>Password:</span><div  class="loginform"><input type="password" class="input-field" name="field2" value="" ng-model="password" /></div></label>
         <div class="boutonlogin">
            <button class="button  button-energized button-small" ng-click="submit()" style="width:80px">Login</button>
         </div>
            <label>
            <b><center>if you don't have an account,you can signup</center></b>
            </label>
             <div class="boutonlogin">
             <button class="button  button-energized button-small" ng-href="#/signup/{{flag}}" style="width:80px" ng-click="modal.hide()">Signup</button>

             </div>
 
  </div>
            <div ng-hide="drapeau">
user connected :    {{user}}
 </div>
  </div>

as you see in the html code,the submit function is in ng-click.how to disable it or block the request if the inputs are empty

thank you

i put required on the inputs and in the button ng-disable="myform.$invalid"
thanks anyway

1 Like