Naming Container in JSF2 / PrimeFaces

Quali sono i possibili contenitori di denominazione in PrimeFaces? Perché è necessario aggiungere l’id del contenitore di denominazione per la chiamata all’aggiornamento Ajax quando si desidera aggiornare un controllo dell’interfaccia utente sul modulo utilizzando update=":mainForm:MainAccordian:userNameTextbox" ?

Dopo aver effettuato la scansione di IntelliJ tutti i miei JAR per le implementazioni di javax.faces.component.NamingContainer ecco cosa ho trovato:

Da PrimeFaces 5.3

  • AccordionPanel
  • Giostra
  • colonne
  • DataGrid
  • DataList
  • DataScroller
  • Tabella dati
  • Pagina
  • Squillare
  • SubTable
  • visualizzazione secondaria
  • TabView
  • TreeTable
  • UIData
  • UITabPanel

Da MyFaces 2.1

  • HtmlDataTable
  • HtmlForm
  • UITree
  • UIForm

Quali sono i possibili contenitori di denominazione in Prime facce

Nei contenitori di denominazione JSF derivano da UINamingContainer .

perché è necessario aggiungere l’id del contenitore di denominazione per la chiamata di aggiornamento Ajax quando si desidera aggiornare un controllo dell’interfaccia utente sul modulo utilizzando update = “: mainForm: MainAccordian: userNameTextbox”

Diciamo, e aggiungi un altro alla tua pagina, riceverai un errore che dice che hai un ID duplicato . Puoi cercarlo qui su JavaDoc per UIComponent.setId (String) :

Imposta l’identificativo del componente di questo UIComponent (se presente). Gli identificatori di componenti devono rispettare le seguenti restrizioni di syntax: Non deve essere una stringa di lunghezza zero. Il primo carattere deve essere una lettera o un trattino basso (‘ ‘). I caratteri successivi devono essere una lettera, una cifra, un carattere di sottolineatura (‘ ‘) o un trattino (‘-‘).

.. inoltre, importante per te:

L’identificatore specificato deve essere univoco tra tutti i componenti (compresi gli sfaccettature) che sono discendenti dell’antenato UIComponent più vicino che è un NamingContainer o nell’ambito dell’intero albero dei componenti se non esiste un predecessore che sia NamingContainer.

Significa che non è ansible avere due componenti con lo stesso ID sotto lo stesso NamingContainer (se non si ha NamingContainer), l’intero albero viene conteggiato come NamingContainer). Pertanto è necessario aggiungere un NamingContainer, come un

Prendiamo il seguente esempio:

        

.. e vuoi fare un aggiornamento a userNameTextbox . A quale userNameTextbox ti riferisci perché ci sono 3?

Il primo? Quindi aggiorna userNameTextbox

Il secondo? Quindi aggiornare container1: userNameTextbox

Il terzo? Quindi aggiornare container2: userNameTextbox

Denominare i contenitori in Prime Faces

Come possiamo vedere nel riferimento JSF

NamingContainer è un’interfaccia che deve essere implementata da qualsiasi UIComponent che vuole essere un contenitore di denominazione. I contenitori di nomi influenzano il comportamento dei metodi UIComponent.findComponent (java.lang.String) e UIComponent.getClientId ();

Quindi per trovare i Naming Containers in PF è necessario controllare la gerarchia dell’interfaccia NamingContainer. In Eclipse puoi farlo, ad esempio, tramite la scorciatoia Ctrl + T su NamingContainer.

In PF 5.3 esistono ad esempio: AccordionPanel, Carousel, Columns, DataGrid, DataList, DataScroller, DataTable, Ring, SubTable, TabView, Tree, TreeTable.

Influenza del Naming Container sull’id quadro del componente

  1. Comportamento predefinito

Il Naming Container fornisce un ambito di denominazione per i suoi componenti figlio. Quindi aggiunge sempre il prefisso al suo id figli. Quindi id del componente figlio è: parent_component_id".concat(":").concat("component_id") . C’è un suggerimento pro che avevo letto in JavaServer Faces 2.0, Il riferimento completo che anche se non aggiungi NamingContainer al tuo pagina viene sempre automaticamente aggiunta da JSF stesso 🙂 Esiste anche un algoritmo speciale di questa creazione (Capitolo 11: Creazione di componenti UI personalizzati -> Box chiamato “Regole per la creazione del componente di primo livello per un componente composito”). Ovviamente quando non si imposta id, verrà generato automaticamente (ad esempio j_idt234). L’id del componente completo potrebbe essere simile a questo: “j_idt123: j_idt234: j_idt345”.

  1. Cambia il separatore dei nomi dei componenti (dal JSF 2.x)

Esiste un modo per sostituire il separatore dei nomi dei componenti predefinito (“:”). Puoi definirlo in web.xml come context-param con il nome javax.faces.SEPARATOR_CHAR. Per esempio:

  javax.faces.SEPARATOR_CHAR -  
  1. Attributo UIForm “prependId”

Per evitare di aggiungere scope al componente figlio, esiste un attributo (solo nel componente UIForm). Ma questa soluzione non è raccomandata. Dai un’occhiata ad esempio a uiform-with-prependid-false-breaks-fajax-render

Utilizzo dell’ID componente (ad esempio in “aggiornamento”, “processo”)

  1. Intero ID

È ansible utilizzare l’ID completo: “componenteParent: componente”. Questo non è raccomandato (il codice sarà fragile, eventuali modifiche all’ID causeranno la necessità di cambiare ID in molti punti).

  1. ID relativi nello stesso livello del contenitore di denominazione

All’interno di un contenitore di denominazione è ansible utilizzare l’id del componente semplice.

  1. Framework Expression Search di PrimeFaces

Se non si conosce questa funzione, consultare la documentazione di PrimeFaces. Prime Faces fornisce Search Expression Framework con un paio di meccanismi molto utili.

Puoi cercare per parole chiave.

Le parole chiave sono il modo più semplice per fare riferimento ai componenti, vengono risolti in ID in modo che se un ID cambia, il riferimento non deve essere modificato. Core JSF fornisce un paio di parole chiave e PrimeFaces fornisce di più insieme al supporto delle espressioni composite.

Esempi: @questo (componente corrente), @form (modulo antenato più vicino), @namingcontainer (contenitore di denominazione degli antenati più vicino), @parent, @widgetVar (nome). Puoi anche mescolare queste parole chiave in percorsi abbastanza complessi (Espressioni composite) per esempio: @form: @parent, @questo: @parent: @parent

La seconda posibilità PF ti dà i PrimeFaces Selectors (PFS).

PFS integra l’API jQuery Selector con il modello di riferimento del componente JSF in modo tale che il riferimento possa essere fatto usando l’API jQuery Selector invece del modello JSF basato sull’ID core.

Quindi puoi per esempio:

  • aggiorna tutti gli elementi del modulo con update="@(form)"
  • aggiornare tutti i datatables tramite update="@(.ui-datatable)"
  • aggiorna tutti i componenti che ha styleClass chiamato myStyle by update="@(.myStyle)"

Piuttosto uno strumento potente.