Loading:

Książka Zend Framework 3. Poradnik Programisty.

Definicje tagów HTML w JSF [Java Server Faces]

Ta podręczna lista referencji, definiuje standardowe tagi HTML, które są generowane przez JSF. Dla tych tagów, musisz, użyć podanego uri atrybutu dla dyrektywy taglib w pliku JSP:

 

http://java.sun.com/jsf/html

Tabela ukazuje przykałdy HTML kodów, oraz użycie proporcjonalne dla JSF biblioteki tagów:

 

Tag JSF

Odpowiednik HTML

UIForm
form
<h:form id="jsftags">
...
</h:form>
<form id="jsftags" method="post"
action="/jsftags/faces/pages/tags.jsp"
enctype="application/x-www-form-urlencoded">
...
<input type="hidden" name="jsftags"
value="jsftags" />
<input type="hidden" name="jsftags:link" />
</form>
UICommand
commandButton
<h:commandButton
id="submit"
value="#{msg.buttonHeader}"
action="nextPage">
</h:commandButton>
<input
id="_id0:submit"
type="submit"
name="_id0:submit"
value="Next Step"/>
commandLink
<h:commandLink id="link" action="goto">
<h:outputText value="#{msg.linkName}"/>
</h:commandLink>

<a id="_id0:link"
href="#" onclick=
"document.forms['_id0']['_id0:link'].value=
'_id0:link';
document.forms['_id0'].submit();
return false;">Next Page</a>
UIGraphic
graphicImage
<h:graphicImage id="image"
alt="jsf-sun"
url="/images/jsf-sun.gif">
</h:graphicImage>
<img id="jsftags:image"
src="/jsf-example/images/jsf-sun.gif"
alt="jsf-sun" />
UIInput
inputText
<h:inputText id="address"
value="#{jsfexample.address}" />
<input type="text" name="jsftags:_id1"
value="123 JSF Ave" />
inputSecret
<h:inputSecret redisplay="false"
value="#{jsfexample.password}" />

<input id="jsftags:password"
type="password"
name="jsftags:password"
value="secret" />
inputHidden
<h:inputHidden id="hidden"
value="userPreference" />
<input id="jsftags:hidden"
type="hidden"
name="jsftags:hidden"
value="userPreference" />
inputTextArea
<h:inputTextarea id="textArea"
rows="4" cols="7"
value="Text goes here.."/>
<textarea id="jsftags:textArea"
name="jsftags:textArea"
cols="5" rows="3">
Text goes here..
</textarea>
UIOutput
outputText
<h:outputText
value="#{jsfexample.zipCode}"/>
10032
outputLabel
<h:outputLabel for="address">
<h:outputText id="addressLabel"
value="User Home Address"/>
</h:outputLabel>

