Getting Started with SalesForce CRM

Customizing Salesforce Interface

Description:
BISP is committed to provide BEST learning material to the beginners and advance learners. In the same series, we have prepared a complete end-to end Hands-on Beginner’s G ide !or Sales"orce. The doc ment !oc ses on c stomi#ing Sales!orce inter!ace. $oin o r pro!essional training program and learn !rom e%perts.

History:
Version Description Change 0.1 Initial Draft 0.1 %e&ie'(1 Author Chandra Prakash har!a A!it har!a Publish Date 10th "an #01$ 10th "an #01$

www.bispsolutions.com

www.bisptrainigs.com

www.hyperionguru.com

Page 1

Contents Understand the VisualForce framework, including its Advantages.....................................................3 Understand the VisualForce framework :.......................................................................................3 What is VisualForce ?................................................................................................................. 3 Advantage of VisualForce :............................................................................................................ !"namic VisualForce #indings :.....................................................................................................$ Actions on a %age to a controller :..................................................................................................& Using 'tandard (ist )ontroller Actions :.....................................................................................& )reate custom controllers and standard controller e*tensions to incor%orate new data and actions into a %age......................................................................................................................................... + )ustom )ontrollers:....................................................................................................................... + What are )ustom )ontrollers and )ontroller ,*tensions?..........................................................+ -ow .o )reate /age #" Using )ustom )ontrollers :..................................................................0 -ow to #uilding a )ustom )ontroller :........................................................................................1 )ontroller 2ethods :................................................................................................................. 13 'tandard )ontrollers :.................................................................................................................. 13 Associating a 'tandard )ontroller with a VisualForce /age :...................................................13 Accessing !ata with a 'tandard )ontroller :.............................................................................13 'tandard )ontroller Actions :....................................................................................................13 ................................................................................................................................................. 11 Validation 4ules and 'tandard )ontrollers :.............................................................................11 Understand the securit" im%lications of using custom vs. standard controllers................................15 )ontroller )lass 'ecurit" :........................................................................................................ 15 6m%lement wi7ards using custom controllers to handle the state and o%erations.............................13 )reate custom com%onents that use custom controllers..................................................................11

www.bispsolutions.com

www.bisptrainigs.com

www.hyperionguru.com

Page 5

Understand the VisualForce framework, including its Advantages
Understand the VisualForce framework :
What is VisualForce
What is VisualForce VisualForce is a framework that allows develo%ers to 8uild so%histicated, custom user interfaces that can 8e hosted nativel" on the Force.com %latform. .he VisualForce framework includes a tag9 8ased marku% language, similar to -.2(.

What is a VisualForce !age !evelo%ers can use VisualForce to create a VisualForce %age definition. A %age definition consists of two %rimar" elements: • VisualForce marku% • A VisualForce controller Where Can VisualForce !ages "e Used 'imilar to s9controls, develo%ers can use VisualForce %ages to: : ;verride standard 8uttons, such as the <ew 8utton for accounts, or the 'ave 8utton for contacts : ;verride ta8 overview %ages, such as the Accounts ta8 home %age : !efine custom ta8s : ,m8ed com%onents in detail %age la"outs, similar to the wa" inline s9controls can 8e em8edded

www.bispsolutions.com

www.bisptrainigs.com

www.hyperionguru.com

Page 3

