Angular.js xeditable $http.post data processing - php

Question

I need to edit the data to db and make it a view on instant and using angular xeditables, but i am unable to pass the data to process.php (to update the db and retrieve back the data)
How can I pass the data using $http.post
Code snippet
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
<script src="http://code.angularjs.org/1.0.8/angular-mocks.js"></script>
<link href="angular-xeditable-0.1.8/css/xeditable.css" rel="stylesheet">
<script src="angular-xeditable-0.1.8/js/xeditable.js"></script>
<script>
var app = angular.module("app", ["xeditable", "ngMockE2E"]);
app.run(function(editableOptions) {
editableOptions.theme = 'bs3';
});
app.controller('Ctrl', ['$scope','$filter','$http', function($scope, $filter,$http) {
$scope.user = {
name: 'awesome user',
status: 2,
group: 4
};
$scope.statuses = [
{value: 1, text: 'status1'},
{value: 2, text: 'status2'},
{value: 3, text: 'status3'},
{value: 4, text: 'status4'}
];
$scope.groups = [
{value: 1, text: 'user'},
{value: 2, text: 'customer'},
{value: 3, text: 'vip'},
{value: 4, text: 'admin'}
];
$scope.errors = [];
$scope.msgs = [];
$scope.saveUser = function()
{ // $scope.user already updated!
return $http.post('/saveUser', $scope.user).error(function(err) {});
$scope.errors.splice(0, $scope.errors.length); // remove all error messages
$scope.msgs.splice(0, $scope.msgs.length);
$http.post('include/process.php', {'name': $scope.name, 'status': $scope.status, 'group': $scope.group}
).success(function(data, status, headers, config) {
if (data.msg != '')
{
$scope.msgs.push(data.msg);
}
else
{
$scope.errors.push(data.error);
}
}).error(function(data, status) { // called asynchronously if an error occurs
// or server returns response with an error status.
$scope.errors.push(status);
});
};
}]);
app.run(function($httpBackend) {
$httpBackend.whenPOST(/\/saveUser/).respond(function(method, url, data) {
data = angular.fromJson(data);
});
});
</script>
HTML
.....
<div ng-app="app" ng-controller="Ctrl">
<form editable-form name="editableForm" >
<ul>
<li class="err" ng-repeat="error in errors"> {{ error}} </li>
</ul>
<ul>
<li class="info" ng-repeat="msg in msgs"> {{ msg}} </li>
</ul>
<div class="pull-right">
<!-- button to show form -->
<button type="button" class="btn btn-default btn-sm" ng-click="editableForm.$show()" ng-show="!editableForm.$visible"> Edit </button>
<!-- buttons to submit / cancel form -->
<span ng-show="editableForm.$visible">
<button type="submit" class="btn btn-primary btn-sm" ng-disabled="editableForm.$waiting" onaftersave="saveUser()"> Save </button>
<button type="button" class="btn btn-default btn-sm" ng-disabled="editableForm.$waiting" ng-click="editableForm.$cancel()"> Cancel </button>
</span> </div>
<div>
<!-- editable username (text with validation) -->
<span class="title">User name: </span> <span editable-text="user.name" e-id="myid" e-name="name" e-required>{{ user.name || 'empty' }}</span>
</div>
<div>
<!-- editable status (select-local) -->
<span class="title">Status: </span> <span editable-select="user.status" e-name="status" e-ng-options="s.value as s.text for s in statuses"> {{ (statuses | filter:{value: user.status})[0].text || 'Select' }} </span> </div>
<div>
<!-- editable group (select-remote) -->
<span class="title">Group: </span> <span editable-select="user.group" e-name="group" e-ng-options="g.value as g.text for g in groups"> {{ (groups | filter:{value: user.group})[0].text || 'Select' }} </span> </div>
</form>
</div>
....
PROCESS.PHP
<?php
$data = json_decode(file_get_contents("php://input"));
$name = mysql_real_escape_string($data->name);
$status = mysql_real_escape_string($data->status);
$group = mysql_real_escape_string($data->group);
if ($group == 'vip') {
if ($qry_res) {
$arr = array('msg' => "User Created Successfully!!!", 'error' => '');
$jsn = json_encode($arr);
print_r($jsn);
} else {
$arr = array('msg' => "", 'error' => 'Error In inserting record');
$jsn = json_encode($arr);
print_r($jsn);
}
} else {
$arr = array('msg' => "", 'error' => 'User Already exists with same email');
$jsn = json_encode($arr);
print_r($jsn);
}
?>

Answer 1

I don't know if it would be useful to you or someone else.
Afaik, you cannot use http.post with angular to update a database (at least in my case, with php and mysql). You need to use $http() like follows:
var request = $http({
method: "post",
url: "include/process.php",
data: {
name: $scope.name,
status: $scope.status,
group: $scope.group
},
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
});
Then, in PHP, retrieve it like:
<?php
$postdata = file_get_contents("php://input");
$request = json_decode($postdata);
#$name = $request->name;
#$status = $request->status;
#$group = $request->group;
...
?>
With the values at $name, $status and $group you'll be able to update your database.
UPDATE: Your process.php is not called because you have a "return $http.post('/saveUser', $scope.user)" line first in $scope.saveUser = function(), which immediately ends execution of the saveUser function. See return statement in Javascript:
When a return statement is called in a function, the execution of this function is stopped. If specified, a given value is returned to the function caller. If the expression is omitted, undefined is returned instead.