Showing posts with label JSF Facelet Tag Reference. Show all posts
Showing posts with label JSF Facelet Tag Reference. Show all posts

Facelet repeat Tag

This tag is used to iterate over the list of items. The name of list of items is specified by the EL expression in the value attribute of this tag. This tag contains two attributes "value" "name". The literal name specified in the name attribute is used to iterate over the items. In this example, we have used a bean named "TableBean" and info name is given to be used further. For ex., info.id, info.name used in value attribute of inputText JSF tag where id and name are attributes specified in bean. so here all id and names will be displayed.

Code Description :

repeat.xhtml :



xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html">

RoseIndia Facelet Tags Tutorial


Welcome to the Facelet world..........
















  • repeattemplate.xhtml :



    xmlns:ui="http://java.sun.com/jsf/facelets">

    facelet example





    TableBean.java :(Java Bean used for collection of items)

    package roseindia;

    public class TableBean {

    private perInfo[] perInfoAll = new perInfo[]{
    new perInfo(101, "CHANDAN", "9891444444", "aaa", 11111),
    new perInfo(102, "RAVI", "9911666666", "bbb" ,22222),
    new perInfo(103, "JOHN", "9313888888", "ccc", 33333),
    new perInfo(104, "ANDREW", "9911222222", "ddd" , 44444),
    new perInfo(105, "SYMONDS", "9313999999", "eee", 55555)
    };

    public perInfo[] getperInfoAll() {
    return perInfoAll;
    }

    public class perInfo {
    int id;
    String name;
    String phone;
    String city;
    int pin;

    public perInfo(int id, String name, String phone, String city, int pin) {
    this.id = id;
    this.name = name;
    this.phone = phone;
    this.city = city;
    this.pin= pin;
    }
    public int getid() {
    return id;
    }
    public String getname() {
    return name;
    }
    public String getphone() {
    return phone;
    }
    public String getcity() {
    return city;
    }
    public int getpin() {
    return pin;
    }
    }
    }

    Rendered Output :

    Html Source Code :





    RoseIndia Facelet Tags Tutorial


    Welcome to the Facelet world..........



    TR/xhtml1/DTD/xhtml1-transitional.dtd" >



    facelet example



    This is the list of ID and Names.

























  • This tag contains two attributes :

    value : This attribute specifies the list of items whose items are to be iterated. This is the EL expression.
    var : This attribute is used to give a name using that the iteration is done.

    read more “Facelet repeat Tag”

    Facelet remove Tag

    This tag is used to remove content within this tag from a facelet at compile time. This tag don't have any attribute. This tag can be used with jsfc attribute which shows that the particular tag will be removed. In this example, the line "This line will be removed" will be removed from facelet at the time of compilation and so will not be displayed. In this example, the line where jsfc attribute is used and set to the ui:remove is not considered for compilation so input text box for this line of code will not be displayed.

    Code Description :



    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html">

    RoseIndia Facelet Tags Tutorial


    Welcome to the Facelet world..........








    jsfc="ui:remove" value="IT" />
    This line will be removed



    This is the content below decorate tag.



    Rendered Output :

    Html Source Code :





    RoseIndia Facelet Tags Tutorial


    Welcome to the Facelet world..........






    facelet example



    This is the text to be displayed.

    name="_id7" value="This i/p box is rendered" />



    This is the content below decorate tag.



    This tag has no attribute.

    read more “Facelet remove Tag”

    Facelet param Tag

    This tag is used to pass objects as variables between facelets. This tag has two required attributes name and value. name attribute is the name of the variable and the value attribute is to set the value of this variable. You can use this tag where a define tag is used within composition or decorate tag. We can also use this tag within include tag. In this example, we have taken two variables user and pwd within include tag in debug.xhtml and values are set through bean's properties userid and password. These variable are passed to the "includeparampage.xhtml" where we can use these variables in this line of code "Your #{user} and #{pwd} will not be disclosed".

    Code Description :

    debug.xhtml :



    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html">

    Content above composition tag will not be rendered.


    RoseIndia Facelet Tags Tutorial


    Welcome to the Facelet world..........



    Enter UserID :





    Enter Password :









    includeparampage.xhtml">





    Content below composition tag will not be rendered.

    debugtemplate.xhtml :



    xmlns:ui="http://java.sun.com/jsf/facelets">

    facelet example









    includeparampage.xhtml :


    xmlns:ui="http://java.sun.com/jsf/facelets">




    Your #{user} and #{pwd} will not be disclosed.




    Rendered Output :

    Html Source Code :





    facelet example



    RoseIndia Facelet Tags Tutorial


    Welcome to the Facelet world..........


    Enter UserID :



    Enter Password :
    name="is" value="" />





    Your ID and Password will not be disclosed.



    This tag contains two attributes :

    name : This is required attribute and is used to specify the name of the variable to be passed to other facelet.
    value :
    This is required attribute to set the value of the variable specified by the name attribute.

    read more “Facelet param Tag”

    Facelet insert Tag

    This tag is used to replace the content defined in another facelet to the template. This tag takes one attribute that is not a required attribute and is used in conjunction with define tag. If you set this attribute same as defined in define tag then that content within define tag will be included. If it doesn't match then the content specified within opening and closing tag of this insert tag will be displayed. For example, in the code below in "insert.xhtml" there is not any define tag whose name attribute value is "face5" and this value is used in the second file "inserttemplate.xhtml". So the content ("This is the default text rendered") specified within opening and closing tag of insert tag is displayed. While there is one insert tag whose value of name attribute ("face1") matches with that of define tag, so the content "RoseIndia Facelet Tags Tutorial" and "Welcome to the Facelet world.........." will be replaced to the insert tag.

    insert.xhtml :



    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html">

    Content above composition tag will not be rendered.


    RoseIndia Facelet Tags Tutorial


    Welcome to the Facelet world..........



    Enter UserID :





    Enter Password :









    Content below composition tag will not be rendered.

    inserttemplate.xhtml :



    xmlns:ui="http://java.sun.com/jsf/facelets">

    facelet example







    face5">

    This is the default text rendered



    Rendered Output :

    Html Source Code :





    facelet example



    RoseIndia Facelet Tags Tutorial


    Welcome to the Facelet world..........


    Enter UserID :



    Enter Password :
    value="" />



    This is the default text rendered



    This tag contains only one attribute :

    name : This attribute is used to give the name of the content to be included in template. This value of name attribute must be same as name attribute in define tag. If name value specified here doesn't match with any name attribute specified in define tag then the content specified within opening and closing tag of this insert tag will be displayed. This has been explained in the above example.

    read more “ ”

    Facelet include Tag

    This tag is used to include the content of a page. This page name is specified by src attribute of include tag. The page that has been included should use composition tag or component tag. It may contain xhtml or xml to be included. In the program below, we have used include tag and src attribute is set to "includepage.xhtml". So the content of this page will be included in the "include.xhtml" page and rendered in "includetemplate.xhtml" because insert tag with name attribute set to face5 is used in "includetemplate.xhtml".

    include.xhtml:



    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html">

    Content above composition tag will not be rendered.


    RoseIndia Facelet Tags Tutorial


    Welcome to the Facelet world..........



    Enter UserID :





    Enter Password :












    Content below composition tag will not be rendered.

    includetemplate.xhtml :



    xmlns:ui="http://java.sun.com/jsf/facelets">

    facelet example







    face5">

    includepage.xhtml : The content in this page that will be included in the "includetemplate.xhtml"


    xmlns:ui="http://java.sun.com/jsf/facelets">




    This is the content of "includepage.xhtml"


    Rendered Output :

    Html Source Code :





    facelet example



    RoseIndia Facelet Tags Tutorial


    Welcome to the Facelet world..........


    Enter UserID :



    Enter Password :
    name="is" value="" />





    This is the content of "includepage.xhtml"

    This tag contains only one attribute :

    src : This is the required attribute that can be a litral or EL expression. This value must specify a facelet whose content will be included in your template document.

    read more “Facelet include Tag”

    Facelet fragment Tag

    This tag is used to insert the new UIcomponent to the component tree and the content outside of the tag is included to the tree. So this tag is same with component tag as decorate tag is with composition tag i.e. as decorate tag behaves same as composition tag except including content outside the tag, in the same way fragment tag behaves same as component tag except including content outside the tag. In this example, the content within fragment tag in included in component tree and the code above fragment tag is also rendered. So "Content above fragment tag will be rendered." and "Content below fragment tag will be rendered." is rendered.

    Code Description :



    xmlns:ui="http://java.sun.com/jsf/facelets">

    facelet example


    Content above fragment tag will be rendered.



    This is the content to be included in the page.



    Content below fragment tag will be rendered.



    Rendered Output :

    Html Source Code :





    facelet example


    Content above fragment tag will be rendered.


    This is the content to be included in the page.


    Content below fragment tag will be rendered.



    This tag contains two attributes :

    id : This attribute assigns unique identity to the component. Its not a required attribute. So if you don't give id then facelet provides it automacally.
    binding :
    This attribute is used to bind the component to the backing bean property.

    read more “Facelet fragment Tag”

    Facelet define Tag

    This tag is used to define the name of the content. This named content can be included within a template. This tag is used within those tags that allows templating like composition and decorate tags. This tag takes one attribute named "name" that is required to be included when using this define tag. This name attribute is required to be same as name attribute of insert tag in the target template to include the content specified in define tag with the same name. For example, In the first define tag name attribute is set to "face1". Now look at the code below in "definetemplate.xhtml" where we have used insert tag with name attribute. This name attribute is given value "face1". So the content within define tag, whose name attribute value matches with the name attribute of the insert tag i.e."face1", will be included in the "definetemplate.xhtml".

    Code Description :

    define.xhtml :



    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html">

    Content above composition tag will not be rendered.


    RoseIndia Facelet Tags Tutorial


    Welcome to the Facelet world..........



    Enter UserID :





    Enter Password :









    Content below composition tag will not be rendered.

    definetemplate.xhtml :



    xmlns:ui="http://java.sun.com/jsf/facelets">

    facelet example








    Rendered Output :

    Html Source Code :





    facelet example



    RoseIndia Facelet Tags Tutorial


    Welcome to the Facelet world..........


    Enter UserID :



    Enter Password :






    This tag contains only one attribute :

    name : This attribute is used to give the name of the content specified in the define tag. This value of name attribute must be same as name attribute in insert tag if its content is to be included in the template.

    read more “Facelet define Tag”

    Facelet decorate Tag

    This tag is like composition tag. Difference between those is that the content outside of the decorate tag is rendered while it is reverse for composition tag i.e. it is not rendered when we use composition tag. This tag is useful when we want content with some decoration text in the document.

    decorate.xhtml:



    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html">

    RoseIndia Facelet Tags Tutorial


    Welcome to the Facelet world..........













    First Name Last Name
    Rose India
    Mr. Deepak Kumar





    This is the content below decorate tag.



    decoratetemplate.xhtml :



    xmlns:ui="http://java.sun.com/jsf/facelets">

    facelet example





    Rendered Output :

    Html Source Code :





    RoseIndia Facelet Tags Tutorial


    Welcome to the Facelet world..........






    facelet example











    First Name Last Name
    Rose India
    Mr. Deepak Kumar




    This is the content below decorate tag.



    This tag contains one attribute :

    template : This is used to specify the name of the template where the content of decorate tag will be used .

    read more “Facelet decorate Tag”

    Facelet debug Tag

    This tag is useful in displaying the component tree and scoped variables. This information will be displayed in a popup window of browser when we press Ctrl+Shift+(a key). This key will be specified in hotkey attribute. For example, in the code below in "debugtemplate.xhtml", this has been specified "p". So when page comes to the user then if Ctrl+Shift+p is pressed, debug window is open which displays the component tree and scoped variables.


    debug.xhtml :



    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html">

    Content above composition tag will not be rendered.


    RoseIndia Facelet Tags Tutorial


    Welcome to the Facelet world..........



    Enter UserID :





    Enter Password :









    Content below composition tag will not be rendered.

    debugtemplate.xhtml :



    xmlns:ui="http://java.sun.com/jsf/facelets">

    facelet example









    Rendered Output : This is the page that is displayed to the user first. Now if we press Ctrl+Shift+p then debug window is opened that is shown in the second figure below :

    debug window :

    Html Source Code :





    facelet example



    RoseIndia Facelet Tags Tutorial


    Welcome to the Facelet world..........


    Enter UserID :



    Enter Password :
    name="is" value="" />





    This tag contains only one attribute :

    hotkey : This attribute is used to specify the key which is to be pressed with Ctrl+Shift to open a debug window. Its default value is "d". It doesn't take EL expression.

    read more “Facelet debug Tag”

    Facelet composition Tag

    This is a templating tag and is used for the wrapping the content that can be included in any other facelet. This tag provides some useful features. Any content outside of this tag is left to be rendered. You can include normal html content in your page but Facelet will render only content that is within this tag i.e. composition tag. This tag takes one attribute named "template". This attribute is set to the path of the template where the content of this tag will be included.

    Code Description :

    composition.xhtml :
    In the code below we have taken template attribute which indicates the template to which the content inside this composition tag will be rendered. Here we have written some content outside of the composition tag, that content will not be rendered. In the comptemplate.xhtml we have used insert tag to include the content inside the composition tag to the comptemplate.xhtml page.



    xmlns:ui="http://java.sun.com/jsf/facelets">

    Content above composition tag will not be rendered.
    <ui:composition template="/pages/composition/comptemplate.xhtml">

    This is the content to be included in the comptemplate.xhtml page.



    Content below composition tag will not be rendered.

    comptemplate.xhtml :



    xmlns:ui="http://java.sun.com/jsf/facelets">

    facelet example





    Rendered Output :

    Html Source Code :




    facelet example



    This is the content to be included in the comptemplate.xhtml page.



    This tag contains only one attribute :

    template : This attribute is set to the template where the content inside this tag will be included.

    read more “Facelet composition Tag”

    Facelet component Tag

    This tag is used to add a new component into the JSF component tree as children of UI component instance. This tag shows its behavior like composition tag. The difference is that the component tag inserts a new UIcomponent instance in the component tree and this instance is the root of all its child components or fragments. The content outside of the tag is ignored as it happens with composition tag.

    Code Description :

    comptemplate.xhtml :


    xmlns:ui="http://java.sun.com/jsf/facelets">

    facelet example


    Content above component tag will not be rendered.

    This is the content to be included in the page.



    Content below component tag will not be rendered.

    Rendered Output :

    Html Source Code :

    This is the content to be included in the page.

    This tag contains two attributes :

    id : This attribute assigns unique identity to the component. Its not a required attribute. So if you don't give id then facelet provides it automatically.
    binding :
    This attribute is used to bind the component to the backing bean property.

    read more “Facelet component Tag”