JSF - h: selectManyListbox

La balise h: selectManyListbox rend un élément d'entrée HTML de type "select" avec une taille et multiple spécifié.

Balise JSF

<h:selectManyListbox value = "#{userData.data}"> 
   <f:selectItem itemValue = "1" itemLabel = "Item 1" /> 
   <f:selectItem itemValue = "2" itemLabel = "Item 2" />
</h:selectOneListbox>

Sortie rendue

<select name = "j_idt6:j_idt8" size = "2" multiple = "multiple">  
   <option value = "1">Item 1</option> 
   <option value = "2">Item 2</option> 
</select>

Attributs de balise

S. Non	Attribut et description
1	id Identifiant d'un composant
2	binding Référence au composant qui peut être utilisé dans un backing bean
3	rendered Un booléen; false supprime le rendu
4	styleClass Nom de classe de feuille de style en cascade (CSS)
5	value La valeur d'un composant, généralement une liaison de valeur
6	valueChangeListener Une méthode qui se lie à une méthode qui répond aux changements de valeur
sept	converter Nom de la classe de convertisseur
8	validator Nom de classe d'un validateur créé et attaché à un composant
9	required Un booléen; si vrai, nécessite la saisie d'une valeur dans le champ associé
dix	accesskey Une clé, généralement combinée à une métakey définie par le système, qui donne le focus à un élément
11	accept Liste des types de contenu séparés par des virgules pour un formulaire
12	accept-charset Liste de codages de caractères séparés par des virgules ou des espaces pour un formulaire. leaccept-charset l'attribut est spécifié avec l'attribut HTML JSF nommé acceptcharset.
13	alt Texte alternatif pour les éléments non textuels tels que des images ou des applets
14	charset Codage de caractères pour une ressource liée
15	coords Coordonnées d'un élément dont la forme est un rectangle, un cercle ou un polygone
16	dir Direction du texte. Les valeurs valides sontltr (de gauche à droite) et rtl (de droite à gauche)
17	disabled État désactivé d'un élément d'entrée ou d'un bouton
18	hreflang Langue de base d'une ressource spécifiée avec le href attribut; hreflang ne peut être utilisé qu'avec href.
19	lang Langue de base des attributs et du texte d'un élément
20	maxlength Nombre maximum de caractères pour les champs de texte
21	readonly État en lecture seule d'un champ d'entrée; le texte peut être sélectionné dans un champ en lecture seule mais pas modifié
22	rel Relation entre le document courant et un lien spécifié avec le href attribut
23	rev Lien inverse à partir de l'ancre spécifiée avec hrefau document actuel. La valeur de l'attribut est une liste de types de liens séparés par des espaces
24	rows Nombre de lignes visibles dans une zone de texte. h:dataTable a un rows attribut, mais ce n'est pas un attribut HTML pass-through.
25	shape Forme d'une région. Valeurs valides:default, rect, circle, poly. (par défaut signifie toute la région)
26	style Informations de style en ligne
27	tabindex Valeur numérique spécifiant un index de tabulation
28	target Le nom d'un cadre dans lequel un document est ouvert
29	title Un titre, utilisé pour l'accessibilité, qui décrit un élément. Les navigateurs visuels créent généralement des info-bulles pour la valeur du titre
30	type Type de lien; par exemple,stylesheet
31	width Largeur d'un élément
32	onblur L'élément perd le focus
33	onchange Changements de valeur de l'élément
34	onclick Le bouton de la souris est cliqué sur l'élément
35	ondblclick Le bouton de la souris est double-cliqué sur l'élément
36	onfocus L'élément reçoit le focus
37	onkeydown La touche est enfoncée
38	onkeypress La touche est enfoncée puis relâchée
39	onkeyup La clé est libérée
40	onmousedown Le bouton de la souris est enfoncé sur l'élément
41	onmousemove La souris se déplace sur l'élément
42	onmouseout La souris quitte la zone de l'élément
43	onmouseover La souris se déplace sur un élément
44	onmouseup Le bouton de la souris est relâché
45	onreset Le formulaire est réinitialisé
46	onselect Le texte est sélectionné dans un champ de saisie
47	size Taille du champ de saisie

Exemple d'application

Créons une application JSF de test pour tester la balise ci-dessus.

Étape	La description
1	Créez un projet avec un nom helloworld sous un package com.tutorialspoint.test comme expliqué dans le chapitre JSF - Première application .
2	Modifiez home.xhtml comme expliqué ci-dessous. Gardez le reste des fichiers inchangé.
3	Créez result.xhtml dans le répertoire webapps comme expliqué ci-dessous.
4	Créez UserData.java en tant que bean géré sous le package com.tutorialspoint.test comme expliqué ci-dessous.
5	Compilez et exécutez l'application pour vous assurer que la logique métier fonctionne conformément aux exigences.
6	Enfin, créez l'application sous la forme d'un fichier war et déployez-la dans Apache Tomcat Webserver.
sept	Lancez votre application Web en utilisant l'URL appropriée, comme expliqué ci-dessous à la dernière étape.

UserData.java

package com.tutorialspoint.test;

import java.io.Serializable;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

@ManagedBean(name = "userData", eager = true)
@SessionScoped
public class UserData implements Serializable {
   private static final long serialVersionUID = 1L;
   public String[] data = {"1","2","3"};

   public String[] getData() {
      return data;
   }

   public void setData(String[] data) {
      this.data = data;
   }
}

home.xhtml

<?xml version = "1.0" encoding = "UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns = "http://www.w3.org/1999/xhtml"
   xmlns:f = "http://java.sun.com/jsf/core"    
   xmlns:h = "http://java.sun.com/jsf/html">
   
   <head>
      <title>JSF Tutorial!</title>
   </head>
   
   <h:body>
      <h2>h:selectManyListbox example</h2>
      <hr />
      
      <h:form>
         <h3>List Box</h3> 
         <h:selectManyListbox value = "#{userData.data}">
            <f:selectItem itemValue = "1" itemLabel = "Item 1" />
            <f:selectItem itemValue = "2" itemLabel = "Item 2" />
            <f:selectItem itemValue = "3" itemLabel = "Item 3" />
            <f:selectItem itemValue = "4" itemLabel = "Item 4" />
            <f:selectItem itemValue = "5" itemLabel = "Item 5" />
         </h:selectManyListbox>
         <h:commandButton value = "Submit" action = "result" />
      </h:form> 		
   
   </h:body>
</html>

result.xhtml

<?xml version = "1.0" encoding = "UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns = "http://www.w3.org/1999/xhtml"
   xmlns:f = "http://java.sun.com/jsf/core"    
   xmlns:h = "http://java.sun.com/jsf/html"
   xmlns:ui = "http://java.sun.com/jsf/facelets">
   
   <h:body>
      <h2>Result</h2>
      <hr />
      
      <ui:repeat value = "#{userData.data}" var = "s">		
         #{s}
      </ui:repeat>   	
   </h:body>
</html>

Une fois que vous êtes prêt avec tous les changements effectués, laissez-nous compiler et exécuter l'application comme nous l'avons fait dans le chapitre JSF - Créer une application. Si tout va bien avec votre application, cela produira le résultat suivant.

Sélectionnez plusieurs valeurs et appuyez sur SubmitNous avons sélectionné quatre éléments. Vous verrez les résultats sélectionnés.

↰ Previous page