Bonjour, je ne sais pas réellement quel titre donner à mon souci puisque je ne maîtrise pas encore assez Javascript et jQuery pour savoir réellement d'où il vient.

Pour expliquer rapidement ce que je cherche à faire. J'ai des champs en base rempli par un code qui est la concaténation de plusieurs niveaux de select.
En gros j'ai 4 select :
Le premier fournit une lettre à mon code : A
Le second fournit 2 chiffres : 12 ->donc mon code est A12 maintenant
Le troisième fournit un nouveau chiffre : 5 -> donc mon code est A125, etc.

C'est ce code qui est stocké en bdd. Ce que je souhaite réaliser maintenant, c'est la page d'édition. Donc recréer les choix dans les select qui me sont à la base fournis par des requêtes de Json en ajax.

Ces codes sont à un nombre indéfini et c'est pourquoi j'utilise des classes plutôt que des identifiants pour les identifier. Ce n'est certainement pas la meilleure solution, n'étant, encore une fois, pas un expert en jQuery. Mais bref, voilà ce que ça donne.

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
 
...
 
showrome = $('.showrome').children('input'); 
 
    showrome.each(function(i){
        rome = $(this).val();
       if(rome!=''){
        if(rome.length>=1){   
            lvl1 = rome.substring(0,1);
            select1 = $(this).parent().next('div').children('select');                 
            select2 = select1.parent().next('div').children('select');
            console.log(select2);
 
            $.getJSON('/retrieveRome/'+lvl1, {
                get_param: 'value',
                select: select2.attr('id')                
            }, function(data) {   
                console.log(select2);
                select.empty();                 
 
                $.each(data, function(index,item) {
                    select.append( '<option value="'
                        + item.value
                        + '">'
                        + item.libelle
                        + '</option>' ); 
                });    
            });                       
        }
    }
    });
 
...
showrome est donc un champs input qui contient le code en question à partir duquel je souhaite recréer les select. Le select de premier niveau est lui peuplé directement vu que c'est la même requête pour tous.

Mon souci :
Je vois bien que sur le retour des log que les derniers que j'obtiens viennent des fonctions getJson alors que ce que j'attendrais dans ma boucle ce serait d'avoir un premier retour puis le second retour contenu dans ma fonction getJson et ainsi de suite. Seulement, et si j'ai bien compris la chose, le problème vient du fait que ces fonctions sont asynchrones et que ma boucle continue le temps qu'elles s'effectuent.
Mon problème est que du coup, ma var select2 est la même pour tous les getJson effectués et contient à ce moment la dernière valeur prise dans la boucle... Vous voyez certainement le souci.

Du coup, seul mon dernier niveau de sélection fonctionne...

Quelle est la solution à cette problématique? y'a t'il moyen de passer un identifiant à la fonction getJson? Faut-il revoir l'architecture de ma fonction?

Merci d'avance pour votre aide