在 ng-repeat | 中获取输入的更新值Angular 杰斯

Question

我在 table 中输入了 ng-repeat，我希望能够通过一次单击获得所有输入的更新值。

我的看法：

<tr ng-repeat="sf in selectedFacture">

        // displaying default values in the input
        <td><input class="facture_item_name" ng-model="sf.facture_item_name" value="{{sf.facture_item_name}}" type="text"/></td>
        <td><input class="fcls_crt" ng-model="sf.fcls_crt" value="{{sf.fcls_crt}}"  type="number"/></td>
        <td><input class="fpiece" ng-model="sf.fpiece" value="{{sf.fpiece}}" type="number"/></td>
        <td colspan="4"><input type="text" class="form-control note" ng-model="sf.note" value="{{sf.note}}"/></td>
    <tr>
        <td ng-click="updateFacture(sf.id,sf,sf.facture_type,sf.item_id)">SUBMIT</td>
    </tr>
</tr>

JS:

// getting new values and send them to server side
$scope.updateFacture=function(id,sf,type,item_id){
        var url = '../php/history.php';
        var func = "updateFacture";

        sf = sf || {};
        var editedQuanCls= sf.fcls_crt,
        editedQuan_piece= sf.fpiece,
        editedQuan_cls_crt_gate= sf.fcls_crt_gate,
        editedQuan_piece_gate= sf.fpiece_gate,
        editedNote= sf.note;

        var data = {"function": func,
            "factureId":id,
            "item_id":item_id,
            "facture_type":facture_type,
            "editedQuanCls":editedQuanCls,
            "editedQuan_cls_crt_gate":editedQuan_cls_crt_gate,
            "editedQuan_piece":editedQuan_piece,
            "editedQuan_piece_gate":editedQuan_piece_gate,
            "editedNote":editedNote};

        var options = {
            type : "get",
            url : url,
            data: data,
            dataType: 'json',
            async : false,
            cache : false,
            success : function(response,status) {
                alert("success")
            },
            error:function(request,response,error){
                alert("errro: " + error)
            }
        };
        $.ajax(options);
    }

我尝试将更新的按钮放在 td 中放在输入旁边，它工作正常，但这将单独更新每一行，但我的需要是一次单击更新它们。

我将附上我的视图的屏幕截图。

非常感谢

Answer 1

您需要的是包装函数。首先在页面上添加一个按钮，覆盖所有选项，如：

 <button ng-click="updateAllFacture()">SUBMIT ALL</button>

然后添加包装函数。所有这一切都是循环遍历列表中的每个项目并调用更新函数。包装函数看起来像：

 $scope.updateAllFacture=function(){

    angular.forEach($scope.res, function(sf, index) {

      $scope.updateFacture=function(sf.id,sf,sf.facture_type,sf.item_id );

    });

  };

如果您有很多物品，那么您的 api 就会收到很多回电。考虑以 post 的形式提交表单中的所有输入 - 然后将只有一个回调，但您需要为此对控制器进行编程。

Answer 2

<input class="facture_item_name" ng-model="sf.facture_item_name" value="{{sf.facture_item_name}}" ng-change="updateValues(sf.facture_item_name)" type="text"/>

$scope.updateValues=function(value){
$scope.sf.facture_item_name=value;
}

在 ng-repeat | 中获取输入的更新值Angular 杰斯

getting the updated value of inputs in ng-repeat | Angular Js

angularjs

angularjs-ng-repeat

angularjs-ng-model