suggestionbox Ville Code postal.

Bonjour, mon objectif est de construire 2 champs qui inter réagie netre eux. Un champ Ville et l'autre code postal. Si je selectionne la ville je devrais afficher son code postal dans l'autre et si je selectionne le code postal j'affiche la ville correspondante dans l'autre. mon code est le suivant il fonctionne a moitié:

Code:

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
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
 
<h:outputLabel
				value="#{messages['Ecr_Cta_R_0_ConducteurPrincipal.CodePostal']}">
				<ui:remove> <!-- Code postal --> </ui:remove>
			</h:outputLabel>
			<h:panelGrid>
				<s:decorate id="codePostalField"
					template="../../../layout/edit.xhtml">
					<ui:define name="input">
						<h:inputText id="codePostal"
							value="#{conducteurPrincipal.adresse.codePostal}"
							onclick="#{rich:component('suggestion')}.callSuggestion(true)" reRender="ville"
							readonly="#{ecr_cta_r_0.modeLecture}" />						
 
					</ui:define>
				</s:decorate>
				<rich:suggestionbox for="codePostal" var="result" id="suggestion"
					fetchValue="#{result.codePostal}"
					suggestionAction="#{suggestVilleCodePostal.suggestCodePostal}"
					nothingLabel="#{messages['commons_code.postal.inconnu']}"
					frequency="#{messages['commons_suggest.frequency']}">
					<h:column>
						<h:outputText value="#{result.codePostal}" />
					</h:column>
					<h:column>
						<h:outputText value="#{result.ville}" />
					</h:column>
					<a4j:support event="onselect"
						action="#{conducteurPrincipal.adresse.setVille(result.ville)}"
						reRender="ville,codePostal"></a4j:support>
				</rich:suggestionbox>
 
 
			</h:panelGrid>
			<h:outputLabel
				value="#{messages['Ecr_Cta_R_0_ConducteurPrincipal.Ville']}">
				<ui:remove> <!-- Ville --> </ui:remove>
			</h:outputLabel>
			<h:panelGroup>
				<s:decorate id="villeField" template="../../../layout/edit.xhtml">
					<ui:define name="input">
						<h:inputText id="ville"
							value="#{conducteurPrincipal.adresse.ville}"
							onclick="#{rich:component('suggestion1')}.callSuggestion(true)" reRender="codePostal"
							readonly="#{ecr_cta_r_0.modeLecture}" />
 
 
					</ui:define>
				</s:decorate>
				<rich:suggestionbox for="ville" var="result" id="suggestion1"
					fetchValue="#{result.ville}"
					suggestionAction="#{suggestVilleCodePostal.suggestVille}"
					nothingLabel="#{messages['commons_ville.inconnue']}"
					frequency="#{messages['commons_suggest.frequency']}">
					<h:column>
						<h:outputText value="#{result.ville}" />
					</h:column>
					<h:column>
						<h:outputText value="#{result.codePostal}" />
					</h:column>					
					<a4j:support event="onselect"
						action="#{conducteurPrincipal.adresse.setCodePostal(result.codePostal)}"
						reRender="codePostal,ville"></a4j:support>
				</rich:suggestionbox>
			</h:panelGroup>

Le probleme c'est le premier sur qui je clic qui controle. Exple: si j'arrive su l'ecran je me positionne sur le code postal, je choisis 1 il m'affiche la ville correspondante,impec. Mais si je veux changer et que je veux sectionner ds la liste ville, ca ne marche pas. Pareil ds l'autre sens.