Advantage of VisualForce :
As a marku# language, VisualForce #rovides the following $enefits : User%friendl& develo#ment : !evelo%ers can edit their VisualForce marku% in the same window that dis%la"s the resulting %age. )onse=uentl", develo%ers can instantl" verif" the result of an edit >ust 8" saving their code. .he VisualForce editor %ane also include auto9com%letion and s"nta* highlighting. Integration with other We$%$ased user interface technologies : #ecause VisualForce marku% is ultimatel" rendered into -.2(, designers can use VisualForce tags alongside standard -.2(, ?ava'cri%t, Flash, or an" other code that can e*ecute within an -.2( %age on the %latform, including Force.com %latform merge fields and e*%ressions. 'odel%View%Controller ('VC) st&le develo#ment : VisualForce conforms to the 2odel9View9)ontroller @2V)A develo%ment %attern 8" %roviding a clear division 8etween the view of an a%%lication @the user interface, defined 8" VisualForce marku%A, and the controller and the controller that determines how the a%%lication works@the 8usiness logic, defined 8" a VisualForce controller written in A%e*A. Concise s&nta* : VisualForce %ages can im%lement the same functionalit" as s9controls 8ut with a%%ro*imatel" 13B fewer lines of code. +ata%driven defaults : VisualForce com%onents are rendered intelligentl" 8" the %latform. For e*am%le, rather than forcing %age designers to use different com%onent tags for different t"%es of edita8le fields @such as email addresses or calendar datesA, designer scan sim%l" use a generic Ca%e*:in%utFieldD tag for all fields. .he VisualForce renderer dis%la"s the a%%ro%riate edit interface for each field. ,osted #latform : VisualForce %ages are com%iled and rendered entirel" 8" the Force.com %latform. #ecause the" are so tightl" integrated, the" dis%la" the same %erformance as standard 'alesForce %ages, regardless of the amount of data 8eing dis%la"ed or edited. Automaticall& u#gradea$le : VisualForce %ages do not need to 8e rewritten when other %arts of the Force.com %latform are u%graded. #ecause the %ages are stored as metadata, the" are automaticall" u%graded with the rest of the s"stem.

www.bispsolutions.com

www.bisptrainigs.com

www.hyperionguru.com

Page

Use e*#ressions to $ind data and actions on a #age to a controller +&namic VisualForce "indings :
6n 'alesForce !"namic VisualForce 8indings are a wa" of writing generic VisualForce %ages that dis%la" information a8out records without necessaril" knowing which fields to show. 6n other words, fields on the %age are determined at run time, rather than com%ile time. .his allows a develo%er to design a single %age that renders differentl" for various audiences, 8ased on their %ermissions or %references. !"namic 8indings are useful for VisualForce %ages included in managed %ackages since the" allow for the %resentation of data s%ecific to each su8scri8er with ver" little coding. +&namic VisualForce $inding is su##orted for standard and custom o$-ects : '"nta* : referenceEe*%ressionF +&namic $indings can $e used an&where formula e*#ressions are valid : '"nta* : GHreferenceEe*%ressionFI ,nters !"namic VisualForce #inding. (etJs >ust =uickl" see what a regular VisualForce %age looks like. As an e*am%le 6 want to dis%la" the ,m%lo"ee first <ame, 2o8ile <um8er, /osition. .o do that, all "ou need to do is a ver" sim%le VisualForce %age like this :

www.bispsolutions.com

www.bisptrainigs.com

www.hyperionguru.com

Page $

Actions on a #age to a controller :
Using Standard .ist Controller Actions :
Action methods %erform logic or navigation when a %age event occurs, such as when a user clicks a 8utton, or hovers over an area of the %age. S&nta* /a#e*:command"utton0 /a#e*:command.ink0 /a#e*:action!oller0 /a#e*:actionSu##ort0 /a#e*:actionFunction0 /a#e*:#age0 +escri#tion creates a 8utton that calls an action creates a link that calls an action %eriodicall" calls an action makes an event @,*: KonclickK, KonmouseoverK, and so onA on another, named com%onent, call an action defines a new ?ava'cri%t function that calls an action calls an action when the %age is loaded

Action 'ethods : Action Save 1uicksave list

cancel
first

last ne*t #revious

+escri#tion 6nserts new records or u%dates e*isting records that have 8een changed. 6nserts new records or u%dates e*isting records that have 8een changed. 4eturns a /age4eference o8>ect of the standard list %age, 8ased on the most recentl" used list filter for that o8>ect when the filter6d is not s%ecified 8" the user. A8orts an edit o%eration. !is%la"s the first %age of records in the set. !is%la"s the last %age of records in the set. !is%la"s the ne*t %age of records in the set. !is%la"s the %revious %age of records in the set.

2ou can see $elow 3*am#le :

www.bispsolutions.com

www.bisptrainigs.com

www.hyperionguru.com

Page &

