Hi, I'm trying to build a dependant select for Countries > States > Cities.
So here is my code for Countries > States:
app.directive('country', ['$http', function($http) {
return {
restrict: "C",
link: function(scope, element, attrs) {
$http.get(Routing.generate('countries')).success(function(data) {
if (data.message) {
scope.message = data.message;
} else {
scope.countries = data.entities;
}
}).error(function(data, status, headers, config) {
if (status == '500') {
scope.message = "No hay conexión con el servidor.";
}
});
}
};
}]);
app.directive('state', ['$http', function($http) {
return {
restrict: "C",
link: function(scope, element, attrs) {
console.log(eval('scope.' + attrs.trigger));
scope.$watch(attrs.trigger, function(selectedType) {
if (eval('scope.' + attrs.trigger) !== undefined) {
states = eval('scope.' + attrs.statetrigger);
states = {};
$http.get(Routing.generate('states') + '/' +
eval('scope.' + attrs.trigger).iso_country).success(function(data) {
if (data.message) {
scope.message = data.message;
} else {
scope.states = data.entities;
}
}).error(function(data, status, headers, config) {
if (status == '500') {
scope.message = "No hay conexión con el
servidor.";
}
});
}
});
}
};
}]);
And this is the HTML code associated:
<select class="country"
ng-model = "country"
ng-options = "country.iso_country as country.name for country
in countries"
tooltip = ""
tooltip-trigger = "focus"
tooltip-placement = "right"
wv-cur = ""
wv-err = "Error!"
wv-req = "The value you selected is not a valid choice"
type = "text">
<option value="">{{ "Select country" | trans }}</option>
</select>
<select class="state"
ng-model = "state"
ng-disabled = "!states"
ng-options = "state.iso as state.name for state in states"
tooltip-trigger = "focus"
tooltip-placement = "right"
wv-cur = ""
wv-err = "Error!"
wv-req = "The value you selected is not a valid choice"
type = "text"
trigger = "country">
<option value="">{{ "Select state" | trans }}</option>
</select>
The idea behind this is: when I change any country I should populate the
`states` with new values coming from second directive but `$watch` is not
listening since second select never is populated, where is my mistake?
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
