Important VisualForce Tags

I am hereby sharing some very important VisualForce Tags that are required for creating VisualForce pages :


  1. <apex:page> </apex:page> : Created parent layout (Page Layout)
  2. <apex:pageBlock></apex:pageBlock> : Create inner layout, a type of div with header and can add text below that.
  3. <apex:dataTable> </apex:dataTable> : Grid Table to show contents in row column basis
  4. <apex:enhancedList> </apex:enhancedList> : New and enhanced form of Grid Table Layout with Selecting rows, paging with alphabet, Ascending/Descending sorting etc.
  5. <apex:form> </apex:form> : creates a layout to add form components which includes inputField , outputField, buttons.
  6. <apex:outputField> </apex:outputField> : component to show some text/message on the UI
  7. <apex:inputField> </apex:inputField> : component to take input from user.
  8. <apex:pageBlockTable> </apex:pageBlockTable> : Creates HTML tables to show data (Grid Table) . This creates on runtime, just have to pass the arraylist and it iterates and create grid
  9. <apex:column> </apex:column> : definition of each column in pageBlockTable with header Text
  10. <apex:pageBlockButton> </apex:pageBlockButton> : A div to add buttons in
  11. <apex:commandButton> </apex:commandButton> : A button with which we can create some action
  12. <apex:message> </apex:message > : A div to show error/success messages
  13. <apex:selectList> </apex:selectList> : pickList to select single/multiple records from a list of records
  14. <apex:actionPollar> </apex:actionPollar> : to call a function at a particular interval
  15. <apex:detail/> : This will show complete detail of particular record of system objects. With the help of detail tag we can detail of particular record (Complete or particular fields) and also this provides inline edit.
  16. <apex:tabPanel> </apex:tabPanel> : a panel or a div in which we can add tab for tabbing system to be enabled in our window
  17. <apex:tab> </apex:tab> : Represent each tab which comes under tab panel and in tab we can define out layout as per our need.
  18. <apex:selectRadio> </apex:selectRadio> : Creates a div for radio group. In this radio group you can add multiple select options and each select option will work as radio button.
  19. <apex:selectOption> </apex:selectoption> : This creates a option for radio buttons, picklist, checkboxes
  20. <apex:selectCheckboxes> </apex:checkboxes> : This creates a checkbox button
  21. <apex:pageBlockSection> </apex:pageBlockSection> : This will create a section with a title and expandable button
  22. <apex:actionSupport> </apex:actionSupport> : This provides functionality to add action on an input field, output field, label etc. This comes under open and close tag of any field for which we want to provide action support.
  23. <apex:inlineEditSupport /> : This provide feature to edit by clicking or focusing (depending on the condition) on the output field.
  24. <apex:outputLink> </apex:outputLink> : This creates a text field with link to open a website/page.
  25. <apex:param/> : This provides support to pass extra params with the outputLink url. This works as inline of output link.
  26. <apex:actionStatus> </apex:actionStatus> : This shows a message when a request is processing
  27. <apex:facet> </apex:facet> : This shows a message when request processing is completed.
  28. <apex:outputPanel> </apex:outputPanel> : This gives a div in which we can add components to show data in. We can add direct text, html tags, output fields, dynamic binding variables etc
  29. <apex:image> </apex:image> : This use to view image /picture
  30. <apex:includeScript> </apex:includeScript>: This is used to embed javascript in the page from a resource link.
  31. <apex:variable> </apex:variable> : This creates instance of a variable/object present in our apex code class. And we can that variable name anywhere in code.
  32. <apex:styleSheet /> : Used to embed style sheet in the apex page. This sheet can be from the static resource directory.
  33. <apex:repeat> </apex:repeat> : This tag will work as for loop and will iterate till the length of array passed.
  34. <apex:dynamicComponent> </apex:dynamicComponent> : This allow user to create dynamic component at runtime. We have to pass the reference of method that returns an instance of component this is to be create at runtime.

Be the first to comment

Leave a Reply

Your email address will not be published.