Create custom controllers and standard controller e*tensions to incor#orate new data and actions into a #age
Custom Controllers:
A custom controller is an A%e* class that im%lements all of the logic for a %age without leveraging a standard controller. 9 Lou want to leverage the 8uilt9in functionalit" of a standard controller 8ut override one or more actions, such as edit, view, save, or delete. 9 Lou want to add new actions. 9 Lou want to 8uild a VisualForce %age that res%ects user %ermissions. 'tandard controllers can %rovide all the functionalit" "ou need for a VisualForce %age 8ecause the" include the same logic that is used for a standard %age. For e*am%le, if "ou use the standard Accounts controller, clicking a Save 8utton in a VisualForce %age results in the same 8ehavior as clicking Save on a standard Account edit %age. -owever, if "ou want to override e*isting functionalit", customi7e the navigation through an a%%lication, use callouts or We8 services, or if "ou need finer control for how information is accessed for "our %age, "ou can write a custom controller or a controller e*tension using A%e*:

What are Custom Controllers and Controller 3*tensions

www.bispsolutions.com

www.bisptrainigs.com

www.hyperionguru.com

Page +

6n VisualForce custom control is an a%e* class that im%lement all of the logic for a %age without leaving a standard controller. )ustom control use in VisualForce %age run entirel" in s"stem mode the" does not enforce the %ermissions and field9level securit" of the current user.

,ow 4o Create !age "& Using Custom Controllers :
)lick on Setu# D develo# D !ages .hen )lick on <ew 8utton. ;4 !irectl" write in address 8ar after login 'alesForce site then add given address in url Ma%e*M<ew%age1 for e*am%le "ou see here htt%s:MMc.a%1.visual.force.comMa%e*M<ew%age1 5ote :% 1.2ake 'ure in User 'etting !evelo%ment 2ode is ena8le. 5. Lou can )ustom )ontrol "ou in 'tandard ;8>ect and )ustom o8>ect. 3*am#le 6:% 6n this e*am%le create ta8le with st"le sheet and how to call image 8" using custom o8>ect )ontroller. Ste# 6 :% )reate new %age Ma%e*M<ew%age1

www.bispsolutions.com

www.bisptrainigs.com

www.hyperionguru.com

Page 0

5ote :% #efore using this code Ca%e*:image valueNKGHO4esource.imagenameIKMD make sure add image file in 'tatic 4esources.

,ow to "uilding a Custom Controller :
From Setu# D +evelo# D A#e* Classes then click 5ew 8utton.

After create a%e* class then "ou can create VisualForce %age "ou can see 8elow. www.bispsolutions.com www.bisptrainigs.com www.hyperionguru.com Page 1

Controller 'ethods :
Action Control : /a#e*:command"utton0 creates a $utton that calls an action /a#e*:command.ink0 creates a link that calls an action /a#e*:action!oller0 #eriodicall& calls an action /a#e*:actionSu##ort0 makes an event (such as 7onclick8, 7onmouseover8, and so on) on another, named com#onent, call an action /a#e*:actionFunction0 defines a new 9avaScri#t function that calls an action /a#e*:#age0 calls an action when the #age is loaded

Standard Controllers :
6n 'alesforce.com VisualForce controller is a set of instructions that s%ecif" what ha%%ens when a user interacts with the com%onents s%ecified in associated VisualForce marku%, such as when a user clicks a 8utton or link. )ontrollers also %rovide access to the data that should 8e dis%la"ed in a %age, and can modif" com%onent 8ehavior.

Associating a Standard Controller with a VisualForce !age :
Use the standardController attri8ute on the <apex:page> </apex:page> tag and assign it the name of an" SalesForce o8>ect that can 8e =ueried using the Force.com API. S&nta* :
<apex:page standardController="Account"> </apex:page>

Accessing +ata with a Standard Controller :
,ver" standard controller includes a getter method that returns the record s%ecified 8" the id =uer" string %arameter in the %age U4(. 9 Lou can traverse u% to five levels of child9to9%arent relationshi%. 9 Lou can traverse one level of %arent9to9child relationshi%s.

