Alerting Numbers or Characters only input values in text box? How in AngularJS?
I want to add functionality that when someone put a numbers in the countryname text box. The program will alert "Input country name not numbers". In contrast with the zip code "Input zip code not name"
Here is my code...
<!DOCTYPE html>
<html>
<head>
<title>Country Listings</title>
<link rel="stylesheet" href="css/bootstrap.min.css" />
<script src="js/angular.min.js"></script>
</head>
<body>
<div class="container" style="width:500px;">
<h1 align="center">Countries</h1>
<div ng-app="myapp" ng-controller="countrycontroller" ng-init="displayData()">
<label>Search: </label>
<input type="text" ng-model="searchBox" class="form-control">
<br />
<label>Country Name</label>
<input type="text" name="country_name" ng-model="countryname" class="form-control" value="{{countryname}}" required="" />
<br />
<label>Zip Code</label>
<input type="text" name="zip_code" ng-model="zipcode" class="form-control" required="" />
<br />
<input type="hidden" ng-model="id" />
<input type="submit" name="btnInsert" class="btn btn-info" ng-click="insertData()" value="{{btnName}}"/>
<br /><br />
<table class="table table-bordered">
<tr>
<th>ID</th>
<th>Country Name</th>
<th>Zip Code</th>
<th colspan="2">Actions</th>
</tr>
<tr ng-repeat="x in names | filter:searchBox">
<td class="tbl">{{x.id}}</td>
<td class="tbl">{{x.country_name}}</td>
<td class="tbl">{{x.zip_code}}</td>
<td class="tbl"><button ng-click="updateData(x.id, x.country_name, x.zip_code)" class="btn btn-info btn-xs">Edit</button></td>
<td class="tbl"><button ng-click="deleteData(x.id )" class="btn btn-danger btn-xs">Delete</button></td>
</tr>
</table>
</div>
</div>
</div>
</body>
</html>
<script>
var app = angular.module("myapp",[]);
app.controller("countrycontroller", function($scope, $http){
$scope.btnName = "Submit";
$scope.insertData = function(){
if($scope.countryname == null)
{
alert("Country Name is required");
}
else if($scope.zipcode == null)
{
alert("Zip Code is required");
}
else
{
$http.post(
"insert.php",
{'countryname':$scope.countryname, 'zipcode':$scope.zipcode, 'btnName':$scope.btnName, 'id':$scope.id}
).success(function(data){
alert(data);
$scope.countryname = null;
$scope.zipcode = null;
$scope.btnName = "Submit";
$scope.displayData();
});
}
}
$scope.displayData = function(){
$http.get("select.php")
.success(function(data){
$scope.names = data;
});
}
$scope.updateData = function(id, first_name, last_name){
$scope.id = id;
$scope.countryname = first_name;
$scope.zipcode = last_name;
$scope.btnName = "Edit";
}
$scope.deleteData = function(id){
if(confirm("Are you sure you want to delete this data?"))
{
$http.post("delete.php", {'id':id})
.success(function(data){
alert(data);
$scope.displayData();
});
}
else
{
return false;
}
}
});
</script> I've tried adding another else if ($scope.countryname = [0-9]), bubt it didn't work. Please help... I also tried editing my insert.php but no lack.
index.php
<?php
$connect = mysqli_connect("localhost", "root", "", "testing");
$data = json_decode(file_get_contents("php://input"));
if(count($data) > 0)
{
$country_name = mysqli_real_escape_string($connect, $data->countryname);
$zip_code = mysqli_real_escape_string($connect, $data->zipcode);
$btn_name = $data->btnName;
if($btn_name == "Submit")
{
$query = "INSERT INTO tbl_user(country_name, zip_code) VALUES ('$country_name', '$zip_code')";
if(mysqli_query($connect, $query))
{
echo "Data Inserted...";
}
else
{
echo 'Error';
}
}
if($btn_name == 'Edit')
{
$id = $data->id;
$query = "UPDATE tbl_user SET country_name = '$country_name', zip_code = '$zip_code' WHERE id = '$id'";
if(mysqli_query($connect, $query))
{
echo 'Data Updated...';
}
else
{
echo 'Error';
}
}
}
?> </div>
