Angular Code:
Controller Code
Controller Code
//Angular application start
public function testForm(){
$this->load->view('backend/angular_form');
}
public function onloaddata(){
$dept_data = $this->Admin_model->get_all_dept();
echo json_encode($dept_data);
}
public function submit_form(){
$jsonData = json_decode(file_get_contents("php://input"));
$dept_data = array(
'dept_id'=>$jsonData->dept_id,
'guideline_txt'=>$jsonData->dept_name
);
$this->db->insert("dept",$dept_data);
$dept_list_data = $this->Admin_model->get_all_dept();
//$postData = json_decode(file_get_contents("php://input"));
echo json_encode($dept_list_data);
}
//Angular application end
View Code<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
</head>
<body ng-app="myApp">
<div ng-controller="bookController">
<form>
Dept Id:-<input ng-model="dept_id" type="text" />
Dept Name:-<input ng-model="dept_name" type="text" />
<input ng-click="insertData()" type="button" value="Submit" />
</form>
<ul>
<li>Id - Name</li>
<li ng-repeat="dept in returnData | orderBy:'dept_id'">
{{"Dept. Id : "+dept.dept_id+" - Dept Name : "+dept.dept_name}}
</li>
</ul>
</div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="<?php echo base_url();?>assets/js/angular/ang_controller.js"></script>
Angular Code
var app = angular.module('myApp',[]);
var appUrl = 'http://localhost:2020/';
app.controller('bookController',function($scope,$http){
$http({
method: "POST",
url: "onloaddata",
dataType: 'json',
data: {},
headers: { "Content-Type": "application/json" }
}).then(function(result) {
//Success
console.log('success');
console.log(result.data);
$scope.returnData = result.data;
}, function(error) {
//Error
console.log('error');
});
$scope.insertData=function(){
$http({
method: "POST",
url: "submit_form",
dataType: 'json',
data: {
'dept_id':$scope.dept_id,
'dept_name':$scope.dept_name
},
headers: { "Content-Type": "application/json" }
}).then(function(result) {
//Success
$scope.returnData = [];
console.log('success');
console.log(result.data);
$scope.returnData = result.data;
}, function(error) {
//Error
console.log('error');
});
}
});
No comments:
Post a Comment