Tomahawk dataList tag

This tag is like dataTable tag but the difference between the two is that it does not render a table. In this tag the data rows are controlled and rendered by the use of "layout" attribute. It supports three layouts "simple", "unorderedList", "orderedList

Tomahawk dataList tag

This tag is like dataTable tag but the difference between the two is that it does not render a table. In this tag the data rows are controlled and rendered by the use of "layout" attribute. It supports three layouts "simple", "unorderedList", "orderedList". The default value is simple. When "simple" is used the items are rendered normally, when "unorderedList" is used the list is rendered as an HTML unordered list and in the case of "orderedList", the list is rendered as an HTML ordered list.

Code Description :

<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://myfaces.apache.org/tomahawk"
  prefix="t"%>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; 
               charset=iso-8859-1">
<title>t:dataList example</title>
<style type="text/css">
<!--
.dataListStyle {
	color: green;
    background-color: #D0E6E0;
    padding: 3;
}
-->
</style>
</head>
<body >
<f:view>
  <h:form id="form1" >
    <t:dataList id="dt1" value="#{TableBean.perInfoAll}" 
      var="item" layout="orderedList" first="0" 
      rows="4" dir="LTR" 
      itemStyleClass="dataListStyle">
    <t:outputText value="#{item.firstname}"></t:outputText>
    <f:verbatim>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</f:verbatim>
    <t:outputText value="#{item.lastname}"></t:outputText>
    <f:verbatim>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</f:verbatim>
    <t:outputText value="#{item.phone}"></t:outputText>
    </t:dataList>
</h:form>
</f:view>
</body>
</html>

TableBean.java :


package net.roseindia.web.ui;

public class TableBean {



private perInfo[] perInfoAll = new perInfo[]{

new perInfo(101, "SUSHIL","KUMAR", "9891444444",

		   "Delhi", 111111),

new perInfo(102, "CHANDAN","KUMAR", "9911666666",

   "Bombay" ,222222),

new perInfo(103, "RAVI","KANT", "9313888888", 

   "New York", 333333),

new perInfo(104, "ANDY","ROBERTSON", "9911222222",

    "Florida" , 444444),

new perInfo(105, "SHAUN","MARTIN", "9313999999", 

  "Los Angeles", 555555),

};



public perInfo[] getperInfoAll() {

return perInfoAll;

}



public class perInfo {

int id;

String firstname;

String lastname;

String phone;

String city;

int pin;



public perInfo(int id, String firstname,

		String lastname,String phone, String city,

   int pin) {

this.id = id;

this.firstname = firstname;

this.lastname = lastname;

this.phone = phone;

this.city = city;

this.pin= pin;

}



public int getid() {

return id;

}



public String getfirstname() {

return firstname;

}



public String getlastname() {

return lastname;

}



public String getphone() {

return phone;

}



public String getcity() {

return city;

}



public int getpin() {

return pin;

}



}



}

Rendered Output :

Html Source Code :

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; 
	charset=iso-8859-1">
<title>t:dataList example</title>
<style type="text/css">
<!--
.dataListStyle {
	color: green;
    background-color: #D0E6E0;
    padding: 3;
}
-->
</style>
</head>
<body >
<form id="form1" name="form1" method="post" 
		action="/tomahawk_tags/pages/dataList.jsf" 
		enctype="application/x-www-form-urlencoded">
<ol id="form1:dt1" dir="LTR">
<li class="dataListStyle">SUSHIL&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			  KUMAR&nbsp;&nbsp;&nbsp;
                          &nbsp;&nbsp;9891444444</li>
<li class="dataListStyle">CHANDAN&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			  KUMAR&nbsp;&nbsp;&nbsp;
                          &nbsp;&nbsp;9911666666</li>
<li class="dataListStyle">RAVI&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			  KANT&nbsp;&nbsp;&nbsp;
                          &nbsp;&nbsp;9313888888</li>
<li class="dataListStyle">ANDY&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			  ROBERTSON&nbsp;&nbsp;
                          &nbsp;&nbsp;&nbsp;9911222222</li>
