I'm working on Symfony2 project and I'm using also AngularJS. So I'm using
Symfony2 Forms to build forms and this is how my form code looks:
public function buildForm(FormBuilderInterface $builder, array
$options) {
$builder
->add('country', 'entity', array(
"class" => "CommonBundle:Country",
"property" => "name",
"label" => "País",
"empty_value" => "Seleccione un país",
"attr" => array(
"ng-model" => "country",
"tooltip" => "País",
"tooltip-trigger" => "focus",
"tooltip-placement" => "right",
"wv-def" => "País",
"wv-cur" => "",
"wv-err" => "Error!",
"wv-req" => "The value you selected is not a valid
choice",
"type" => "text"
)
))
->add('state', 'entity', array(
"class" => "CommonBundle:State",
"property" => "name",
"label" => "Estado",
"empty_value" => "Seleccione un estado",
"attr" => array(
"ng-model" => "state",
"ng-disabled" => "!states",
"ng-options" => "state.name for state in
states.entities",
"tooltip" => "Estado",
"tooltip-trigger" => "focus",
"tooltip-placement" => "right",
"wv-def" => "Estado",
"wv-cur" => "",
"wv-err" => "Error!",
"wv-req" => "The value you selected is not a valid
choice",
"type" => "text"
)
))
->add('city', 'entity', array(
"class" => "CommonBundle:City",
"property" => "name",
"label" => "Ciudad",
"empty_value" => "Seleccione una ciudad",
"attr" => array(
"ng-model" => "city",
"ng-disabled" => "!cities",
"ng-options" => "city.name for city in
cities.entities",
"tooltip" => "Ciudad",
"tooltip-trigger" => "focus",
"tooltip-placement" => "right",
"wv-def" => "Ciudad",
"wv-cur" => "",
"wv-err" => "Error!",
"wv-req" => "The value you selected is not a valid
choice",
"type" => "text"
)
));
}
This is the basically `Country > State > City` dependency. I have this code
in my AngularJS controller:
app.controller('NewSeller', function($scope, $http, $routeParams,
$fileUploader) {
$scope.section = $routeParams.section == undefined ? 'main' :
$routeParams.section;
$scope.aaaa = 'sdsdsdsd';
$scope.country = '';
// Add watch for states
$scope.$watch('country', function(iso_country) {
if (iso_country) {
$http.get(Routing.generate('states') +
iso_country).success(function(data) {
if (data.message) {
$scope.message = data.message;
} else {
$scope.states = data;
$scope.orderProp = 'name';
}
}).error(function(data, status, headers, config) {
if (status == '500') {
$scope.message = "No hay conexión con el servidor.";
}
});
}
});
...
And this is the HTML generated:
<select id="common_commonbundle_standard_address_country"
name="common_commonbundle_standard_address[country]" required="required"
ng-model="country" tooltip="País" tooltip-trigger="focus"
tooltip-placement="right" wv-def="País" wv-cur="" wv-err="Error!"
wv-req="The value you selected is not a valid choice" type="text"
class="ng-scope ng-dirty ng-valid ng-valid-required">
<option value="" selected="selected">Seleccione un país</option>
<option value="1">Pais 1</option>
<option value="2">Pais 2</option>
<option value="3">Pais 3</option>
<option value="4">Pais 4</option>
</select>
But it's not working since I change the select element and nothing happen.
I want to watch this change to then get the states for that country. Any
advice or help?
--
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/groups/opt_out.
