Visualforce Apex:dataTable Tag

Apex:dataTable Tag

Apex:dataTable Tag :-In our previous Salesforce Tutorial we have clearly learned about <apex:column> tag. In this Salesforce training Tutorial we are going to learn about apex:datatable tag and how it works in visualforce page.

<Apex:datatable>:- apex:datatable tag is create data tables in visualforce pages. Each item in the data table is displayed in the form of rows and columns.

Ex:- <apex:datatable value=”{!leads}” var=”le” width=”75%”>

Different attributes supported by <apex:datatable> tag.

align	bgcolor	border	captioclass
columnClasses	columns	first	captionstyle
columnsWidth	dir	frame	cellpadding
Footerclass	id	lang	cellspacing
Headerclass	onclick	ondblclick	onkeydown
onkeypress	onkeyup	onmousedown	onmouseout
onmouseover	onmouseup	onmousemove	onRowClick
OnRowDblClick	onRowMousemove	onRowmouseOut	rendered
Onrowmousedown	onRowMouseOver	OnrowMouseUp	rowClasses
rows	rules	style	styleclass
title	var	width	value

Let us see how apex:datatable tag works.

Create new Visualforce page as shown below.

Click on create page apexdatatable link to create new visualforce page.

Now write visualforce page code as shown below.

Here we creating datatable for standard object leads. We are inserting all record set variables of leads in to leads data table. Name, phone number and company are the three columns in data table. “Width” is the attribute to adjust width of data table.

Output:- apex:datatable tag