I am doing it in angular js and this is kind of exersice but i am stuck. I am new to angularjs. What i am doing is sending the post and get to the same php page and use a switch to execute the appropriate code. But when i execute it i get the error:
angular.js:12520 SyntaxError: Unexpected token < in JSON at position 0
I have 2 questions,
1. Why am i getting this error? What did i do wrong
2. I have turned error reporting on and yet i dont get any errors. Why?
Forgive me if u see something stupid in my code and help me make it better.
AngDemo.html:
<!DOCTYPE html>
<html>
<head>
<title>AngularJS Demo</title>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js">
</script>
<style type="text/css">
table, th , td {
border: 1px solid grey;
border-collapse: collapse;
padding: 5px;
}
table tr:nth-child(odd) {
background-color: #f1f1f1;
}
table tr:nth-child(even) {
background-color: #ffffff;
}
</style>
</head>
<body ng-app="demoFile">
<div ng-controller="frmCntrl" ng-init="showTable=false">
<form>
<p> First Name:  <input type="text" ng-model="fnameAng" /> </p>
<p> Last Name:  <input type="text" ng-model="lnameAng" /> </p>
<p> Age:      <input type="number" ng-model="ageAng" /> </p>
<p> Department:
  <select ng-model="deptAng">
<option value="">
<option value="software">Software
<option value="hr">HR
<option value="tele-marketing">Tele-Marketing
<option value="database">Database
</select>
</p>
<input type="submit" value="Submit" data-ng-click="insertData()" />
<input type="reset" value="Reset" data-ng-click="resetData()" />
</form><br>
<table>
<thead ng-show="showTable">
<th>First name</th>
<th>Last name</th>
<th>Age</th>
<th>Department</th>
<thead>
<tbody>
<tr ng-repeat="x in names">
<td>{{x.fname}}</td>
<td>{{x.lname}}</td>
<td>{{x.age}}</td>
<td>{{x.dept}}</td>
</tr>
</tbody>
</table>
</div>
</body>
<script>
var app= angular.module('demoFile', []);
app.controller('frmCntrl',function($scope,$http){
$scope.insertData=function(){
$http.post("addData.php",{
'fnameAng':$scope.fnameAng,
'lnameAng':$scope.lnameAng,
'ageAng':$scope.ageAng,
'deptAng':$scope.deptAng,
}).then(function(response){
console.log("response.data");});
$scope.showTable=true;
$http.get("addData.php")
.then(function(response){
$scope.names=response.data.records;});
};
$scope.resetData=function(){
$scope.fnameAng="";
$scope.lnameAng="";
$scope.ageAng="";
$scope.deptAng="";
}
});
/*
app.controller('tableCntrl',function($scope,$http){
$http.get("select.php")
.then(function(response){
$scope.names=response.data.records;
})
});*/
</script>
</html>
addData.php:
<?php
header("Access-Control-Allow-Origin: *");
header("Content-Type: application/json; charset=UTF-8");
ini_set('display_startup_errors',1);
ini_set('display_errors',1);
error_reporting(-1); //Initializing error reporting
$uname="root";//initialzing and connecting to database
$pass="";
$dname="phptut";
mysql_connect("localhost", $uname, $pass);
@mysql_select_db($dname) or die("Cannot open Database");
$method=$_SERVER['REQUEST_METHOD'];//determining the type of request
switch($method)
{
case 'POST':{
echo $method;
$data=json_decode(file_get_contents("php://input"));
$fname=$data->fnameAng;
$lname=$data->lnameAng;
$age=$data->ageAng;
$dept=$data->deptAng;
$result = mysql_query("INSERT INTO anginfo (fname, lname, age, dept) VALUES ('$fname','$lname',$age,'$dept')");
break;
}
case 'GET': {
$result = mysql_query("SELECT fname, lname, age, dept from anginfo");//executing query
$output=array();//converting the result object to json
while($r = mysql_fetch_assoc($result))
{
$output[] = $r;
}
$json=json_encode($output);
$json='{"records":'.$json.'}';
echo($json);
}
}
mysql_free_result($result);
mysql_close();
?>
