[Tapestry 5] Détecter changement select

Bonjour,
question simple mais je n'y arrive pas :D
Je cherche à détecter lorsque l'user sélectionne une valeur d'un select pour ensuite recharger un 2éme select en fonction de la valeur selectionnée.
Mais je suis bloqué à la detection.

Mon select a pour id "createFormA".
Et j'ai beau utiliser :
onSelectFromcreateFormA
onChangeFromcreateFormA
onSelectFromCreateFormA
onChangeFromCreateFormA
avec juste un System.out.println dedans (juste pour verif qu'il passe bien dans la méthode), eh ben cela ne fonctionne pas :D

Quelle méthode utiliser pour récupérer la valeur lorsque l'user utilise le select ?

Merci ;)

Bonjour,

voila Messieur :
http://jumpstart.doublenegative.com....pt/ajaxselect1

un bon exemple pour ta problématique.

Cordialement,

Bonjour, j'ai essayé ces exemples mais rien ne marche chez moi.
L’événement n'est mm pas détecter.

Bonjour,

Sur le lien jumpstart, il utilise la version 5.3 de tapestry qui supporte l'attribut zone pour select. L'attribut zone n'est supporté que depuis la version 5.2, pour les versions antérieurs, tu dois créer un mixin.

A+.

Bonjour,

Etant confronté au même problème, j'ai fini par trouver ce mixin :

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
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
package fr.test.web.mixins;
 
import java.util.ArrayList;
 
import org.apache.tapestry.ComponentEventCallback;
import org.apache.tapestry.ComponentResources;
import org.apache.tapestry.ContentType;
import org.apache.tapestry.Link;
import org.apache.tapestry.MarkupWriter;
import org.apache.tapestry.PageRenderSupport;
import org.apache.tapestry.SelectModel;
import org.apache.tapestry.ValueEncoder;
import org.apache.tapestry.annotations.AfterRender;
import org.apache.tapestry.annotations.Environmental;
import org.apache.tapestry.annotations.IncludeJavaScriptLibrary;
import org.apache.tapestry.annotations.InjectContainer;
import org.apache.tapestry.annotations.MixinAfter;
import org.apache.tapestry.annotations.OnEvent;
import org.apache.tapestry.annotations.Parameter;
import org.apache.tapestry.annotations.SetupRender;
import org.apache.tapestry.internal.TapestryInternalUtils;
import org.apache.tapestry.internal.services.ResponseRenderer;
import org.apache.tapestry.internal.util.Holder;
import org.apache.tapestry.internal.util.SelectModelRenderer;
import org.apache.tapestry.ioc.annotations.Inject;
import org.apache.tapestry.ioc.services.TypeCoercer;
import org.apache.tapestry.json.JSONArray;
import org.apache.tapestry.json.JSONObject;
import org.apache.tapestry.services.ComponentDefaultProvider;
import org.apache.tapestry.services.MarkupWriterFactory;
import org.apache.tapestry.services.Request;
 
import fr.test.common.variables.GeneralVariables;
import fr.test.web.components.Select;
 
/**
 * This class is a sample of Mixin component that generates Javascript to allow
 * the refresh of a select component on the 'onchange' event of another select
 * element. We have create a simple Javascript file based on Tapestry Zone.
 * 
 * @author a136316
 */
@IncludeJavaScriptLibrary({ "context:static/js/dependentSelect.js" })
@MixinAfter
public class SelectUpdator {
 
	/** Event triggered by this mixin to access to the new SelectModel object */
	private static final String UPDATE_MODEL_EVENT = GeneralVariables.UPDATE_MODEL_EVENT;
 
	/** The client Id of the select that will update */
	@Parameter(required = true, defaultPrefix = "literal")
	private String updator;
 
	/** The name of the method to call on update */
	@Parameter(required = false, defaultPrefix = "literal")
	private String update;
 
	/** Used by Tapestry API to generate options Markup */
	@Parameter()
	private ValueEncoder<?> dependentEncoder;
 
	/**
         * Used to generate a default ValueEncoder from the type of value parameter
         * of the mixed element
         */
	@Inject
	private ComponentDefaultProvider defaultProvider;
 
	/** Used to add Javascript */
	@Environmental
	private PageRenderSupport support;
 
	@Inject
	private ComponentResources resources;
 
	@InjectContainer
	private Select select;
 
	/** Used to extract the new selected value */
	@Inject
	private Request request;
 
	@Inject
	private TypeCoercer coercer;
 
	/** Used to create a temporary MarkupWriter object */
	@Inject
	private MarkupWriterFactory factory;
 
	/** Used to extract response content type */
	@Inject
	private ResponseRenderer responseRenderer;
 
	/**
         * Verify if the container is a Select component.
         * 
         * @throws IllegalArgumentException
         *             if the container is null.
         */
	@SetupRender
	public void verifySelect() {
		if (null == select) {
			throw new IllegalArgumentException(
					"This mixin can only be used with Tapestry select components.");
		}
	}
 