<span id="jsftags:addressLabel">
User Home Address</span>
outputLink
<h:outputLink
value="#{msg['jsfstudio.home.url']">
<f:verbatim>Funkcje.net</f:verbatim>
</h:outputLink>
<a href="http://www.funkcje.net">
Funkcje.net
</a>
outputFormat
<h:outputFormat
value="#{msg.jsfstudioThankYou}">
<f:param value="Joe Blow"/>
<f:param id="productName"
value="#{msg['jsfstudio.label']}"/>
</h:outputFormat>
Thank you, Joe Blow, for tryimg Exadel JSF Studio!
UIMessage and UIMessages
message
Enter address:
<h:message style="color: red"
for="useraddress" />
<h:inputText id="useraddress"
value="#{jsfexample.address}"
required="true"/>
<h:commandButton action="save" value="Save"/>
Enter address:
<span style="color: red">
Validation Error: Value is required.
</span>
<input id="jsftags:useraddress"
type="text"
name="jsftags:useraddress" value="" />
<input type="submit" name="jsftags:_id1"
value="Save" />
UISelectBoolean
selectBooleanCheckbox
<h:selectBooleanCheckbox
title="emailUpdates"
value="#{jsfexample.wantsEmailUpdates}" >
</h:selectBooleanCheckbox>
<h:outputText
value="Tekst.."/>
<input type="checkbox"
name="jsftags:_id6" checked
title="emailUpdates" />
Tekst..?
UISelectMany
selectManyCheckboxlist
<h:selectManyCheckbox id="cars"
value="#{carsBean.car}">
<f:selectItems
value="#{carBean.carList}"/>
</h:selectManyCheckbox>
<span id="jsftags:cars">
<table>
<tr>
<td><label for="jsftags:cars">
<input name="jsftags:cars"
value="accord" type="checkbox">
Honda Accord</input>
</label></td>
<td><label for="jsftags:cars">
<input name="jsftags:cars"
value="4runner" type="checkbox">
Toyota 4Runner</input>
</label></td>
<td><label for="jsftags:cars">
<input name="jsftags:cars"
value="nissan-z" type="checkbox">
Nissan Z350</input<
</label></td>
</tr>
</table>
</span>
selectManyMenu
<h:selectManyMenu
id="cars_selectManyMenu"
value="#{carBean.car}">
<f:selectItems
value="#{carBean.carList}"/>
</h:selectManyMenu>
<select id="jsftags:cars_selectManyMenu"
name="jsftags:cars_selectManyMenu"
multiple size="1">
<option value="accord">Honda Accord</option>
<option value="4runner">Toyota 4Runner</option>
<option value="nissan-z">Nissan Z350</option>
</select>
selectManyListbox
<h:selectManyListbox
id="cars_selectManyListbox"
value="#{carBean.car}">
<f:selectItems
value="#{carBean.carList}"/>
</h:selectManyListbox>
<select id="jsftags:cars_selectManyListbox"
name="jsftags:cars_selectManyListbox"
multiple size="3">
<option value="accord">Honda Accord</option>
<option value="4runner">Toyota 4Runner</option>
<option value="nissan-z">Nissan Z350</option>
</select>
UISelectOne
selectOneRadio
<h:selectOneRadio
value="#{carBean.currentCar}">
<f:selectItems
value="#{carBean.carList}" />
</h:selectOneRadio>
<table><tr>
<td>
<label for="jsftags:_id9">
<input type="radio"
name="jsftags:_id9" value="accord">
Honda Accord
</input></label>
</td>
<td>
<label for="jsftags:_id9">
<input type="radio"
name="jsftags:_id9" value="4runner">
Toyota 4Runner
</input></label>
</td>
<td>
<label for="jsftags:_id9">
<input type="radio"
name="jsftags:_id9" value="nissan-z">
Nissan Z350
</input>/label>
</td>
</tr></table>
selectOneMenu
<h:selectOneMenu id="selectCar"
value="#{carBean.currentCar}">
<f:selectItems
value="#{carBean.carList}" />
</h:selectOneMenu>

<select id="jsftags:selectCar"
name="jsftags:selectCar" size="1">
<option value="accord">Honda Accord</option>
<option value="4runner">Toyota 4Runner</option>
<option value="nissan-z">Nissan Z350</option>
</select>
selectOneListbox
<h:selectOneListbox id="pickCar"
value="#{carBean.currentCar}">
<f:selectItems
value="#{carBean.carList}" />
</h:selectOneListbox>

<select id="jsftags:pickCar"
name="jsftags:selectCar" size="3">
<option value="accord">Honda Accord</option>
<option value="4runner">Toyota 4Runner</option>
<option value="nissan-z">Nissan Z350</option>
</select>

UIPanel
Grid and Group
<h:panelGrid columns="4" footerClass="subtitle" 
headerClass="subtitlebig" styleClass="medium"
columnClasses="subtitle,medium">
<f:facet name="header">
<h:outputText value="Table with numbers"/>
</f:facet>
<h:outputText value="1" />
<h:outputText value="2" />
<h:outputText value="3" />
<h:outputText value="4" />
<h:outputText value="5" />
<h:outputText value="6" />
<h:outputText value="7" />
<f:facet name="footer">
<h:panelGroup>
<h:outputText value="one row" />
<h:outputText value=" " />
<h:outputText
value="grouped with panelGroup" />
</h:panelGroup>
</f:facet>
</h:panelGrid>
<table class="medium">
<thead>
<tr><th class="subtitlebig" colspan="4"
scope="colgroup">Table with numbers</th>
</tr>
</thead>
<tfoot>
<tr><td class="subtitle"
colspan="4">
one row grouped with panelGroup
</td>
</tr>
</tfoot>
<tbody>
<tr>
<td class="subtitle">1</td>
<td class="medium">2</td>
<td class="subtitle">3</td>
<td class="medium">4</td>
</tr>
<tr>
<td class="subtitle">5</td>
<td class="medium">6</td>
<td class="subtitle">7</td>
</tr>
</tbody>
</table>

