liste DropDownChoice "dynamique"

**lerab51** · 25/03/2010, 18h15

Bonjour,

Voici mon soucis,
j'ai 2 radios boutons et une liste déroulante en dessous qui propose des choses différentes suivant que ce soit l'un ou l'autre des boutons radio qui est coché.

Je suis à la recherche d'un exemple de code qui propose ça
j'ai vu là dessus http://www.wicket-library.com/wicket.../ajax/choice.5

mais je n'arrive pas à mettre le code en oeuvre

Si vous avez un exemple complet qui fonctionne je suis preneur
je vais continuez mon implementation je posterai du code si besoin

merci de votre aide

**joseph_p** · 25/03/2010, 21h53

bonsoir lerab51

Il existe aussi la liste des composants wicket, notamment cette page pour les radios: wicket.markup.html.form.RadioGroup and wicket.markup.html.form.Radio

Par ailleurs, les éléments type RadioGroup/CheckBox et autres listes ont souvent une méthode wantOnSelectionChangedNotifications() que l'on peut surcharger. Cela permet de déclencher des A/R client/serveur sans que l'utilisateur n'ait pressé de bouton. Cela correspond exactement au besoin présenté ici : à chaque modification de l'état du RadioGroup, on veut un A/R afin de réaliser des mises à jour.

Pour rendre le tout ajax, il y a soit la possibilité des composants ajax (ajaxcheckbox par exemple), soit d'utiliser AjaxFormComponentUpdatingBehavior (pour les composants "simples" type input) ou AjaxFormChoiceComponentUpdatingBehavior (pour les composants groupés type RadioGroup). Ces behavior font en sorte que les A/R client/serveur soient ajaxifiés.

Une remarque, sur l'Ajax dans wicket : côté serveur, un objet AjaxRequestTarget est passé. Il faut y signaler tous les composants que wicket doit redessiner, par exemple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
protected void onUpdate(AjaxRequestTarget target){
target.addComponent(monComposant1);
target.addComponent(getForm());
// cette derniere ligne permet de redessiner tout le formulaire, raccourci souvent utile
}

Cela donne un contrôle total sur l'ampleur du rafraichissement via Ajax.

Enfin, un élément très important à assimiler est le concept des modèles. L'article Exploration des modèles de Wicket constitue une très bonne introduction.

En cas de questions précises, ne pas hésiter !

bon courage
joseph

**joseph_p** · 26/03/2010, 15h10

NB : si jamais la mise en oeuvre est trop compliquée/progresse trop lentement, je peux aisément fournir un exemple fonctionnel. C'est peu de lignes de code au final : il s'agit surtout de bien comprendre/connaitre wicket/l'Ajax.

bonne fin de journée
joseph

**lerab51** · 30/03/2010, 14h56

Bonjour
Merci je veux bien un petit bout de code car j avance pas vite je suis sur plein de probleme de wicket à la fois et je n en fais que depuis peu.
D'aiileurs je pense ouvrir un autre post sur un autre probleme

**joseph_p** · 31/03/2010, 00h19

salut lerab51

j'étais de sortie, je viens donc juste de faire l'exemple.

Par contre, je crains qu'il ne soit pas un peu compliqué... Questions bienvenues donc !

Pour info mon exemple, je suis parti du quickstart, l'exemple consistant à choisir le sexe d'une personne et de là le titre correspondant. Ces données sont données via un enum, histoire de faciliter l'exemple (ne pas trop s'y attarder donc, en réalité les données viennent souvent d'une base de données.

J'ai modifié l'HomePage comme suit :
HomePage.java :

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
package org.demo;
 
import org.apache.wicket.PageParameters;
import org.apache.wicket.markup.html.WebPage;
import org.apache.wicket.markup.html.basic.Label;
import org.apache.wicket.model.Model;
 
/**
 * Homepage
 */
public class HomePage extends WebPage {
 
	private static final long serialVersionUID = 1L;
 
	/**
         * Constructor that is invoked when page is invoked without a session.
         * 
         * @param parameters
         *            Page parameters
         */
	public HomePage(final PageParameters parameters) {
		Model<Person> model = new Model<Person>(new Person());
		add(new PersonEditPanel("personEdit", model));
	}
}

HomePage.html :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
<html xmlns:wicket="http://wicket.apache.org/dtds.data/wicket-xhtml1.4-strict.dtd">
    <head>
        <title>Wicket Quickstart Archetype Homepage</title>
    </head>
    <body>
        Person edit form:
        <div wicket:id="personEdit">
        </div>
    </body>
</html>

