Custom Component Attributes

Share on facebook
Share on twitter
Share on linkedin
The Apex component allows us to use custom components with attributes that can be passed to a Visualforce page by using tag.

Introduction

The Apex component allows us to use custom components with attributes that can be passed to a Visualforce page by using <apex:component> tag. The attribute names can be used as a reference in VF pages, and the type attribute can be of list, primitives, sObjects, maps, and custom Apex classes. The following examples show how the custom component attributes are used with different types.

The example below shows how a list is passed to the custom component:

Listview – apex class

public class Listview{

public List<account> acclist{get;set;}

public List<contact> conlist{get;set;}

public void accview() {

acclist=[select name from account];

}

public void conview() {

conlist=[select name from contact];

}

}

listpage – VF page

<apex:page controller="Listview">

<apex:form >

<apex:pageBlock title="listview">

<apex:commandButton action="{!accview}" value="Account"/>

<c:componentlist accname="{!acclist}"></c:componentlist>

<apex:commandButton action="{!conview}" value="cont"/>

<c:componentlist conname="{!conlist}"></c:componentlist>

</apex:pageBlock>

</apex:form>

</apex:page>

componentlist – VF component

<apex:component >

<apex:attribute name="accname" type="account[]" description="display account view"/>

<apex:attribute name="conname" type="contact[]" description="display contact view"/>

<apex:pageBlock>

<apex:pageBlockTable value="{!accname}" var="ac">

<apex:column value="{!ac.name}"/>

</apex:pageBlockTable>

<apex:pageBlockTable value="{!conname}" var="co">

<apex:column value="{!co.name}"/>

</apex:pageBlockTable>

</apex:pageBlock>

</apex:component>

The following example shows how maps are passed to the custom component:

Mappage – VF Page

<apex:page controller="mapcontroller">

<apex:form >

<apex:pageBlock >

<c:componentmap contmap="{!conmap}"/>

</apex:pageBlock>

</apex:form>

</apex:page>

componentmap – VF component

<apex:component >

<apex:attribute name="contmap" description="componentmap" type="map"/> 

<apex:repeat value="{!contmap}" var="cmap"> 

<apex:outputText value="{!contmap[cmap]}" /><br/>

</apex:repeat>

</apex:component>

mapcontroller – Apex class

public class mapcontroller {

public Map<String,String> conmap{get;set;}

public mapcontroller(){

conmap=new Map<String,String>();

for(contact con:[select id,name from contact]){

conmap.put(con.name,con.name);

}

}

}

The next example shows how an Apex class is passed to the custom component:

Classpage – VF Page

<apex:page controller="compclasscontrol">

<apex:form >

<apex:pageBlock >

<c:componentclass clasexample="{!cc}"/>

</apex:pageBlock>

</apex:form>

</apex:page>



compclasscontrol – Apex class

public class compclasscontrol {

public componclass cc{get;set;}

public compclasscontrol(){

cc=new componclass();

}

}

componentclass – VF component

<apex:component >

<apex:attribute name="clasexample" description="classexample" type="componclass"/>

<apex:pageBlock>

<apex:pageBlockTable value="{!clasexample.leadlist}" var="var" >

<apex:column value="{!var.name}"/>

</apex:pageBlockTable>

</apex:pageBlock>

</apex:component>

componclass – Apex class

public class componclass{

public list<lead> leadlist{get;set;}

public componclass(){

leadlist=new list<lead>();

leadlist=[select Name from lead];

}

}

Default custom component attributes

Two attributes are always generated for custom components. These attributes don’t need to be included in the component definition:

Id: An identifier that allows the custom component to be referenced by other components in the page.

Rendered: A Boolean value that specifies whether the custom component is rendered on the page. If not specified, this value defaults to true.

Reference Link:

Apex Custom Component Attributes

About MST

At MST Solutions our cornerstone is to adapt, engage and create solutions which guarantee the success of our clients. The talent of our team and experiences in varied business verticals gives us an advantage over other competitors.

Recent Articles

Mobile Responsive Testing

Mobile Responsive Testing is simply a Testing Process performed to make sure that your website or an app is working appropriately on all types of devices.
Whether it an app or website, they need to ensure that they are accessible from any device, anytime, anywhere.

Read Article »

Work with us.

Our people aren’t just employees, they are key to the success of our business. We recognize the strengths of each individual and allow them time and resources to further develop those skills, crafting a culture of leaders who are passionate about where they are going within our organization.