Standard Controller Actions :
/a#e*:command"utton0 creates a $utton that calls an action www.bispsolutions.com www.bisptrainigs.com www.hyperionguru.com Page 13

/a#e*:command.ink0 creates a link that calls an action /a#e*:action!oller0 #eriodicall& calls an action /a#e*:actionSu##ort0 makes an event (such as 7onclick8, 7onmouseover8, and so on) on another, named com#onent, call an action /a#e*:actionFunction0 defines a new 9avaScri#t function that calls an action /a#e*:#age0 calls an action when the #age is loaded

Validation :ules and Standard Controllers :
6f a user enters data on a 'alesForce %age that uses a standard controller, and that data causes a validation rule error, the error can 8e dis%la"ed on the 'alesForce %age. 6f the validation rule error location is a field associated with an Ca%e*:in%utFieldD com%onent, the error dis%la"s there. 6f the validation rule error location is set to the to% of the %age, use the Ca%e*:%age2essagesD or Ca%e*:messagesD com%onent within the Ca%e*:%ageD to dis%la" the error. "ou can see 8elow

3*am#le : .he following %age allows "ou to u%date an account after will all fields then click on Save 8utton.

www.bispsolutions.com

www.bisptrainigs.com

www.hyperionguru.com

Page 11

Understand the securit& im#lications of using custom vs; standard controllers
Custom Control : 'tandard controllers can %rovide all the functionalit" "ou need for a VisualForce %age 8ecause the" include the same logic that is used for a standard %age. For e*am%le, if "ou use the standard Accounts controller, clicking a Save 8utton in a VisualForce %age results in the same 8ehavior as clicking Save on a standard Account edit %age. Standard Control : 6n 'alesforce.com VisualForce controller is a set of instructions that s%ecif" what ha%%ens when a user interacts with the com%onents s%ecified in associated VisualForce marku%, such as when a user clicks a 8utton or link. )ontrollers also %rovide access to the data that should 8e dis%la"ed in a %age, and can modif" com%onent 8ehavior. contain the same functionalit" and logic that are used for standard'alesforce %ages. )an 8e used with standard o8>ects and custom o8>ects.

Controller Class Securit& :
.o set A%e* class securit" from the class list %age: www.bispsolutions.com www.bisptrainigs.com www.hyperionguru.com Page 15

Setu# D +evelo# 0 A#e* Classes then "ou can see securit" link on given %age "ou can see 8elow.

'elect the %rofiles that "ou want to ena8le from the Availa8le /rofiles list and click Add, or select the %rofiles that "ou want to disa8le from the ,na8led /rofiles list and click :emove. .hen click Save; Lou can see 8elow.

Im#lement wizards using custom controllers to handle the state and o#erations
3*am#le : 6f "ou want to create a three9ste% o%%ortunit" wi7ard that allows users to create an o%%ortunit" at the same time as a related contact, account, and contact role:  .he first ste% ca%tures information related to the account and contact.  .he second ste% ca%tures information related to the o%%ortunit".  .he final ste% shows which records will 8e created and allows the user to save or cancel .

Solution : 1. <avigate to the U4( for the )reate VisualForce first %age: htt%s:MMChostD.salesforce.comMa%e*Mo%%t"'te%1 5. )lick )reate /age new;%%t"'te%1.

www.bispsolutions.com

www.bisptrainigs.com

www.hyperionguru.com

Page 13

3. 4e%eat the 'te% @'te% 1 or 'te% 5A and give VisualForce %age <ame o%%t"'te%5 and o%%t"'te%3. . )reate the new;%%ortunit")ontroller controller itJs create on A%e* class. "ou can see 8elow.

)reate A%e* class then "ou create new;%%t"'te%1, new;%%t"'te%5, and new;%%t"'te%3 Visual Force %age. Lou can see 8elow.

www.bispsolutions.com

www.bisptrainigs.com

www.hyperionguru.com

Page 1