PersonEditPanel.java:

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
75
76
77
78
79
80
 
package org.demo;
 
import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;
 
import org.apache.wicket.ajax.AjaxRequestTarget;
import org.apache.wicket.ajax.form.AjaxFormChoiceComponentUpdatingBehavior;
import org.apache.wicket.markup.html.basic.Label;
import org.apache.wicket.markup.html.form.DropDownChoice;
import org.apache.wicket.markup.html.form.Form;
import org.apache.wicket.markup.html.form.Radio;
import org.apache.wicket.markup.html.form.RadioGroup;
import org.apache.wicket.markup.html.list.ListItem;
import org.apache.wicket.markup.html.list.ListView;
import org.apache.wicket.markup.html.panel.Panel;
import org.apache.wicket.model.AbstractReadOnlyModel;
import org.apache.wicket.model.IModel;
import org.apache.wicket.model.PropertyModel;
 
public class PersonEditPanel extends Panel {
 
	public PersonEditPanel(String id, IModel<Person> model) {
		super(id);
 
		add(new PersonEditForm("form", model));
	}
 
	static class PersonEditForm extends Form<Person> {
 
		public PersonEditForm(String id, IModel<Person> model) {
			super(id, model);
 
			final RadioGroup<Gender> group = new RadioGroup<Gender>("group",
					new PropertyModel<Gender>(model, "gender")) {
				@Override
				protected boolean wantOnSelectionChangedNotifications() {
					return true;
				}
			};
			group.add(new AjaxFormChoiceComponentUpdatingBehavior() {
 
				@Override
				protected void onUpdate(AjaxRequestTarget target) {
					target.addComponent(PersonEditForm.this);
				}
 
			});
			ListView<Gender> genderChoices = new ListView<Gender>("choices",
					Gender.getList()) {
 
				@Override
				protected void populateItem(ListItem<Gender> item) {
					Radio<Gender> radio = new Radio<Gender>("genderChoice",
							item.getModel());
					item.add(radio);
					item.add(new Label("label", item.getModelObject().name()));
 
				}
 
			};
			group.add(genderChoices);
			add(group);
 
			DropDownChoice<String> titleChoice = new DropDownChoice<String>(
					"titleSelect", new PropertyModel<String>(model, "title"),
					new AbstractReadOnlyModel<List<String>>() {
						@Override
						public List<String> getObject() {
							ArrayList<String> list = new ArrayList<String>(
									Arrays.asList(group.getModelObject()
											.getTitles()));
							return list;
						}
					});
			add(titleChoice);
		}
	}
}

PersonEditPanel.html

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
 
<html>
    <body>
        <wicket:panel>
            <form wicket:id="form">
                <div wicket:id="group">
                    <div wicket:id="choices">
                        <input wicket:id="genderChoice" type="radio"/><span wicket:id="label"></span>
                    </div>
                </div>
                <select wicket:id="titleSelect">
                </select>
            </form>
        </wicket:panel>
    </body>
</html>

Côté code métier, j'ai fait avec un Person.java:

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
package org.demo;
 
import java.io.Serializable;
 
public class Person implements Serializable {
	private Gender gender = Gender.DEFAULT;
 
	private String title;
 
	public Gender getGender() {
		return gender;
	}
 
	public void setGender(Gender gender) {
		this.gender = gender;
	}
 
	public String getTitle() {
		return title;
	}
 
	public void setTitle(String title) {
		this.title = title;
	}
 
}

et Gender.java :

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
package org.demo;
 
import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;
 
public enum Gender {
	MALE("Boy", "Mister", "Elder"), FEMALE("Miss", "Madam", "Grandma");
	public static final Gender DEFAULT = MALE;
	private final String[] titles;
 
	Gender(String... titles) {
		this.titles = titles;
	}
 
	public String[] getTitles() {
		return titles;
	}
 
	public static List<Gender> getList() {
		return new ArrayList<Gender>(Arrays.asList(values()));
	}
 
}

Il est aisé de constater que tout le code métier est écrit en Java, et que l'html fourni est un modèle de simplicité. De même, PersonEditPanel est un composant aisément réutilisable. Bref, que du bon

Il y d'éventuelles optimisations possibles de ci de là, mais j'ai pas voulu trop compliquer la chose.

cordialement,
joseph

**lerab51** · 04/04/2010, 20h31

Et bien Ecoutes merci beaucoup c'est impeccable, je vais mettre ça en oeuvre

Merci

liste DropDownChoice "dynamique"

Wicket Java

Vue hybride

Discussions similaires

Partager

Partager