xeditable Grid's drop down values cannot change from the outside dropdown

问题

I'm using xeditable angular directive.I need to set the grid's all the drop down values of Status column according to the value of the outside drop down. I have set up the JsFiddle here.But it's not working.Could you tell me Why ? Thanks in advance.

Update: When I click the cancel button then it's updated.Very strange :( Could you tell me how to sort out this issue ?

HTML

<span editable-select="bulkPaymentType" e-form="tableform" e-ng-options="s.value as s.text for s in statuses" e-ng-change="setBulkPaymentType($data)">
 </span>

js

 $scope.setBulkPaymentType = function (data) {
        for (var i = $scope.users.length; i--;) {
            var user = $scope.users[i];
            user.status = data;
        };
    };

JSFiddle

回答1:

I have found the solution.Here it is :)

HTML

<span editable-select="bulkPaymentType" e-form="tableform" e-ng-options="s.value as s.text for s in statuses" e-ng-change="setBulkPaymentType($data,tableform)">
 </span>

JS

$scope.setBulkPaymentType = function (data,tableform) {
        for (var i = 0; i < tableform.$editables.length; i++) {
            if (tableform.$editables[i].name === 'user.status') {
                tableform.$editables[i].scope.$data = data;

            }
        }
    };

Play with it : JSFiddle

回答2:

Your setBulkPaymentType method is updating the users in your controller scope. But the value in the editable input is actually a copy from your controller scope. So when you call setBulkPaymentType, you don't see them change. And when you hit cancel button, the form will display with the value in your controller scope which you updated with setBulkPaymentType, that is the reason. I don't think you can modify the $data within each editable directly since they are using isolated scope. There is no way to get access to $data from outside.

来源：https://stackoverflow.com/questions/31319561/xeditable-grids-drop-down-values-cannot-change-from-the-outside-dropdown