/a#e*:#age controller<=new>##ortunit&Controller= ta$St&le<=>##ortunit&=0 /a#e*:section,eader title<=5ew Customer >##ortunit&= su$title<=Ste# 6 of ?=@0 /a#e*:form 0 /a#e*:#age"lock title<=Customer Information=0 /A%% 4his facet tag defines the =5e*t= $utton that a##ears in the footer of the #age"lock; It calls the ste#B() controller method, which returns a #age:eference to the ne*t ste# of the wizard; %%0 /a#e*:facet name<=footer=0 /a#e*:command"utton action<=CAste#BD= value<=5e*t= st&leClass<=$tn=@0 /@a#e*:facet0 /a#e*:#age"lockSection title<=Account Information=0 /A%% /a#e*:#anelErid0 tags organize data in the same wa& as a ta$le; It #laces all child elements in successive cells, in left%to%right, to#%to%$ottom order %%0 /A%% /a#e*:out#ut.a$el 0 and /a#e*:in#utField 0 tags can $e $ound together with the for and id attri$ute values, res#ectivel&; %%0 /a#e*:#anelErid columns<=B=0 /a#e*:out#ut.a$el value<=Account 5ame= for<=account5ame=@0 /a#e*:in#utField id<=account5ame= value<=CAaccount;nameD=@0 www.bispsolutions.com www.bisptrainigs.com www.hyperionguru.com Page 1$

/a#e*:out#ut.a$el value<=Account Site= for<=accountSite=@0 /a#e*:in#utField id<=accountSite= value<=CAaccount;siteD=@0 /@a#e*:#anelErid0 /@a#e*:#age"lockSection0 /a#e*:#age"lockSection title<=Contact Information=0 /a#e*:#anelErid columns<=B=0 /a#e*:out#ut.a$el value<=First 5ame= for<=contactFirst5ame=@0 /a#e*:in#utField id<=contactFirst5ame= value<=CAcontact;first5ameD=@0 /a#e*:out#ut.a$el value<=.ast 5ame= for<=contact.ast5ame=@0 /a#e*:in#utField id<=contact.ast5ame= value<=CAcontact;last5ameD=@0 /a#e*:out#ut.a$el value<=!hone= for<=contact!hone=@0 /a#e*:in#utField id<=contact!hone= value<=CAcontact;#honeD=@0 /@a#e*:#anelErid0 /@a#e*:#age"lockSection0 /@a#e*:#age"lock0 /@a#e*:form0 /@a#e*:#age0 )reate new;%%t"'te%1, then create new;%%t"'te%5 VisualForce %age.

/a#e*:#age controller<=new>##ortunit&Controller= ta$St&le<=>##ortunit&=0 /a#e*:section,eader title<=5ew Customer >##ortunit&= su$title<=Ste# B of ?=@0 /a#e*:form 0 /a#e*:#age"lock title<=>##ortunit& Information=0 www.bispsolutions.com www.bisptrainigs.com www.hyperionguru.com Page 1&

/a#e*:facet name<=footer=0 /a#e*:out#ut!anel 0 /a#e*:command"utton action<=CAste#6D= value<=!revious= st&leClass<=$tn=@0 /a#e*:command"utton action<=CAste#?D= value<=5e*t= st&leClass<=$tn=@0 /@a#e*:out#ut!anel0 /@a#e*:facet0 /a#e*:#age"lockSection title<=>##ortunit& Information=0 /a#e*:#anelErid columns<=B=0 /a#e*:out#ut.a$el value<=>##ortunit& 5ame= for<=o##ortunit&5ame=@0 /a#e*:in#utField id<=o##ortunit&5ame= value<=CAo##ortunit&;nameD=@0 /a#e*:out#ut.a$el value<=Amount= for<=o##ortunit&Amount=@0 /a#e*:in#utField id<=o##ortunit&Amount= value<=CAo##ortunit&;amountD=@0 /a#e*:out#ut.a$el value<=Close +ate= for<=o##ortunit&Close+ate=@0 /a#e*:in#utField id<=o##ortunit&Close+ate= value<=CAo##ortunit&;close+ateD=@0 /a#e*:out#ut.a$el value<=Stage= for<=o##ortunit&Stage5ame=@0 /a#e*:in#utField id<=o##ortunit&Stage5ame= value<=CAo##ortunit&;stage5ameD=@0 /a#e*:out#ut.a$el value<=:ole for Contact: CAcontact;first5ameD CAcontact;last5ameD= for<=contact:ole=@0 /a#e*:in#utField id<=contact:ole= value<=CArole;roleD=@0 /@a#e*:#anelErid0 /@a#e*:#age"lockSection0 /@a#e*:#age"lock0 /@a#e*:form0 /@a#e*:#age0 )reate new;%%t"'te%5, then create new;%%t"'te%3 VisualForce %age.

