<div ng-controller="Part1Controller">
<form name="f1" novalidate ng-submit="SaveData(tab1)">
<div style="color:red">
{{meassage}}
</div>
<table>
<tr>
<td class="headder">Enter Employee Name</td>
<td>
<input type="text" name="tName" ng-model="tab1.Name" ng-class="Submitted? 'ng-dirty':''" required autofocus>
<span class="Error" ng-show="(f1.tName.$dirty ||Submitted ) && f1.tName.$error.required">Please Enter Employee Name</span>
</td>
</tr>
<tr>
<td class="headder">Enter Employee EmailId</td>
<td>
<input type="email" name="tEmail" ng-model="tab1.Email" ng-class="Submitted? 'ng-dirty':''" required />
<span class="Error" ng-show="(f1.tEmail.$dirty ||Submitted ) && f1.tEmail.$error.required">Please Enter Your EmailId</span>
</td>
</tr>
<tr>
<td class="headder">Select Your Gender</td>
<td>
<input type="radio" name="tGen" ng-model="tab1.Gender" value="Male" ng-class="Submitted? 'ng-dirty':''" required />Male
<input type="radio" name="tGen" ng-model="tab1.Gender" value="Fe-Male" ng-class="Submitted? 'ng-dirty':''" required />Fe-Male
<span class="Error" ng-show="(f1.tGen.$dirty ||Submitted ) && f1.tGen.$error.required">Plese Select Your Gender</span>
</td>
</tr>
<tr>
<td class="headder">Enter Password</td>
<td>
<input type="password" name="tpsw" ng-model="tab1.Password" ng-class="Submitted? 'ng-dirty':''" required />
<span class="Error" ng-show="(f1.tpsw.$dirty ||Submitted ) && f1.tpsw.$error.required">Plese Enter Your Passwor</span>
</td>
</tr>
<tr>
<td> Country :</td>
<td>
<select ng-model="tab1.CountryName" ng-options="I.CountryID as I.CountryName for I in countryList">
<option value="">Select Country</option>
</select>
</td>
</tr>
<tr>
<td>
<input type="submit" value="{{SubmitText}}" />
</td>
</tr>
</table>
</form>
</div>
angular.module("MyApp",[])
.controller("Part1Controller", function ($scope, Reserve) {
$scope.tab1 = {
Name: '',
Email: '',
Password: '',
Gender: '',
CountryName: '',
StateName: '',
CityName: '',
Image: '',
Active: ''
};
$scope.meassage = '';
$scope.Submitted = false;
$scope.isFormValid = false;
$scope.SubmitText = "Save";
// $scope.countryList = null;
$scope.StateList = null;
$scope.CitiesList = null;
$scope.CountryID = null;
//watch form is valid or not
$scope.$watch('f1.$valid', function (resdata) {
$scope.isFormValid = resdata;
})
//saving form
$scope.SaveData = function (data) {
if ($scope.SubmitText == "Save") {
$scope.meassage = '';
$scope.Submitted = true;
if ($scope.isFormValid) {
$scope.SubmitText = "please Wait....";
Reserve.SaveFormData($scope.tab1)
.then(function (d) {
alert(d)
if (d == "Sucess") {
clearFormData();
}
})
Reserve.GetCountrys()
.then(function (d) {
$scope.countryList = d.data;
}, function (error) {
alert('Error please Review!');
});
$scope.SubmitText = "Save";
}
}
else
$scope.meassage = "Please Insert all columns...";
}
})
.factory("Reserve", function ($http, $q) {
var fac = {};
fac.GetCountrys = function () {
return $http.get('/Home/GetCountrys')
}
fac.SaveFormData = function (data) {
var defer = $q.defer();
$http({
url: '/Home/Create',
method: "POST",
data: JSON.stringify(data),
headers: { 'content-type': 'application/json' }
});
return defer.promise;
}
return fac;
})