Project Structure:
Project Structures |
crud-main.php
<!DOCTYPE html>
<html ng-app="app">
<head>
<title>Angular CRUD Apps</title>
<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.css">
<script type="text/javascript" src="angular.js"></script>
<script type="text/javascript" src="curd-main.js"></script>
</head>
<body>
<div ng-controller="Main">
<div class="row">
<div class="col-md-10 col-md-offset-1">
<p class="bg-primary">By: Ram Pukar. Web Developer</p>
</div>
<div class="col-md-5 col-md-offset-1">
<table class="table table-bordered">
<tr>
<th>First Name:</th>
</tr>
<tr>
<td>
<input type="hidden" class="form-control" placeholder="Type id" ng-model="getid"/>
<input type="text" class="form-control" placeholder="Type First Name" ng-model="firstname"/>
</td>
</tr>
<tr>
<th>Last Name:</th>
</tr>
<tr>
<td><input type="text" class="form-control" placeholder="Type Last Name" ng-model="lastname"/></td>
</tr>
<tr>
<td><button class="btn btn-primary" ng-click="save()">Save</button></td>
</tr>
</table>
</div>
<div class="col-md-5">
<table class="table table-bordered">
<thead>
<tr>
<th colspan="4">Data Lists:</th>
</tr>
<tr>
<th>#</th>
<th>FIRST NAME</th>
<th>LAST NAME</th>
<th>ACTION</th>
</tr>
</thead>
<tbody ng-init="getall()">
<tr ng-repeat="dataset in datarecored">
<td>{{dataset.id}}</td>
<td>{{dataset.firstname}}</td>
<td>{{dataset.lastname}}</td>
<td>
<button class="btn btn-danger btn-sm" ng-click="delete(dataset.id)">
<span class="glyphicon glyphicon-remove" aria-hidden="true"></span> Delete
</button>
<button class="btn btn-success btn-sm" ng-click="byid(dataset.id)">
<span class="glyphicon glyphicon-edit" aria-hidden="true"></span> Edit
</button>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</body>
</html>
----------------------------------------------------------------------
curd-main.js
var app = angular.module('app',[]);
app.controller("Main",function($scope,$http){
$scope.save = function(){
var jsData = {
'get_id':$scope.getid,
'get_firstname':$scope.firstname,
'get_lastname':$scope.lastname,
'get_action':'save'
}
$http.post('config.php',jsData).success(function(data,stauts){
$scope.getall();
$scope.getid='';
$scope.firstname='';
$scope.lastname='';
});
}
$scope.delete = function(id){
var jsData = {
'get_id':id,
'get_action':'delete'
}
if(confirm('Are Your Sure Delete ?')){
$http.post('config.php',jsData).success(function(data,status){
$scope.getall();
})
}
}
$scope.byid = function(id){
var jsData = {
'get_id':id,
'get_action':'byid'
}
$http.post('config.php',jsData).success(function(data,status){
$scope.getid = data.result[0].id
$scope.firstname= data.result[0].firstname
$scope.lastname= data.result[0].lastname
})
}
$scope.getall=function(){
var jsData = {
'get_action':'selectall'
}
$http.post('config.php',jsData).success(function(data,status){
$scope.datarecored = data.result
})
}
})
--------------------------------------------------------------
config.php
<?php
function setDb(){
$dbCon = mysql_connect('localhost','root','');
mysql_select_db('db_school',$dbCon);
return $dbCon;
}
$postData = file_get_contents("php://input");
$decode = json_decode($postData);
switch ($decode->get_action) {
case 'save':
saveUpdate($decode->get_id,$decode->get_firstname,$decode->get_lastname);
break;
case 'byid':
selectBy($decode->get_id);
break;
case 'delete':
deleteData($decode->get_id);
break;
default:
getAll();
}
function saveUpdate($id,$firstname,$lastname){
if(empty($id)){
$sql = "INSERT into crud_ng(firstname,lastname) VALUES ('$firstname','$lastname')";
} else {
$sql = "UPDATE crud_ng SET firstname='$firstname',lastname='$lastname' WHERE id='$id'";
}
mysql_query($sql,setDb());
}
function getAll(){
$datArr = array();
$sql = "select * from crud_ng order by id desc";
$result = mysql_query($sql,setDb());
while($row = mysql_fetch_assoc($result)){
$datArr[] = $row;
}
echo json_encode(array('result'=>$datArr));
}
function deleteData($id){
$sql = "DELETE FROM crud_ng WHERE id='$id'";
mysql_query($sql,setDb());
}
function selectBy($id){
$datArr = array();
$sql = "select * from crud_ng where id = '$id'";
$result = mysql_query($sql,setDb());
while($row = mysql_fetch_assoc($result)){
$datArr[] = $row;
}
echo json_encode(array('result'=>$datArr));
}
?>
---------------------------------------------------------------------------------
crud_ng.sql
CREATE TABLE IF NOT EXISTS `crud_ng` (
`id` int(11) NOT NULL,
`firstname` varchar(50) DEFAULT NULL,
`lastname` varchar(50) DEFAULT NULL
) ENGINE=InnoDB AUTO_INCREMENT=34 DEFAULT CHARSET=latin1;
----------------------------------------------------
Demo:
----------------------------------------------------
Download Code
0 comments:
Post a Comment