UIB-选项卡-更改http成功

Question

I have modal box, and in modal box I have tabs. On first tab, I need to select items, and assign it to user when click button NEXT. If success, automatically change next tab where is config for that items. If server response with error, stay on same tab.

here is my modal box html

<div class="modal fade" id="myModal2" data-toggle="modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel2" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content" style="width: 650px;">

                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                </div>
                <uib-tabset active="active">
                    <uib-tab index="0" heading="Select benches">

                        <div class="modal-body">
                            <label for="type" class="col-sm-3 control-label">Selected buyers: </label>someone@gmail.com

                            <div class="tablicaPridruzivanjeKlupaKlijentu">
                                <div style="padding-top: 10px;">
                                    <button ng-click="oznaciSve()" ng-model="option">check all</button>
                                    <button ng-click="odznaciSve()">uncheck all</button>
                                </div>
                                <form name="addingBench">
                                    <table class="table" style="width: 100%">
                                        <thead>
                                            <tr class='active'>
                                                <th>Select items</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr ng-repeat="bench in freeBenchesForDistributors">
                                                <th>
                                                    <input type="checkbox" checklist-model="selected.freeBenchesForDistributors" checklist-value="bench.id">
                                                    {{items.id}}
                                                </th>
                                            </tr>
                                        </tbody>
                                    </table>
                                </form>
                            </div>
                        </div>
                    </uib-tab>
                    <uib-tab index="1" heading="Config">
                        <h6 style="padding-left: 10px;"><b>Info}</b></h6>
                        <form editable-form name="tableformConfig" shown="true" onaftersave="sendBenchAndConfigDistributors()" oncancel="cancel()">
                            <table class="table tableDistributorConfig col-sm-12" style="width: 100%">
                                <thead>
                                <th>
                                    <button type="button" class="btn btn-default" ng-show="!tableformConfig.$visible" ng-click="tableformConfig.$show()">
                                        Edit
                                    </button>
                                </th>
                                </thead>

                                <thead> 
                                <th>
                                    <button type="submit" ng-show="tableformConfig.$visible" ng-disabled="tableformConfig.$waiting" class="btn btn-primary">
                                        Save
                                    </button>
                                </th>
                                </thead>

                            </table> 
                        </form>
                    </uib-tab>
                </uib-tabset>
                <div class="modal-footer">
                    <button ng-hide="enable" type="button" class="btn btn-default btn-sm" ng-click="active = 1; change(); itemsForClient()">Next</button>
                    <button ng-click="changeBackNext()" type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
            </div>

        </div>

    </div>

and my controller with

$scope.itemsForClient = function () {
        var data = [];
        angular.forEach($scope.selected.freeItemsForDistributors, function (key, value) {
            data.push({id: key, distributor: $rootScope.selectedDistributorsIdForAddingItems});
        });
        var json = JSON.stringify(data);
        var config = {
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
                'X-HTTP-Method-Override': 'PATCH'
            }
        };

        $http.post(serviceBase + 'control-board/items/bulk', data, config)
                .success(function (data, status, headers, config) {
                    Notification.success({message: $filter('translate')('ITEMS_ADDED_SUCCESSFULLY'), delay: 3000, positionY: 'bottom', positionX: 'right'});
                })
                .error(function (data, status, header, config) {
                    Notification.error({message: $filter('translate')('ITEMS_ADDED_ERROR'), positionY: 'bottom', positionX: 'right'});
                });
    };

Thnx

Answer 1

Please make following changes

In View change "Next" button to

 <button ng-hide="enable" type="button" class="btn btn-default btn-sm" ng-click="change(); itemsForClient()">Next</button>

instead of

 <button ng-hide="enable" type="button" class="btn btn-default btn-sm" ng-click="active = 1; change(); itemsForClient()">Next</button>

And update $http.post to as follows

$http.post(serviceBase + 'control-board/items/bulk', data, config)
                .success(function (data, status, headers, config) {
                     $scope.active = 1;
                    Notification.success({message: $filter('translate')('ITEMS_ADDED_SUCCESSFULLY'), delay: 3000, positionY: 'bottom', positionX: 'right'});
                })
                .error(function (data, status, header, config) {
                    Notification.error({message: $filter('translate')('ITEMS_ADDED_ERROR'), positionY: 'bottom', positionX: 'right'});
                });
 };