www.bispsolutions.com

www.bisptrainigs.com

www.hyperionguru.com

Page 1+

/a#e*:#age controller<=new>##ortunit&Controller= ta$St&le<=>##ortunit&=0 /a#e*:section,eader title<=5ew Customer >##ortunit&= su$title<=Ste# ? of ?=@0 /a#e*:form 0 /a#e*:#age"lock title<=Confirmation=0 /a#e*:facet name<=footer=0 /a#e*:out#ut!anel 0 /a#e*:command"utton action<=CAste#BD= value<=!revious= st&leClass<=$tn=@0 /a#e*:command"utton action<=CAsaveD= value<=Save= st&leClass<=$tn=@0 /@a#e*:out#ut!anel0 /@a#e*:facet0 /a#e*:#age"lockSection title<=Account Information=0 /a#e*:#anelErid columns<=B=0 /a#e*:out#ut4e*t value<=Account 5ame=@0 /a#e*:out#ut4e*t value<=CAaccount;nameD=@0 /a#e*:out#ut4e*t value<=Account Site=@0 /a#e*:out#ut4e*t value<=CAaccount;siteD=@0 /@a#e*:#anelErid0 /@a#e*:#age"lockSection0 /a#e*:#age"lockSection title<=Contact Information=0 /a#e*:#anelErid columns<=B=0 /a#e*:out#ut4e*t value<=First 5ame=@0 /a#e*:out#ut4e*t value<=CAcontact;first5ameD=@0 /a#e*:out#ut4e*t value<=.ast 5ame=@0 /a#e*:out#ut4e*t value<=CAcontact;last5ameD=@0 /a#e*:out#ut4e*t value<=!hone=@0 www.bispsolutions.com www.bisptrainigs.com www.hyperionguru.com Page 10

/a#e*:out#ut4e*t value<=CAcontact;#honeD=@0 /a#e*:out#ut4e*t value<=:ole=@0 /a#e*:out#ut4e*t value<=CArole;roleD=@0 /@a#e*:#anelErid0 /@a#e*:#age"lockSection0 /a#e*:#age"lockSection title<=>##ortunit& Information=0 /a#e*:#anelErid columns<=B=0 /a#e*:out#ut4e*t value<=>##ortunit& 5ame=@0 /a#e*:out#ut4e*t value<=CAo##ortunit&;nameD=@0 /a#e*:out#ut4e*t value<=Amount=@0 /a#e*:out#ut4e*t value<=CAo##ortunit&;amountD=@0 /a#e*:out#ut4e*t value<=Close +ate=@0 /a#e*:out#ut4e*t value<=CAo##ortunit&;close+ateD=@0 /@a#e*:#anelErid0 /@a#e*:#age"lockSection0 /@a#e*:#age"lock0 /@a#e*:form0 /@a#e*:#age0

Create custom com#onents that use custom controllers
6n 'alesForce "ou can 8uild "our own custom com%onents to augment this li8rar". Accessing Custom Com#onent Attri$utes in a Controller : Ste# 6: Create A#e* class :

Ste# B : )reate )om%onent, how to create )om%onent in 'alesForce.com. Setu# D +evelo# D Com#onents, .hen click 5ew 8utton.

www.bispsolutions.com

www.bisptrainigs.com

www.hyperionguru.com

Page 11

Ste# ? : )reate VisualForce %age.

www.bispsolutions.com

www.bisptrainigs.com

www.hyperionguru.com

Page 53

www.bispsolutions.com

www.bisptrainigs.com

www.hyperionguru.com

Page 51