</ol>
<input type="hidden" name="form1_SUBMIT" value="1" />
<input type="hidden" name="javax.faces.ViewState" 
id="javax.faces.ViewState" value="rO0ABXVyABNbTGphdmEubGFu
Zy5PYmplY3Q7kM5YnxBzKWwCAAB4cAAAAANzcgBHb3JnLmFwYWNoZS5teW
ZhY2VzLmFwcGxpY2F0aW9uLlRyZWVTdHJ1Y3R1cmVNYW5hZ2VyJFRyZWVT
dHJ1Y3RDb21wb25lbnRGWRfYnEr2zwIABFsACV9jaGlsZHJlbnQASltMb3
JnL2FwYWNoZS9teWZhY2VzL2FwcGxpY2F0aW9uL1RyZWVTdHJ1Y3R1cmVN
YW5hZ2VyJFRyZWVTdHJ1Y3RDb21wb25lbnQ7TAAPX2NvbXBvbmVudENsYX
NzdAASTGphdmEvbGFuZy9TdHJpbmc7TAAMX2NvbXBvbmVudElkcQB+AARb
AAdfZmFjZXRzdAATW0xqYXZhL2xhbmcvT2JqZWN0O3hwdXIASltMb3JnLm
FwYWNoZS5teWZhY2VzLmFwcGxpY2F0aW9uLlRyZWVTdHJ1Y3R1cmVNYW5h
Z2VyJFRyZWVTdHJ1Y3RDb21wb25lbnQ7uqwnyBGFkKoCAAB4cAAAAAFzcQ
B+AAJ1cQB+AAcAAAABc3
.............
............." /></form>
<!-- MYFACES JAVASCRIPT -->
</body>
</html>

This tag contains attributes given below :

id : This is the value which is used to uniquely identify the component within the closest container like form or subview. The main thing to remember is that its value must be a static value.
binding : This attribute is used to specify the property of the backing bean with which this component instance is to be bound.
rendered : Its default value is true. If this attribute is set to true then this component is presented in the page to the user. If false, then this component is not rendered.
value : It represents the value of the component. It represents the value over which iteration is to be done. It may be an array or any iterator object .
dir : It is used to set the direction of the text to be displayed. It can take two values LTR(left to right) and RTL (right to left).
lang : It is used to set the base language of the component when displayed.
style : It is used to set the CSS style definition for the component.
title : It is the standard html attribute. It is used to set the tooltip text for this component.
styleClass : It is used to set the CSS class for the component. It is same as html class attribute.
onclick : Script to be invoked when the element is clicked.
ondblclick : It is used for Java Script code to be invoked when the element is double-clicked.
onmousedown : It is used for Java Script code to be invoked when the pointing device is pressed over this element.
onmouseup : It is used for Java Script code to be invoked when the pointing device is released over this element.
onmouseover : It is used for Java Script code to be invoked when the pointing device is moved into this element.
onmousemove : It is used for Java Script code to be invoked when the pointing device is moved while it is in this element.
onmouseout : It is used for Java Script code to be invoked when the pointing device is moved out of this element.
onkeypress : It is used for Java Script code to be invoked when a key is pressed over this element.
onkeydown : It is used for Java Script code to be invoked when a key is pressed down over this element.
onkeyup : It is used for Java Script code to be invoked when a key is released over this element.
forceId : This is a boolean attribute with default value false. If this attribute is set to true, the tag is forced to render the id for the component exactly as mentioned in the id attribute of the tag. The benefit of this attribute is that we can reference component by id in the javascript. If we don't use this attribute with the true value then the id for the component is presented in different format.
forceIdIndex : This is a boolean attribute with default value true. If this value is true then the the component displays the index number in its id value if the component is in a list. If this attribute is set to false then this component will not append index number as suffix . If forcrId is set to false then its value is ignored.
var :This is the name of the variable created by the data table that represents the current item in the value. This attribute helps exposing the data in the rows of the table.
rows : This attribute specifies the number of rows to display. This displaying will be started from the index specified in the "first" attribute. If we set this attribute to zero then all rows will be displayed.
first : This is used to specify the row number of the first row from which displaying is to be started onwards. Suppose, this property is set to 3,displaying will be started from the third row of the underlying data.
enabledOnUserRole : If the current user has one of the roles listed in the enabledOnUserRole attribute then enabling or disabling of the component is decided on the base of "disabled" attribute. If disabled attribute is set to true then component is disabled otherwise enabled. If the user is not in the above list then the component is rendered disabled.
visibleOnUserRole : If the current user has one of the roles listed in the visibleOnUserRole attribute then processing of the component is decided on the base of "rendered" attribute. If the rendered attribute is set to true then component is not rendered otherwise displayed on the page. On the other hand if the current user is not in the above list then the component is not processed.
layout : This attribute can take three values "simple", "unorderedList", "orderedList" for layout of the component. The default value is simple. When "simple" is used the items are rendered normally, when "unorderedList" is used the list is rendered as an HTML unordered list and in the case of "orderedList", the list is rendered as an HTML ordered list.
rowIndexVar : This attribute specifies a request attribute name for the variable storing the row index value.
rowCountVar : This attribute specifies a request attribute name for the variable storing the row count value.
itemStyleClass : This attribute is used to set the CSS class to be applied to individual items in the list

Ads