AngularJS Update Database Using X-Editable

So, i'm using AngularJS with X-Editable to make an easier way to edit my data. I have a table with all the information of a client such as name, phone, address, etc.. And I could a

Solution 1:

Well, after some research and a lot of try/fail i cam up with the solution.

in the page page.html i needed to remove the remove the code inside the (), so it is going to be like this:

page.html

<td><span editable-text="cliente.nm_cliente" onaftersave="updatePerson()">{{cliente.nm_cliente || "Empty"}}</span></td>

And on the app.js i needed to use $scope.cliente.nm_cliente instead of $scope.nm_cliente. So the code will be like this:

app.js

$scope.updatePerson = function() {
    $http.post('scripts/php/db.php?action=upd_cliente',
        {
            'id': $routeParams.id,  
            'nm_cliente' : $scope.cliente.nm_cliente,
            'num_tel' : $scope.cliente.num_tel
        }
    ).success(function (data, status, headers, config) {
        //Success code here
    }).error(function (data, status, headers, config) {
        //Error code here
    });
};

Then, on the php file i just need to write the other fields i need to update on the database, in my case, it will be more than 15 fields to be possible to update.

Note: As far as i know, this code only works with the option onaftersave="" because if we use the option onbeforesave="", like the name itself, the data will not be passed since it's being executed before the new data is passed to the $scope.

I'm sorry if any of my information is wrong, i'm starting learning AngularJS right now. But this is working for me.

Also, i don't know if there is a better way to achieve this result, so, if anyone knows, please share it with us!