使用X-编辑AngularJS更新数据库(AngularJS update database usi

所以，我使用AngularJS与X-Editable进行编辑我的数据更简单的方法。

我有一个客户端，如姓名，电话，地址等所有信息的表..我可以申请X-Editable就好了，直到那一刻，我需要真正保存编辑的数据库。

此外，该页面只显示一个单一的客户端，是一个单独的客户端页面，只有他的细节。

这是我使用的代码：

page.html中

<table fixed-header class="detcli_table" ng-init="get_detcliente()">
    <thead>
        <tr>
            <th>Campo</th>
            <th>Informação</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Código</td>
            <td>{{cliente.id}}</td>
        </tr>
        <tr>
            <td>Nome</td>
            <td><span editable-text="cliente.nm_cliente" onaftersave="updatePerson(cliente.nm_cliente)">{{cliente.nm_cliente || "Empty"}}</span></td>
        </tr>
        <tr>
            <td>Tel.</td>
            <td><span editable-text="cliente.num_tel" onaftersave="updatePerson(cliente.num_tel)">{{cliente.num_tel || "Empty"}}</span></td>
        </tr>
        [... more code ...]
    </tbody>
</table>

app.js

myApp.controller('DetClientesCtrl', ['$scope', '$http', '$routeParams', function ($scope, $http, $routeParams) {

    var clienteId = $routeParams.id;

    $scope.get_detcliente = function() {
        var url = 'scripts/php/db.php?action=get_cliente';
        return $http.get(url).success(httpSuccess).error(function() {
            alert("Oops, erro!");
        });
    }
    httpSuccess = function(response) {
        $scope.detRes = response;
    }
    function getById(arr, id) {
        for (var d = 0, len = arr.length; d < len; d += 1) {
            if (arr[d].id === id) {
                return arr[d];
            }
        }
    }
    $scope.get_detcliente().then(function(){
        $scope.cliente = getById($scope.detRes,$routeParams.id);
    });

    //Update Client
    $scope.updatePerson = function() {
        $http.post('scripts/php/db.php?action=upd_cliente',
        {
            'id': $routeParams.id,
            'nm_cliente' : $scope.nm_cliente,
            'num_tel' : $scope.num_tel
        }
        ).success(function (data, status, headers, config) {
            $scope.get_detcliente();
            console.log("efeutou o post!");
        }).error(function (data, status, headers, config) {
            console.log("Algo deu errado!");
        });
    };
}]);

control.php
这是我使用添加新数据，删除，在这种情况下，更新现有数据的方法

function upd_cliente() {
    $data = json_decode(file_get_contents("php://input"));
    $id = $data->id;
    $nm_cliente = $data->nm_cliente;
    $num_tel = $data->num_tel;

    $qry = "update cad_cliente set nm_cliente = '$nm_cliente', num_tel = '$num_tel' where cd = '$id'";

}

当我运行的代码，我没有错误可言。在console.log我使用的是正确显示在控制台中，编辑我做的，是工作在屏幕上很好，但是当我刷新页面，没有数据保存，它可以追溯到以前的数据。

什么可能是错误的？

而且我不知道这是否是做的最好的办法，因为我有一个表约10至15行的信息，因此，如果我只是编辑1或5行，代码将不得不为每个编辑运行我做。

有没有更好的方式来处理呢？

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!