There are a component on Internet which made this. Without coding any javascript. http://lombok.demon.co.uk/tapestry5Demo/
It's dynamic select. I use it, it work very well. Emmanuel -----Message d'origine----- De : "Max Weißböck (info)" [mailto:m...@weissboeck.info] Envoyé : lundi 27 juillet 2009 22:20 À : Tapestry users Objet : Re: How to use JavaScript for dependent selects? I had the very same problem, here is the solution I have (with great help from the list - search for it) --- java part --- selection model as found in T5 HowTos in the wicki and with event definition from Chenillekit--- @IncludeJavaScriptLibrary( { "context:js/Chenillekit.js", "context:js/ RESelection.js" }) public class Index { @InjectSelectionModel(labelField = "name", idField = "oid") @Persist private List<REType> reTypes; @InjectSelectionModel(labelField = "name", idField = "oid") @Persist private List<RESubType> reSubTypes; @Component(parameters = {"event=change", "onCompleteCallback=literal:onCompleteChangeReSubType"}) @Mixins({"ck/OnEvent"}) private Select reType; @Log @OnEvent(component="reType", value="change") public JSONArray onChangeRETypeEvent(String value) { JSONArray jsonArray = new JSONArray(); // Tapestry cant handle the empty first field for us in this situation reSubTypes = dataService .getRESubTypesWithFirstEmpty (dataService.loadREType(Long.parseLong(value))); query.setReSubType(reSubTypes.get(0)); for (RESubType subType : reSubTypes) { JSONObject jo = new JSONObject(); jo.put("value", subType.getOid()); jo.put("label", subType.getName()); jsonArray.put(jo); } return jsonArray; } --- tml part --- <t:label for="retype"/> <select t:type="select" t:id="retype" value="query.retype" model="reTypesSelectionModel" encoder="reTypesValueEncoder" validate="required"/> <t:label for="resubtype"/> <select t:type="select" t:id="resubtype" value="query.resubtype" model="reSubTypesSelectionModel" encoder="reSubTypesValueEncoder"/> ---- javascript part --- function onCompleteChangeReSubType(response) { selectElement = $('resubtype'); while (selectElement.options.length > 0) { selectElement.options[0] = null; } for (index = 0; index < response.length; index++) { if (index == 0) { selectElement.options[index] = new Option(response[index].label, response[index].value, true, true); } else { selectElement.options[index] = new Option(response[index].label, response[index].value); } } // Tapestry.ElementEffect.highlight($("resubtype")); } hope this helps, Max Am 26.07.2009 um 20:16 schrieb sparqle: > > All, > > I know Java and have been using pure Java frameworks like ZK and > Echo2 to > develop web applications. I don't know anything about JavaScript, > and have > been trying to learn T5 in the hope of creating a real application. > However, > it appears that with T5 I am not completely shielded from JavaScript > (may be > I can do this in pure Java?) if I want to do AJAX. The specific > example that > I want to implement is the classic 2 dropdown - the second one > dependent on > the first one. So let's say you select a country, and the in the > second > dropdown, the list of states/provinces is updated to match what is > available > for the country selected in the first dropdown. > > From the forums, I have gathered that I must use the Chenille Kit > "onEvent" > mixin to make this happen. I also saw some sample codes in the > forums that > appear to solve this exact issue. The problem is that I don't know > where to > put this code (in Java file or tml file or some other js file) and > then how > to tie these things together. In the T5 help documentation, there is > some > info about using RenderSupport for this. Again, the code given is only > snippets with no complete example that I can download/copy. I could > not > understand this documentation at all. > > So my question is simple: where should this code be located and how > are all > these things connected? Is there anything else that needs to be > added - such > as RenderSupport (and where)? > ------------------------------------------------------------------------ > <select t:id="operator" t:type="select" t:mixins="commons/onEvent" > t:event="change" t:onCompleteCallback="onCompleteOperatorChange" .../> > ----------------------------------------------------------------------- > @OnEvent(component = "operator", value = "change") > public JSONArray onChangeOperatorEvent(String value) { > JSONArray jsonArray = new JSONArray(); > > for (Plaza plaza : getDestinationSelectValues(value)) { > JSONObject jsonObject = new JSONObject(); > jsonObject.put("value", plaza.getId()); > jsonObject.put("label", plaza.getDescription()); > > jsonArray.put(jsonObject); > } > > return jsonArray; > } > ------------------------------------------------------------------ > > function onCompleteOperatorChange(response) { > selectElement = $("entryPlaza"); > responseJSON = response.evalJSON(); > > while (selectElement .options.length > 0) { > selectElement .options[0] = null; > } > > for (index = 0; index < responseJSON .length; index++) { > selectElement.options[index] = new Option(responseJSON > [index].label, responseJSON [index].value); > } > > Tapestry.ElementEffect.highlight($("entryPlaza")); > } > ----------------------------------------------------------- > > -- > View this message in context: > http://www.nabble.com/How-to-use-JavaScript-for-dependent-selects--tp24669071p24669071.html > Sent from the Tapestry - User mailing list archive at Nabble.com. > > > --------------------------------------------------------------------- > To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org > For additional commands, e-mail: users-h...@tapestry.apache.org > Ce message et les pièces jointes sont confidentiels et réservés à l'usage exclusif de ses destinataires. Il peut également être protégé par le secret professionnel. Si vous recevez ce message par erreur, merci d'en avertir immédiatement l'expéditeur et de le détruire. L'intégrité du message ne pouvant être assurée sur Internet, la responsabilité du groupe Atos Origin ne pourra être recherchée quant au contenu de ce message. Bien que les meilleurs efforts soient faits pour maintenir cette transmission exempte de tout virus, l'expéditeur ne donne aucune garantie à cet égard et sa responsabilité ne saurait être recherchée pour tout dommage résultant d'un virus transmis. This e-mail and the documents attached are confidential and intended solely for the addressee; it may also be privileged. If you receive this e-mail in error, please notify the sender immediately and destroy it. As its integrity cannot be secured on the Internet, the Atos Origin group liability cannot be triggered for the message content. Although the sender endeavours to maintain a computer virus-free network, the sender does not warrant that this transmission is virus-free and will not be liable for any damages resulting from any virus transmitted. --------------------------------------------------------------------- To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org For additional commands, e-mail: users-h...@tapestry.apache.org
