How to add Dynamically page block on button click.? pleas can any one help me.

thanks In Advance.

  • 2
    Parth you can do one thing create pageblock with some id, and you can set visibilty off by default, using rendered = false. than on onclick you can set rendered = true. – Amit Chaudhary Jul 10 '15 at 17:53
  • Can you please give me example of that – Parth Thakkar Jul 10 '15 at 17:59
  • ok, have you use rerender functionality ..... ? – Amit Chaudhary Jul 10 '15 at 18:08
  • Please try example which i mentioned below... – Amit Chaudhary Jul 10 '15 at 18:27
  • Out of curiosity, have you already tried the Visualforce workbook or trailhead learning exercises ? That would be a good start if you are new to visualforce. – Samuel De Rycke Jul 10 '15 at 19:16

You can use apex:repeat with a list to generate as many Page Blocks as you like. The code below will display a button called "Add Section". One new page block will be added every time you click on the button. Hope this helps.

<apex:page controller="TestController">


        <apex:commandButton value="Add Section" reRender="sectionsPanel" action="{!addSection}" />

        <apex:outputPanel id="sectionsPanel">
            <apex:repeat value="{!lstSections}" var="section">

                <apex:pageBlock title="PageBlock">
                    <apex:pageBlockSection title="PageBlockSection">
                        <apex:pageBlockSectionItem>Do Something Here</apex:pageBlockSectionItem>





public with sharing class TestController {
    public List<String> lstSections { get; set; }

    public TestController(){
        lstSections = new List<String>();

    public PageReference addSection() {


        return null;


Hope this example helps you

 <apex:page controller="TestMyPage" >
  <apex:form >
          <apex:pageBlock id="block">
                <apex:pageBlockSection title="Section 1" rendered="{!showSection1}"/>                                        
                <apex:pageBlockSection title="Section 2" rendered="{!showSection2}"/>   

              <apex:commandButton action="{!method1}" value="Show/Hide Section1" reRender="block"/>
              <apex:commandButton action="{!method2}" value="Show/Hide Section2"  reRender="block"/>


public with sharing class TestMyPage{
     public Boolean showSection1{get;set;}
     public Boolean showSection2{get;set;}            

        public TestMyPage (){
             showSection1= true;
             showSection2= true;

    public void method2(){
         if(showSection2== true){
             showSection2= false;
             showSection2= true;

    public void method1() {
         if(showSection1== true){
             showSection1= false;
             showSection1= true;

You need to use Dynamic Visualforce Components to create VF components dynamically on runtime. For example, to create a table:


See this link.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.