JSF - h: selectManyCheckbox

Il tag h: selectManyCheckbox restituisce un insieme di elementi di input HTML di tipo "checkbox" e lo formatta con tag di tabella ed etichetta HTML.

Tag JSF

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

Output renderizzato

<table>
   <tr>
      <td>
         <input name = "j_idt6:j_idt8" id = "j_idt6:j_idt8:0" value = "1" 
            type = "checkbox" checked = "checked" />
         <label for = "j_idt6:j_idt8:0" class = ""> Item 1</label>
      </td>
      
      <td>
         <input name = "j_idt6:j_idt8" id = "j_idt6:j_idt8:1" value = "2" 
            type = "checkbox" checked = "checked" />
         <label for = "j_idt6:j_idt8:1" class = ""> Item 2</label>
      </td>     
   </tr>
</table>

Attributi dei tag

S.No Attributo e descrizione
1

id

Identificatore per un componente

2

binding

Riferimento al componente che può essere utilizzato in un backing bean

3

rendered

Un booleano; false sopprime il rendering

4

styleClass

Nome della classe CSS (Cascading stylesheet)

5

value

Il valore di un componente, in genere un'associazione di valori

6

valueChangeListener

Un metodo che si lega a un metodo che risponde alle modifiche del valore

7

converter

Nome della classe del convertitore

8

validator

Nome della classe di un validatore creato e collegato a un componente

9

required

Un booleano; se vero, richiede l'inserimento di un valore nel campo associato

10

accesskey

Una chiave, tipicamente combinata con una metakey definita dal sistema, che mette a fuoco un elemento

11

accept

Elenco separato da virgole di tipi di contenuto per un modulo

12

accept-charset

Elenco separato da virgole o spazi di codifiche di caratteri per un modulo. Ilaccept-charset l'attributo è specificato con l'attributo HTML JSF denominato acceptcharset.

13

alt

Testo alternativo per elementi non testuali come immagini o applet

14

charset

Codifica dei caratteri per una risorsa collegata

15

coords

Coordinate per un elemento la cui forma è un rettangolo, un cerchio o un poligono

16

dir

Direzione per il testo. I valori validi sonoltr (da sinistra a destra) e rtl (da destra a sinistra)

17

disabled

Stato disabilitato di un elemento o pulsante di input

18

hreflang

Lingua di base di una risorsa specificata con href attributo; hreflang può essere utilizzato solo con href.

19

lang

Lingua di base degli attributi e del testo di un elemento

20

maxlength

Numero massimo di caratteri per i campi di testo

21

readonly

Stato di sola lettura di un campo di input; il testo può essere selezionato in un campo di sola lettura ma non modificato

22

rel

Relazione tra il documento corrente e un collegamento specificato con href attributo

23

rev

Collegamento inverso dall'ancora specificato con hrefal documento corrente. Il valore dell'attributo è un elenco di tipi di collegamento separato da spazi

24

rows

Numero di righe visibili in un'area di testo. h:dataTable ha un rows attributo, ma non è un attributo pass-through HTML.

25

shape

Forma di una regione. Valori validi:default, rect, circle, poly. (l'impostazione predefinita indica l'intera regione)

26

style

Informazioni sullo stile in linea

27

tabindex

Valore numerico che specifica un indice di tabulazione

28

target

Il nome di un frame in cui viene aperto un documento

29

title

Un titolo, utilizzato per l'accessibilità, che descrive un elemento. I browser visivi in ​​genere creano suggerimenti per il valore del titolo

30

type

Tipo di collegamento; per esempio,stylesheet

31

width

Larghezza di un elemento

32

onblur

L'elemento perde la concentrazione

33

onchange

Il valore dell'elemento cambia

34

onclick

Si fa clic sul pulsante del mouse sull'elemento

35

ondblclick

Si fa doppio clic sul pulsante del mouse sull'elemento

36

onfocus

L'elemento riceve il fuoco

37

onkeydown

Viene premuto il tasto

38

onkeypress

Il tasto viene premuto e successivamente rilasciato

39

onkeyup

La chiave viene rilasciata

40

onmousedown

Il pulsante del mouse viene premuto sull'elemento

41

onmousemove

Il mouse si sposta sull'elemento

42

onmouseout

Il mouse lascia l'area dell'elemento

43

onmouseover

Il mouse si sposta su un elemento

44

onmouseup

Il pulsante del mouse viene rilasciato

45

onreset

Il modulo viene ripristinato

46

onselect

Il testo viene selezionato in un campo di immissione

47

disabledClass

Classe CSS per elementi disabilitati

48

enabledClass

Classe CSS per elementi abilitati

49

layout

Specifica della disposizione degli elementi: lineDirection (orizzontale) o pageDirection (verticale)

50

border

Bordo dell'elemento

Applicazione di esempio

Creiamo un'applicazione JSF di prova per testare il tag precedente.

Passo Descrizione
1 Creare un progetto con un nome helloworld sotto un pacchetto com.tutorialspoint.test come spiegato nel capitolo JSF - Prima applicazione .
2 Modifica home.xhtml come spiegato di seguito. Mantieni invariato il resto dei file.
3 Crea result.xhtml nella directory webapps come spiegato di seguito.
4 Creare UserData.java come bean gestito nel pacchetto com.tutorialspoint.test come spiegato di seguito.
5 Compilare ed eseguire l'applicazione per assicurarsi che la logica aziendale funzioni secondo i requisiti.
6 Infine, crea l'applicazione sotto forma di file war e distribuiscila nel server Web Apache Tomcat.
7 Avvia la tua applicazione web utilizzando l'URL appropriato come spiegato di seguito nell'ultimo passaggio.

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:selectManyCheckbox example</h2>
      <hr />
      
      <h:form>
         <h3>Mutiple checkboxes</h3> 
         <h:selectManyCheckbox 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:selectManyCheckbox>
         <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>

Una volta che sei pronto con tutte le modifiche apportate, compiliamo ed eseguiamo l'applicazione come abbiamo fatto nel capitolo JSF - Crea applicazione. Se tutto va bene con la tua applicazione, questo produrrà il seguente risultato.

Selezionare più caselle di controllo e premere Submitpulsante. Abbiamo selezionato quattro elementi. Vedrai i risultati selezionati.