For Example Code:
File name : index.html
<html>
<head>
<script src="http://code.angularjs.org/1.4.8/angular.min.js"></script>
<script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.11.0.js"></script>
<script src="main.js"></script>
</head>
<body ng-app="app" ng-init="getData()" ng-controller="dataCtrl" >
<div>
<form ng-submit="addRow()" method="post">
<label>First Name</label>
<div>
<input type="text" name="firstname" ng-model="firstName" />
</div>
</div>
<label>Last Name</label>
<div>
<input type="text" name="lastname" ng-model="lastName" />
</div>
</div>
<br>
<div>
<div style="padding-left:110px">
<input type="submit" value="Submit" style="border-radius: 30px;padding: 5px 10px;"/>
</div>
</div>
</form>
</div>
<br>
{{message}}
<br><br>
<div>
<table border="1" cellpadding="5">
<tr ng-repeat="x in users">
<td>{{x.firstname}}</td>
<td>{{x.lastname}}</td>
<td><button ng-click="deleteRow(x.id)" style="border-radius: 30px;padding: 5px 10px;">Delete</button></td>
</tr>
</table>
</div>
</body>
</html>
var app = angular.module("app", []);
app.controller("dataCtrl", ['$scope', '$http', function($scope, $http)
{
$scope.users = [{}];
$scope.addRow = function()
{
var firstName = $scope.firstName;
var lastName = $scope.lastName;
if(firstName != "")
{
if(lastName != "")
{
var dataObj = {firstName : firstName, lastName :lastName};
var res = $http.post('add.php', dataObj);
res.success(function(data) {
var data = data;
if(data=="1")
{
$scope.message="Data Added Successfully";
$scope.getData();
}
else if(data=="0")
{
$scope.message="Data not Added Successfully";
}
});
res.error(function(data) {
alert( "Error: " + JSON.stringify({data: data}));
});
$scope.firstName = '';
$scope.lastName = '';
}
else
{
$scope.message="Enter Last Name";
}
}
else
{
$scope.message="Enter First Name";
}
};
$scope.getData = function()
{
$http.get('get.php').then(function(response)
{
console.log(response.data.records);
$scope.users = response.data.records;
});
};
$scope.deleteRow = function(id)
{
var dataObj = {id : id};
var res = $http.post('delete.php', dataObj);
res.success(function(data, status, headers, config) {
var data = data;
if(data=="1")
{
$scope.message="Data Delete Successfully";
$scope.getData();
}
else if(data=="0")
{
$scope.message="Data not Delete Successfully";
}
});
}
}]);
<?php
$mysqli = new mysqli("localhost", "root", "", "users");
?>
<?php
include("dbconfig.php");
$postdata = file_get_contents("php://input");
$request = json_decode($postdata);
$firstName = $request->firstName;
$lastName = $request->lastName;
if($firstName !="" && $lastName != "")
{
$query="INSERT INTO `user`(`id`, `firstname`, `lastname`) VALUES (null,'".$firstName."','".$lastName."')";
$result = $mysqli->query($query);
if($result == 0)
echo "0";
else
echo "1";
}
else
echo "2";
?>
File name : get.php
<?php
include("dbconfig.php");
$query="select * from user";
$result = $mysqli->query($query);
$arr = array();
if($result->num_rows > 0)
{
while($row = $result->fetch_assoc()) { $arr[] = $row; }
}
$ajaxdata = array("records"=>$arr);
echo $json_response = json_encode($ajaxdata);
?>
File name : delete.php
<?php
include("dbconfig.php");
$postdata = file_get_contents("php://input");
$request = json_decode($postdata);
$id = $request->id;
if($id !=""){
$query="delete from `user` where `id`=".$id;
$result = $mysqli->query($query);
if($result == 0)
echo "0";
else
echo "1";
}
else{
echo "2";
}
?>
No comments:
Post a Comment
Thanks to comment our blog. i will contact you as soon as possible