config.php
<?php 
	define("base_path","http://localhost/AngularJs/FormUsingPhpMysql/Crud_Operation/");
	define("host","localhost");
	define("user","root");
	define("password","");
	define("database","angularjs");
	mysql_connect(host,user,password);
	mysql_select_db(database);


?>



index.php

<?php include_once("config.php"); ?>
<div ng-app="crudOperationApp" ng-controller="crudOperationController" ng-init="init()" ng-cloak="">
<table>
<form action="">
 <input type="hidden" id="base_path" value="<?php echo base_path; ?>">
<tr>
     <td>Name:</td><td><input type="text" id="name" ng-model="empuser.name"></td>
</tr>
<tr>
     <td>Email:</td><td><input type="text" id="email" ng-model="empuser.email"></td>
</tr>
<tr>
     <td>Company Name:</td><td><input type="text" id="name" ng-model="empuser.companyname"></td>
</tr>
<tr>
     <td>Designation :</td><td><input type="text" id="name" ng-model="empuser.designation"></td>
</tr>
<tr>
      <td><input type="button" ng-click="saveuser()" value="Submit"></td>
</tr>

</form>
</table>
<table align="center">
<tr><td>Id</td><td>Name</td><td>Email</td><td>Company Name </td><td>Designation</td></tr>
<tr ng-repeat="user in users">
	<td >{{ user.id }}</td>
        <td >{{ user.name }}</td>
        <td >{{ user.email }}</td>
        <td >{{ user.companyName }}</td>
        <td >{{ user.Designation }}</td>
</tr>
</table>
</div>
	<script src="js/jquery.min.js"></script>
	<script src="js/bootstrap.min.js"></script>
	<script src="js/angular.min.js"></script>
	<script src="js/angular-custom.js"></script>

ajax.php

<?php
	include_once("config.php");
	
	if(@$_POST['type']=='save_user'){
		$name = $_POST['emp']['name'];
		$email = $_POST['emp']['email'];
		$companyname = $_POST['emp']['companyname'];
		$designation = $_POST['emp']['designation'];
		$insert = "insert into employee(name,email,companyName,designation) 
                                values('$name','$email','$companyname','$designation')";
		if(mysql_query($insert))
		{
			$data['success'] = true;
		}else{
			$data['success'] = false;
		}
		$data['query']=mysql_query($insert) or die(mysql_error());
		echo json_encode($data);
		exit();
	}
	if(@$_POST['type']=='get_user'){

		$select = "select * from employee";
		$mq = mysql_query($select);
		while($mfa = mysql_fetch_assoc($mq)){
			$data[] = $mfa;
		}
		echo json_encode($data);
		exit();
	}

?>


angular-custom.js

$appModule= angular.module("crudOperationApp",[]);
var base_path = document.getElementById('base_path').value;
$appModule.controller("crudOperationController",function($scope,$http){
	$scope.empuser={};
	$scope.post = {};
	$scope.users = [];
	$scope.saveuser = function(){
		path = base_path+'ajax.php';
		$http({
				method:'post',
				url:path ,
				data:$.param({'emp':$scope.empuser,'type':'save_user'}),
				headers:{'Content-Type':'application/x-www-form-urlencoded'}
		}).success( function(data,status,headers,config){
                                $scope.getdata();
		}).error(function(data ,status, headers, config){

		});
		//alert($scope.empuser.name);
	};
	$scope.getdata = function(){
		$http({
			method:'post' ,
			url: 'http://localhost/AngularJs/FormUsingPhpMysql/Crud_Operation/ajax.php' ,
			data:$.param({'type':'get_user'}) ,
			headers:{'Content-Type':'application/x-www-form-urlencoded'} ,
		}).success( function(data , status , headers , config){
			$scope.users = data;
			console.log(data.data);
			//alert("hello");
		}).error(function(data , status , headers , config){

		});
	};
        $scope.getdata();
});                    
                

Comment