Validation still saves null fields in DB - angularjs

Question

I'm a newbie to AngularJS. I need to validate the fields so when the user types empty information, the error is shown and data still does not save into DB. If information is valid then ofcourse it must be saved into my DB
The messages works fine, however content still gets saved if the user leaves empty fields and hits submit.
Below is my validation of the controller:
app.controller('addContactCtrl', ['$scope', '$http', function($scope, $http)
{
$scope.newContact = function(contact) {
$scope.queryMsg= ""; //displays if sent or not in html form
//post is used to create
$http.post('model/addContact.php', contact).success(function(data) {
if (data && contact != "")
{//row inserted into table
$scope.queryMsg = "Query has been sent successfully.";
$scope.contact = "";
}
else
{
$scope.queryMsg = "Fields cannot be left empty.";
}
})
};
}
]);
Thanks for your help!

Answer 1

I would validate on the form.
The submit button will be disabled until the form is valid, you can use ng-messages to show a message.
you can read more about it https://scotch.io/tutorials/angularjs-form-validation
<form name="myForm">
<input ng-model="data" required>
<input ng-model="contact" required>
<button ng-disabled myform.$invalid >submit</button>
</form>

Answer 2

You might need to validate it before posting the data. You doing validation after post. Please try this
app.controller('addContactCtrl', ['$scope', '$http', function($scope, $http)
{
$scope.newContact = function(contact) {
$scope.queryMsg= ""; //displays if sent or not in html form
//post is used to create
if (contact != "") {
$http.post('model/addContact.php', contact).success(function(data) {
if (data){
$scope.queryMsg = "Query has been sent successfully.";
}
})
} else {
$scope.queryMsg = "Fields cannot be left empty.";
}
};
}
]);