I have a mobile app where I have two select option
(districts and counties). What I intend is that when choosing a district, only the counties that belong to that district appear.
How can I do this? I already tried to filter by ng-change
only that the names of the municipalities are not appearing the list appears in white and by the console I can verify that it filters.
View
<div ng-controller="FiltraEstabelecimentos">
<form ng-submit>
<div class="row">
<div class="col">
<label ng-controller="ListaDistritos" style="border-radius: 10px; margin: 0px 0px 10px 0px;" class="item item-input item-select">
<div class="input-label">
Distrito
</div>
<select ng-controller="ListaConcelhos" ng-model="distrito" ng-options="lista_distritos as lista_distritos.titulo for lista_distritos in distritos" ng-change="id_distrito()"></select>
</label>
<label ng-controller="ListaConcelhos" style="border-radius: 10px;" class="item item-input item-select">
<div class="input-label">
Concelho
</div>
<select ng-model="concelho" ng-options="lista_concelhos as lista_concelhos.titulo for lista_concelhos in concelhos"></select>
</label>
</div>
</div>
<div style="margin:0px 10px 0px 10px;">
<button type="submit" ng-click="filtra_estabelecimentos(input)" style="background-color: #CA5B60; border:#CA5B60; border-radius: 10px;" class="button button-block button-positive">
<i class="ion-search"></i> Pesquisar
</button>
</div>
</form>
</div>
PHP districts
function converte($term, $tp) {
if ($tp == "1") $palavra = strtr(ucwords(strtoupper($term)),"àáâãäåæçèéêëìíîïðñòóôõö÷øùüúþÿ","ÀÁÂÃÄÅÆÇÈÉÊËÌÍÎÏÐÑÒÓÔÕÖ×ØÙÜÚÞß");
elseif ($tp == "0") $palavra = strtr(ucwords(strtolower($term)),"ÀÁÂÃÄÅÆÇÈÉÊËÌÍÎÏÐÑÒÓÔÕÖ×ØÙÜÚÞß","àáâãäåæçèéêëìíîïðñòóôõö÷øùüúþÿ");
return $palavra;
}
$distritos = array();
$sql = $conexao->prepare("SELECT * FROM distritos ORDER BY titulo");
$sql->execute();
$distritos = $sql->fetchAll(PDO::FETCH_ASSOC);
foreach ($distritos as $rows ) {
$distritos[] = array(
'titulo' => converte($rows['titulo'], 0),
);
}
echo json_encode($distritos);
PHP Counties
function converte($term, $tp) {
if ($tp == "1") $palavra = strtr(ucwords(strtoupper($term)),"àáâãäåæçèéêëìíîïðñòóôõö÷øùüúþÿ","ÀÁÂÃÄÅÆÇÈÉÊËÌÍÎÏÐÑÒÓÔÕÖ×ØÙÜÚÞß");
elseif ($tp == "0") $palavra = strtr(ucwords(strtolower($term)),"ÀÁÂÃÄÅÆÇÈÉÊËÌÍÎÏÐÑÒÓÔÕÖ×ØÙÜÚÞß","àáâãäåæçèéêëìíîïðñòóôõö÷øùüúþÿ");
return $palavra;
}
$concelhos = array();
$sql = $conexao->prepare("SELECT * FROM concelhos WHERE id_mae = :distritos ORDER BY titulo");
$sql->bindParam(':distritos', $_GET['id_distrito'], PDO::PARAM_INT);
$sql->execute();
$row = $sql->fetchAll(PDO::FETCH_ASSOC);
foreach ($row as $rows ) {
$concelhos[] = array(
'titulo' => converte($rows['titulo'], 0),
);
}
echo json_encode($concelhos);
Controller Districts and Counties
.controller('ListaDistritos', function($scope, $http) {
$http.get("https://www.sabeonde.pt/api/api_distritos.php").success(function (data) {
$scope.distritos = data;
});
})
.controller('ListaConcelhos', function($scope, $http, $stateParams) {
$scope.id_distrito= function (){
$http.get("https://www.sabeonde.pt/api/api_concelhos.php?id_distrito="+$scope.distrito.id).success(function (data) {
$scope.concelhos = push(data);
});
};
})