Simple Angular Form Validation PHP MySQLi
Today, We want to share with you Simple Angular Form Validation PHP MySQLi.
In this post we will show you AngularJS Form Validation Example, hear for AngularJS Signup/Register using PHP/MySQLi we will give you demo and example for implement.
In this post, we will learn about AngularJS CRUD: Example Using MySQLi Database with an example.
what is Validation?
The Simple Validation is a process of checking(validate or not) something against a standard way.
what is AngularJS Validation?
AngularJS can true or validate input data.It’s main used check client side data valid or not.Means client-side form validation.
therefor,a Client-side(browser side) validation cannot secure user input(data).Server side(backend) validation is also required.
Input States:
1-$untouched: The defined field has not been touched yet. return value can be boolean true or false.
2-$touched: The defined field has been touched. return value can be boolean true or false.
3-$pristine: The defined field has not been modified yet. return value can be boolean true or false.
4-$dirty: The defined field has been modified. return value can be boolean true or false.
5-$invalid: The defined field content is not valid. return value can be boolean true or false.
6-$valid: The defined field content is valid. return value can be boolean true or false.
Form States:
1-$pristine: There are No fields have been modified yet. return value can be boolean true or false.
2-$dirty: It’s One or more have been modified. return value can be boolean true or false.
3-$invalid: The HTML form content is not valid. return value can be boolean true or false.
4-$valid: The HTML form content is valid. return value can be boolean true or false.
5-$submitted: The HTML form is submitted. return value can be boolean true or false.
AngularJS Form Validation Example Explanation:
First of all an include the AngularJS library in the your Application.
Second The ng-app directive initializes the Your application.
now We are using validating name and email both input fields here.
For name(username) field the ng-show directive show the error message (display error)
if the input field has been touched & is empty(input fields empty).
For email(email address) field the ng-show directive valid show the error message (required)
if the input field has been touched and display message not a valid email address(valied email).
Sample HTML page – index.html page
[php]
{{result}}
[/php]
javascript file formjs.js
[php]
//include Module in application
var app = angular.module(‘form_Example’, []);
//include controller in application
app.controller(“userformCtrl”, [‘$scope’, ‘$http’, function($scope, $http) {
$scope.url_name = ‘form_submit.php’;
$scope.user_formsubmit = function(isValid) {
if (isValid) {
//using POST method submit form in angularjs
$http.post($scope.url_name, {“user_name”: $scope.name, “user_email”: $scope.email, “user_message”: $scope.message}).
success(function(data, status) {
console.log(data);
$scope.status = status;
console.log(“Angularjs Form valid success”);
$scope.data = data;
$scope.result = data; // Show all result from server in our
element
})
}else{
alert(‘Angularjs Form is not valid’);
}
} }]);
[/php]
