---
schema_version: "1"
id: 4f8fc79fabb0c176bd4c68a46d50b349496a417d9555a955ff8ad50786d92eb5
title: Building a Table of Data in a Page
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/platform/salesforce-pages-developers-guide/guides/pages/quick-start/pages-quick-start-iteration-components.md
canonical_url: https://developer.salesforce.com/docs/platform/salesforce-pages-developers-guide/guide/pages-quick-start-iteration-components.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: 8cc903912dc7fbdc7dd6b6d2277fa11782475ad94cf285aa27464e4264e5ac50
products:
  - Visualforce Developer Guide
  - Platform Developer Content
---

# Building a Table of Data in a Page

Some Visualforce components, such as `<apex:pageBlockTable>` or `<apex:dataTable>`, allow you to display information from multiple records at a time by iterating over a collection of records. To illustrate this concept, the following page uses the `<apex:pageBlockTable>` component to list the contacts associated with an account that is currently in context:

<!-- otherprops: apex_page set_clipboard -->
```markup
<apex:page standardController="Account">
   <apex:pageBlock title="Hello {!$User.FirstName}!">
      You are viewing the {!account.name} account.
   </apex:pageBlock>
   <apex:pageBlock title="Contacts">
      <apex:pageBlockTable value="{!account.Contacts}" var="contact">
         <apex:column value="{!contact.Name}"/>
         <apex:column value="{!contact.MailingCity}"/>
         <apex:column value="{!contact.Phone}"/>
      </apex:pageBlockTable>
   </apex:pageBlock>
</apex:page>
```

**note:** Remember, for this page to display account data, the ID of a valid account record must be specified as a query parameter in the URL for the page. For example:

```nolang
https://MyDomain_login_URL/apex/myPage?id=001x000xxx3Jsxb
```

[Displaying Field Values with Visualforce](https://developer.salesforce.com/docs/platform/salesforce-pages-developers-guide/guide/pages-quick-start-display-field-values.md) has more information about retrieving the ID of a record.

![The apex:pageBlockTable component displayed in the Visualforce code window. The page view displays 3 contact columns.](https://developer.salesforce.com/media/salesforce-pages-developers-guide/pages_quick_start_page_data_table.png "The <apex:pageBlockTable> Component")

Like other iteration components, `<apex:pageBlockTable>` includes two required attributes, `value` and `var`:

-   `value` takes a list of sObject records or values of any other Apex type. In the example above, `{!account.Contacts}` retrieves the ID of the account that is currently in context and then traverses the relationship to retrieve the list of the associated contacts.
-   `var` specifies the name of the iteration variable. This variable is used within the body of the `<apex:pageBlockTable>` tag to access the fields on each contact. In this example, `value="{!contact.Name}"` is used on the `<apex:column>` tag to display the name of the contact.

The `<apex:pageBlockTable>` component takes one or more child `<apex:column>` components. The number of rows in the table is controlled by the number of records returned with the `value` attribute.

**note:** The `<apex:pageBlockTable>` component automatically takes on the styling of a standard Salesforce list. To display a list with your own styling, use `<apex:dataTable>` instead.

