This page (revision-184) was last changed on 21-Apr-2017 08:27 by Dieter Käppel

This page was created on 09-Aug-2012 13:29 by Dieter Käppel

Only authorized users are allowed to rename pages.

Only authorized users are allowed to delete pages.

Page revision history

Version Date Modified Size Author Changes ... Change note
184 21-Apr-2017 08:27 36 KB Dieter Käppel to previous
183 21-Apr-2017 08:27 36 KB Dieter Käppel to previous | to last
182 15-Jan-2016 10:18 36 KB Dieter Käppel to previous | to last
181 15-Jan-2016 10:16 36 KB Dieter Käppel to previous | to last

Page References

Incoming links Outgoing links

Version management

Difference between version and

At line 174 added 40 lines
!!Reference-Tag
Der Reference-Tag schafft Zugriff auf den ELContext einer andere Stelle im Komponenten-Baum. Über eine festgelegte Variable kann auf Elemente aus einem beliebigen Kontext zugegriffen werden. Einschließlich iterierte Kontexte, wie sie von <ui:repeat> oder Tabellen erzeugt werden.
In JSF werden oft Components verwendet, die durch Iteration mit <ui:repeat> oder auf andere Art vervielfältigt werden, auch Tables, Trees und ähnliche Komponenten geben wiederholten HTML-Code aus.
Gerade bei vervielfältigtem Code möchte man diesen schlank bauen, da dies für die Effizienz der Web-Seite ausschlaggebend ist. Kontext-Menüs, Popups und andere Elemente, die nur einmal für ein Element geöffnet werden brauchen, sollten also aus der Iteration herausgenommen werden. Doch früher oder später muss auf das Element wieder zugegriffen werden.
In einfachen, wenig zeitkritischen Fällen behilft man sich mit einem AXAJ-Submit. Zum Beispiel:
{{{
<h:form id="form">
<ui:repeat value="#{fn:split('1,2,3,4,5', ',')}" var="index">
<h:commandButton id="button-#{index}" value="Button #{index}">
<f:setPropertyActionListener target="#{bean.selected}" value="#{item}">
<e:ajax onsuccess="showContextMenu();"/>
</h:commandButton>
</c:forEach>
</h:form>
}}}
Allerdings wird dazwischen ein AJAX-Aufruf abgeschickt. Wenn in einem Popup oder Kontextmenu das Element betreffende Dinge neu gerendered werden sollen, sicher der richtige Weg. Bei einfacheren Komponenten oft hinderlich und vom Benutzer als zu "hackig" empfunden. Da kann der Reference-Tag Abhilfe schaffen:
{{{
<h:form id="form">
<c:forEach begin="1" end="5" var="index">
<h:commandButton id="button-#{index}" value="Button #{index}">
<e:setReference for=":form:ref"/>
<e:behavior script="showContextMenu();" disableDefault="true"/>
</h:commandButton>
</c:forEach>
<e:reference id="ref" var="ref">
<h:commandButton value="Show" action="#{test.actionText(ref.index)}">
<f:ajax/>
</h:commandButton>
</e:reference>
</h:form>
}}}
__Erklärung:__ Der Tag <e:setReference> ist ein ClientBehavior, also JavaScript für den Tag <e:reference>. Beim Klicken eines der iterierten Command-Buttons wird die Referenz des Tags <e:reference> gesetzt, ohne einen Request zum Server abzuschicken. Beim Klicken des unteren Command-Buttons "Show" wird mit "ref.index" auf den ELContext des referenzierten Buttons zugegriffen, also die Variable "index" die zum Iterieren verwendet wurde.