	/**
         * This method add Javascript code fragment that link the current select
         * element to another that will launch update on the source select
         * 'onchange' event.
         */
	@AfterRender
	private void linkSelectElements() {
 
		JSONArray spec = new JSONArray();
 
		// Add client if of select elements
		spec.put(updator);
		spec.put(select.getClientId());
 
		// Add update link template
		Link link = resources.createActionLink("update", false);
		link.addParameter("value", "$value$");
		spec.put(link.toRedirectURI());
 
		if (update != null) {
			spec.put(update);
		}
 
		support.addScript("AWLMIXINS.linkSelect(%s);", spec);
	}
 
	/**
         * This method is call on update request. It returns a JSONObject that
         * contains a 'content' attribute with the list of selected options. It uses
         * Tapestry API to create the list of options, but this could also be done
         * manually for specific need like blank options...
         * 
         * @return A JSONObject
         */
	@OnEvent(value = "update")
	private Object updateSelect() {
 
		// Get the new select value from the request
		// this value has been sent by the Javascript code
		String input = request.getParameter("value");
 
		final Holder<SelectModel> matchesHolder = Holder.create();
 
		// Default it to an empty list.
		matchesHolder.put(TapestryInternalUtils
				.toSelectModel(new ArrayList<String>()));
 
		// Generate a event to access the new SelectModel with the new selected
		// value
		ComponentEventCallback<Object> callback = new ComponentEventCallback<Object>() {
			public boolean handleResult(Object result) {
				SelectModel matches = coercer.coerce(result, SelectModel.class);
				matchesHolder.put(matches);
				return true;
			}
		};
 
		resources.triggerEvent(UPDATE_MODEL_EVENT, new Object[] { input },
				callback);
 
		// Generate a response with the new SelectModel object returned by the
		// event
		ContentType contentType = responseRenderer.findContentType(this);
 
		MarkupWriter writer = factory.newMarkupWriter(contentType);
 
		SelectModelRenderer render = new SelectModelRenderer(writer,
				dependentEncoder);
		SelectModel model = matchesHolder.get();
 
		// Create select root element
		writer.element("select", "name", select.getControlName(), "id",
				select.getClientId());
		resources.renderInformalParameters(writer);
 
		// Add an empty option if needed
		if (model == null || model.getOptions().size() == 0) {
			writer.element("option");
			writer.end();
		} else {
			model.visit(render);
		}
 
		writer.end();
 
		// Return only option elements
		JSONObject result = new JSONObject();
		result.put("content", writer.getDocument().getRootElement()
				.getChildMarkup());
		return result;
 
	}
 
	void setDependentValueEncoder(ValueEncoder<?> encoder) {
		this.dependentEncoder = encoder;
	}
 
}

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
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
var AWLMIXINS = {
 
	DependentSelect : Class.create(),
 
	linkDependentSelect : function(element, dependentSelect, href)
    {
        element = $(element);
        var select = $(dependentSelect).referer;
		var selectedIndex;
 
        var successHandler = function(transport)
        {
            var reply = transport.responseJSON;
 
            select.show(reply.content);
			select.store(selectedIndex, reply.content);
            Tapestry.processScriptInReply(reply);
        };
 
        // Otherwise, assume it's just an ordinary link.
 
        var handler = function(event)
        {
 
        	// look for the selected value to build the request Ajax URL
			var selectedValue;
 
			for(i=0 ; i<element.options.length ; i++){
				if(element.options[i].selected == true){
					selectedIndex = i;
					selectedValue = element.options[i].value;
					break;
				}
			}
 
        	if(select.get(selectedIndex) != null){
        		select.showCache(selectedIndex);
        	}else{
	        	var dynHref = href.replace("\$value\$", selectedValue);
    	        new Ajax.Request(dynHref, { onSuccess : successHandler });
        	}
 
            return false;
        };
 
        element.onchange = handler;
    },
 
	linkSelect: function (spec)
    {
        new AWLMIXINS.DependentSelect(spec);
		AWLMIXINS.linkDependentSelect.apply(null, spec);
    }
}
 
AWLMIXINS.DependentSelect.prototype = {
 
	initialize: function(spec)
    {
		this.select = $(spec[1]);
		this.select.referer = this;
		this.updateFunc = Tapestry.ElementEffect[$(spec[3])] || Tapestry.ElementEffect.highlight;
    },
 
	// redefine the show
	show : function(content) {
		Element.update(this.select, content);
		this.updateFunc.call(this, this.select);
	},
 
	showCache : function(key) {
		Element.update(this.select, this.store[key]);
		this.updateFunc.call(this, this.select);		
	},
 
	// Used to handle a simple cache mechanism
	store : function(key, content) {
		this.store[key] = content;
	},
 
	// Used to verify if the index has already been requested	
	get : function(key) {
		if(this.store != null){
			return this.store[key];
		}
		return null;
	}
};

Cela permet de mettre à jour un select B en fonction de la sélection du select A.
Mon problème, c'est que j'ai mis un onChange="this.form.submit();" et il ne s'execute pas, comme si le mixin prenait le dessus sur le onChange. Et cela implique que l'objet java sélectionné dans le select A est null.
Quelqu'un aurait une idée ?