AngularJS et liste menu déroulant liée

romses
Javascript

Bonjour,

Voila je rencontre un petit problème avec mon code.

Ce que je fais

Je suis nouveau à utiliser AngularJS 1.5, j'arrive à faire des petits appels avec mes codes JS mais je coince pour un double menu déroulant lié.
j'aimerai faire deux menu déroulant liée avec angularJS
j'ai une table Region(id,nom) et une table ville(id_nom,id_region) et j'aimerai que lorsque le premier menu est sélectionner, le second s'affiche avec les éléments trier en fonction du choix

Quelqu'un voit de quoi je parle?
S'il vout plais

Entourez votre code pour bien le mettre en forme

Ce que je veux

Décrivez ici ce que vous cherchez à obtenir

Ce que j'obtiens

Décrivez ici vos erreurs ou ce que vous obtenez à la place de ce que vous attendez :(

1 réponse

romses
Auteur

je viens de faire un petit script mais suis unpeu foirée en effet j'utilise le framework Cakephp 3.0 pour le côté metier

dans ma vue j'ai ceci:

<div class="row" ng-controller="geolocalisationsCtrl" >
<nav class="large-3 medium-4 columns" id="actions-sidebar">
    <ul class="side-nav">
        <li class="heading"><?= __('Actions') ?></li>
        <li>
         <?= $this->Form->input('ville_id',['type' => 'select','class' => 'form-control','options' =>$villes,'div'=>false,'label'=>false,'ng-change'=>'listearrondissement()','data-ng-model' => 'form.choixville','empty'=>'Choisir la ville']);?>

        </li>

                <li>
         <select ng-model="arron_selection" ng-options="x for x in list">
            </select>

        </li>

    </ul>
</nav>
<div class="geolocalisations form large-9 medium-8 columns content">
    <?= $this->Form->create(NULL) ?>
    <fieldset>
        <legend><?= __('Add Geolocalisation') ?></legend>

    </fieldset>

    <?= $this->Form->end() ?>
</div>
</div>

dans mon controller angularjs j'ai ceci:

mainApp.controller('geolocalisationsCtrl',function($scope,$rootScope,$http,$location){

        console.log('Chargement des données...');
        var path = $location.absUrl();
        var  $link = path.substring(0 ,path.lastIndexOf( "/" )) + '/findArrondissement';
        $scope.form = null;
         $scope.listearrondissement = function(){
            var idville = $scope.form.choixville;
            if(idville != 0)
            {

               $http.post($link,{'id_ville':idville}).success(function(data){
                $scope.list = data;
              alert(data);
                });
                 /*$scope.setPage = function(pageNo) {
                        $scope.currentPage = pageNo;
                    };
                    $scope.filter = function() {
                        $timeout(function() { 
                            $scope.filteredItems = $scope.filtered.length;
                        }, 10);
                    };

            }

            else
            {
                alert('Le choix est obligatoire');
            }

        };

});

côté serveur j'ai ceci:

 public function findArrondissement()
    {
       $this->autoRender = false;
       if($this->request->is('post'))
       {
            $arrond = TableRegistry::get('Administration.Arrondissements');
         $arrond = $arrond->find('list', ['keyField' => 'id','valueField'=>'nom_arrondissement'])
         ->where(['ville_id'=>$this->request->data['id_ville']])->toArray();
         $data = json_encode($arrond);
           echo $data;
       }

         die();

    }

lorsque je sélectionne ma ville charcher dans le premier select, tous ce passe bien j'ai la valeur sélectionnée qui est envoyé au serveur à traver mon script angularjs, le serveur recherche dans la base de donnée et me fournir le résultat suivant

{"1":"Douala 1 er","2":"Douala 2 e","3":"Douala 4"}
encodé en Json, le problème maintenant c'est que je n'arrive pas à remplir le prochain select avec ces valeur en angularjs

je ne sais pas si j'ai mal expliqué
en effet je n'arrive pas à remplir mon select avec les données suivants {"1":"Douala 1 er","2":"Douala 2 e","3":"Douala 4"}

quelqu'un a une idée?
j'avoue je suis nul en javascript

SVP