Petit soucis Ajax

**Tugudu45** · 13/01/2010, 15h25

Bonjour,

J'ai déjà utilisé Ajax avec succès dans quelques pages JSF en utilisant essentiellement a4j:support, a4j:outputPanel et a4j:region, mais j'ai ici un problème dont je ne trouve pas la solution tout seul...

Je souhaite afficher un truc qui ressemble à la capture jointe. J'ai une liste de sous-projets contenant au départ seulement la ligne avec les deux combo.
Le contenu de la seconde combo dépend de la sélection dans la première (ça, c'est OK); puis l'affichage de la seconde ligne dépend de la sélection dans la seconde combo. C'est là que ça coince : ma seconde ligne n'est jamais mise à jour (si elle est présente au chargement initial, elle reste toujours visible; inversement, si elle n'est pas présente au départ, elle n'apparaît jamais).

Voici le fragment de code concerné:

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
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
66
67
68
69
70
71
72
73
74
 
<c:forEach var="ssProjet" items="#{activity_bean.sousProjets}"
	varStatus="props">
	<sfx_t:foldingPanel loadingMode="client" expanded="#{ssProjet.visible}">
		<f:facet name="caption">
			<sfx_h:panelGroup>
				<sfx_h:outputText value="#{messageSource['presentation.SOUS_PROJET_NUMERO']}" />
				<sfx_h:outputText value="#{ssProjet.libelle}" />
			</sfx_h:panelGroup>
		</f:facet>
 
		<a4j:outputPanel id="PanelSsProjet_#{props.index}" layout="none">
		<sfx_h:panelGrid columns="4" columnClasses="formLibelle2,formValue2,formLibelle2,formValue2">
 
			<sfx_h:panelGroup colspan="1">
				<sfx_h:outputLabel for="TypeProtocole_#{props.index}" value="#{messageSource['presentation.TYPE_PROTOCOLE']}" />
			</sfx_h:panelGroup>
			<sfx_h:panelGroup colspan="1">
				<a4j:region>
				<sfx_h:selectOneMenu id="TypeProtocole_#{props.index}" 
					value="#{ssProjet.typeProtocole}"
					converter="ReferenceDataConverter">
					<a4j:support event="onchange" reRender="Protocole_#{props.index}"
						ajaxSingle="true" action="#{ssProjet.updateListeProtocoles}"
						onchange="disableSafeNavigation();"
						oncomplete="enableSafeNavigation();"/>
					<f:selectItems value="#{activity_bean.typologieProtocoleSelect}" />
				</sfx_h:selectOneMenu>
				<sfx_h:message for="TypeProtocole_#{props.index}" />
				</a4j:region>
			</sfx_h:panelGroup>
			<sfx_h:panelGroup colspan="1">
				<sfx_t:outputLabelRequired for="Protocole_#{props.index}" value="#{messageSource['presentation.PROTOCOLE']}" />
			</sfx_h:panelGroup>
			<sfx_h:panelGroup colspan="1">
				<a4j:region>
				<sfx_h:selectOneMenu id="Protocole_#{props.index}"
					value="#{ssProjet.protocole}"
					converter="DisplayableConverter">
					<a4j:support event="onchange" reRender="PanelSsProjet_#{props.index}"
						ajaxSingle="true" action="#{ssProjet.updateAgaRequired}"
						onchange="disableSafeNavigation();"
						oncomplete="enableSafeNavigation();"/>
					<f:selectItems value="#{ssProjet.protocolesPossibles}" />
					<f:validator validatorId="required" />
				</sfx_h:selectOneMenu>
				<sfx_h:message for="Protocole_#{props.index}" />
				</a4j:region>
			</sfx_h:panelGroup>
 
 
			<sfx_h:panelGroup rendered="#{ssProjet.agaRequired }"
				colspan="#{empty paramColspanLibelle ? '1' : paramColspanLibelle}">
				<sfx_t:outputLabelRequired for="nomAga_#{props.index}" value="Ligne 2" />
			</sfx_h:panelGroup>
 
			<sfx_h:panelGroup rendered="#{ssProjet.agaRequired }"
				colspan="#{empty paramColspanValeur ? '3' : paramColspanValeur}">
				<sfx_h:outputText id="nomAga_#{props.index}"	value="Hello World" />
			</sfx_h:panelGroup>
 
		</sfx_h:panelGrid>
		</a4j:outputPanel>
		<!--sfx_t:commandButtonSupprimer id="Supprimer_ssProjet_#{props.index}"
			action="#{activity_bean.actionSupprimerSsProjet}"
			actionListener="#{ssProjet.selectionnePourAction}" />
		<sfx_t:confirmation id="confSupprimerSsProjet_#{props.index}"
			invokerId="Supprimer_ssProjet_#{props.index}" invokerEventName="onclick"
			captionText="#{messageSource['presentation.sousprojet.supprimer.titre']}"
			message="#{messageSource['presentation.sousprojet.supprimer.texte']}"
			details="" okButtonText="#{messageSource['presentation.OK']}"
			cancelButtonText="#{messageSource['presentation.ANNULER']}" /-->
	</sfx_t:foldingPanel>
</c:forEach>

J'ai bien un a4j:outputPanel autour du panelGrid (pour permettre l'apparition de la seconde ligne, absente de l'arbre DOM au départ).
Je constate que la valeur de agaRequired est bien mise à jour en fonction de ma sélection dans la seconde combo.
Le getter de la propriété agaRequired est appelée 2 fois s'il vaut false, et 8 fois s'il vaut true, ce qui pour moi accrédite le fait que la seconde ligne de la table est présente dans l'arbre DOM quand il le faut.
Je ne suis pas convaincu de la nécessité des régions que j'ai défini, mais les enlever ne change rien.

Si vous avez des suggestions...

Merci

Tug

PS : les sfx_h: correspondent à une surcouche des h: traditionnels;
les disableSafeNavigation() et enableSafeNavigation() sont liés au framework maison et n'interfèrent a priori pas ici.

**Tugudu45** · 13/01/2010, 16h04

Re-bonjour.

j'ai réussi à faire marcher mon écran : je supprime le outputPanel et je mets son id directement sur le panelGrid:
<sfx_h:panelGrid columns="4" id="PanelSsProjet_#{props.index}"
columnClasses="formLibelle2,formValue2,formLibelle2,formValue2">

Ça marche, mais je ne comprends pas pourquoi ça ne marchait pas avant...

Tug