J'ai donc deux listes déroulantes et la première réponse de la liste déroulante est générée au chargement de la page et la deuxième réponse déroulante est générée lors du changement de la première réponse déroulante

 <div class="form-group">
    <select name="country_city" class="inputbox" required ng-model="frm.country_city" ng-change="state_city()">
        <option ng-repeat="country in country_city track by $index" value="{{country.id}}">{{country.name}}</option>
    </select>
</div>

<div class="form-group">
    <select name="state_city" class="inputbox" required ng-model="frm.state_city">
        <option ng-repeat="state in state_city track by $index" value="{{state.id}}">{{state.name}}</option>
    </select>
</div>
$scope.state_city = function() {
    console.log("in state city");
    $scope.frm.country_city;
    $http.get(url, {
        params: {
            action: 'get_state_city',
            country_id: $scope.frm.country_city
        }
    }).success(function(data, status, headers, config, jsonp) {
        $scope.state_city= data;
        console.log($scope.state_city);
    });
};

Le problème est que lorsque je change la réponse de la première liste déroulante une deuxième fois, cela me donne une erreur. Les images doivent aider. La troisième image montre l'erreur

enter image description here

enter image description here

enter image description here

Les images montrent la sélection du pays de l'Inde et de l'état du Maharastra comme réponse, mais lors de la sélection des États-Unis, il suffit de changer la réponse pour donner l'erreur

2
Snehal Gongle 16 janv. 2017 à 14:12

2 réponses

Meilleure réponse

Le problème est que votre nom scope function et scope variable name sont identiques:

$scope.state_city = function() {
    console.log("in state city");
    $scope.frm.country_city;
    $http.get(url, {
        params: {
            action: 'get_state_city',
            country_id: $scope.frm.country_city
        }
    }).success(function(data, status, headers, config, jsonp) {
        $scope.state_city= data; => Issue is here
        console.log($scope.state_city);
    });
};

Vous créez une fonction $scope.state_city(), puis à l'intérieur de votre fonction de réussite, vous faites cela $scope.state_city= data;, à partir de la prochaine fois que votre state_city deviendra un variable avec response data et plus de function.

0
Thalaivar 16 janv. 2017 à 11:28

Essayez de changer pour:

 $scope.change_state_city = function() {
            $http.get(url, {
            params: {
                action: 'get_state_city',
                country_id: $scope.frm.country_city
            }
        }).success(function(data, status, headers, config, jsonp) {
            $scope.state_city= data;
            console.log($scope.state_city);
        });
    };

<div class="form-group">
    <select name="country_city" class="inputbox" required ng-model="frm.country_city" ng-change="change_state_city()">
        <option ng-repeat="country in country_city track by $index" value="{{country.id}}">{{country.name}}</option>
    </select>
</div>

<div class="form-group">
    <select name="state_city" class="inputbox" required ng-model="frm.state_city">
        <option ng-repeat="state in state_city track by $index" value="{{state.id}}">{{state.name}}</option>
    </select>
</div>
0
Sreehari S 16 janv. 2017 à 11:31