Wikipédia

Szerkesztő:Zafir/JSF UI-könyvtára

< Szerkesztő:Zafir

A JavaServer Faces HTML Tag-jei egy JSF-be épített "tag" könyvtár elemei, amelyek azt írják le, hogy lehet HTML komponenseket JSF-el használni.

Használatához az alábbi URI attribútumot kell a forrásfájl tetejébe illeszteni: 

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

form tag szerkesztés

JSF: 

 <h:form id="jsftags">
  ...
 </h:form>

HTML: 

 <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>

commandButton tag szerkesztés

JSF: 

 <h:commandButton
   id="submit"
   value="#{msg.buttonHeader}"
   action="nextPage">
 </h:commandButton>

HTML: 

 <input
      id="_id0:submit"
      type="submit"
      name="_id0:submit"
      value="Next Step"/>

commandLink tag szerkesztés

JSF: 

  <h:commandLink id="link" action="goto">
   <h:outputText value="#{msg.linkName}"/>
 </h:commandLink>

HTML: 

  <a id="_id0:link" href="#" onclick=
 "document.forms['_id0']['_id0:link'].value=
   '_id0:link';
         document.forms['_id0'].submit();
        return false;">Next Page</a>

graphicImage tag szerkesztés

JSF: 

   <h:graphicImage id="image"
   alt="jsf-sun"
   url="/images/jsf-sun.gif">
 </h:graphicImage>

HTML: 

   <img id="jsftags:image"
 src="/jsf-example/images/jsf-sun.gif"
  alt="jsf-sun" />

inputText tag szerkesztés

JSF: 

    <h:inputText id="address"
  value="#{jsfexample.address}" />

HTML: 

    <input type="text" name="jsftags:_id1"
  value="123 JSF Ave" />

inputSecret tag szerkesztés

JSF: 

     <h:inputSecret redisplay="false"
  value="#{jsfexample.password}" />

HTML: 

     <input id="jsftags:password"
   type="password"
   name="jsftags:password"
   value="secret" />

inputHidden tag szerkesztés

JSF: 

      <h:inputHidden id="hidden"
   value="userPreference" />

HTML: 

      <input id="jsftags:hidden"
   type="hidden"
   name="jsftags:hidden"
   value="userPreference" />

inputTextArea tag szerkesztés

JSF: 

       <h:inputTextarea id="textArea"
   rows="4" cols="7"
   value="Text goes here.."/>

HTML: 

       <textarea id="jsftags:textArea"
   name="jsftags:textArea"
   cols="5" rows="3">
    Text goes here..
 </textarea>

outputText tag szerkesztés

JSF: 

        <h:outputText
 value="10032"/>

HMTL: 

        10032

outputLabel tag szerkesztés

JSF: 

         <h:outputLabel for="address">
  <h:outputText id="addressLabel"
    value="User Home Address"/>
 </h:outputLabel>

HTML: 

         <span id="jsftags:addressLabel">
  User Home Address</span>

outputLink tag szerkesztés

JSF: 

          <h:outputLink
 value="#{msg['jsfstudio.home.url']">
  <f:verbatim>JSF Studio</f:verbatim>
 </h:outputLink>

HTML: 

         <a href="http://www.jsf-studio.com">
 JSF Studio
</a>

outputFormat tag szerkesztés

JSF: 

          <h:outputFormat
 value="#{msg.jsfstudioThankYou}">
  <f:param value="Joe Blow"/>
  <f:param id="productName"
    value="#{msg['jsfstudio.label']}"/>
 </h:outputFormat>

HTML: 

          Thank you, Joe Blow, for trying Exadel JSF Studio!

message tag szerkesztés

JSF: 

           Enter address:
 <h:message style="color: red"
 for="useraddress" />
 <h:inputText id="useraddress"
 value="#{jsfexample.address}"
  required="true"/>
 <h:commandButton action="save" value="Save"/>

HTML: 

           Enter address:
 <sp an 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" />

selectBooleanCheckbox tag szerkesztés

JSF: 

            <h:selectBooleanCheckbox
 title="emailUpdates" value="#{jsfexample.wantsEmailUpdates}" >
 </h:selectBooleanCheckbox>
 <h:outputText value="Would you like email updates?"/>

HTML: 

            <input type="checkbox" name="jsftags:_id6" checked
    title="emailUpdates" />
 Would you like email updates?

selectManyMenu tag szerkesztés

JSF: 

             <h:selectManyMenu
 id="cars_selectManyMenu"
  value="#{carBean.car}">
   <f:selectItems
    value="#{carBean.carList}"/>
 </h:selectManyMenu>

HTML: 

             <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 tag szerkesztés

JSF: 

              <h:selectManyListbox
 id="cars_selectManyListbox"
  value="#{carBean.car}">
   <f:selectItems
    value="#{carBean.carList}"/>
 </h:selectManyListbox>

HTML: 

              <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>

selectOneRadio tag szerkesztés

JSF: 

               <h:selectOneRadio
 value="#{carBean.currentCar}">
  <f:selectItems
   value="#{carBean.carList}" />
 </h:selectOneRadio>

HTML: 

               <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 tag szerkesztés

JSF: 

                <h:selectOneMenu id="selectCar"
 value="#{carBean.currentCar}">
  <f:selectItems
   value="#{carBean.carList}" />
 </h:selectOneMenu>

HTML: 

                <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 tag szerkesztés

JSF: 

                 <h:selectOneListbox id="pickCar"
 value="#{carBean.currentCar}">
  <f:selectItems
   value="#{carBean.carList}" />
 </h:selectOneListbox>

HTML: 

                <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>

selectItems tag szerkesztés

JSF: 

                  <h:selectOneMenu id="selectOneCar"
 value="#{carBean.currentCar}">
  <f:selectItems
   value="#{carBean.carList}" />
 </h:selectOneMenu>

HTML: 

                 <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>

selectItem tag szerkesztés

JSF: 

                    <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>

HTML: 

                 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>

[[Kategória:JavaServer Faces]]

A lap eredeti címe: „https://hu.wikipedia.org/w/index.php?title=Szerkesztő:Zafir/JSF_UI-könyvtára&oldid=22784100”