UIColumn and UIData
dataTable and column
<h:dataTable id="books"
columnClasses="list-column-center,
list-column-right, list-column-center,
list-column-right" headerClass="list-header"
rowClasses="list-row" styleClass="list-
background" value="#{BookStore.items}" var="store">
<h:column>
<f:facet name="header">
<h:outputText value="#{msg.storeNameLabel}"/>
</f:facet>
<h:outputText value="#{store.name}"/>
</h:column>
<h:column>
<f:facet name="header">
<Subject
</f:facet>
<h:outputText value="#{store.subject}"/>
</h:column>
<h:column>
<f:facet name="header">
<h:outputText value="#{msg.storePriceLabel}"/>
</f:facet>
<h:outputText value="#{store.price}"/>
</h:column>
</h:dataTable>
<table id="jsftags:books"
class="list-background">
<thead>
<tr>
<th class="list-header"
scope="col">Title</th>
<th class="list-header"
scope="col">Subject</th>
<th class="list-header"
scope="col">Price ($)</th>
</tr>
</thead>
<tbody>
<tr class="list-row">
<td class="list-column-center">
JSF For Dummies</td>
<td class="list-column-right">
JSF</td>
<td class="list-column-center">
25.0</td>
</tr>
<tr class="list-row">
<td class="list-column-center">
Struts For Dummies</td>
<td class="list-column-right">
Struts</td>
<td class="list-column-center">
22.95</td>
</tr>
</tbody>
</table>
UISelectItems
selectItems
<h:selectOneMenu id="selectOneCar"
value="#{carBean.currentCar}">
<f:selectItems
value="#{carBean.carList}" />
</h:selectOneMenu>
<select id="jsftags:selectOneCar"
name="jsftags:selectCar" size="1">
<option value="accord">Honda Accord</option>
<option value="4runner">Toyota 4Runner</option>
<option value="nissan-z">Nissan Z350</option>
</select>
UISelectItem
selectItem
<h:outputText value="Select car color:" />
<h:selectOneMenu id="chooseCarColor"
value="apple">
<f:selectItem
itemValue="red" itemLabel="Red"/>
<f:selectItem
itemValue="blue" itemLabel="Blue"/>
<f:selectItem
itemValue="black" itemLabel="Black"/>
<f:selectItem
itemValue="green" itemLabel="Green"/>
<f:selectItem
itemValue="white" itemLabel="White"/>
</h:selectOneMenu>
Select car color:
<select id="jsftags:chooseCarColor"
name="jsftags:chooseCarColor" size="1">
<option value="red">Red</option>
<option value="blue">Blue</option>
<option value="black">Black</option>
<option value="green">Green</option>
<option value="white">White</option>
</select>


Napisz Artykuł

Listing

niema


Ten wpis posiada swój wątek na forum

Wszystkie pytania prosimy kierować właśnie tam ponieważ komentarze to miejsce na poprawki do kodu lub alternatywne rozwiązania i pytania nie będą publikowane

http://forum.funkcje.net/forum/viewtopic.php?f=2&t=4717

Dane do logowania na forum są takie same jak na funkcje.net



Dodano przez: divix
Ranga: Administrator serwisu Punktów: 37169
Komentarze użytkowników
    • Treść komentarza
      Kod do komentarza (opcjonalnie)
      PHP JavaScript MySQL Smarty SQL HTML CSS ActionScript
      Autor
      Token
      token

       

       








funkcje.net
Wszelkie prawa zastrzeżone©. | Funkcje.net 2008-17 v.1.5 | design: diviXdesign & rainbowcolors