title: Adding rows in visualforce page in PageBlocktable dynamically
body: <p>i am creating a dummy visualforce page whose code is</p>
  
  <pre><code>&lt;apex:page controller="sampleCon"&gt;
      &lt;apex:form&gt;
      &lt;apex:pageMessages id="message" /&gt;
      &lt;apex:pageBlock&gt;
      &lt;apex:pageBlockTable value="{!wrap1}" var="item" id="hello"&gt;
      &lt;apex:column headerValue="String" value="{! item.x}"&gt;&lt;/apex:column&gt;
      &lt;apex:column headerValue="Action"&gt;&lt;apex:commandButton value="{!if(item.i == size-1,'Add','Delete')}" onclick="AddOrDelete({! item.i});" rerender="message"&gt;&lt;/apex:commandButton&gt;&lt;/apex:column&gt;
      &lt;/apex:pageBlockTable&gt;
      &lt;/apex:pageBlock&gt;
      &lt;apex:actionRegion &gt;
       &lt;apex:actionFunction name="AddOrDelete" action="{!addElement}" reRender="message,hello"&gt;
       &lt;apex:param value="" name="fieldName" /&gt;
    &lt;/apex:actionFunction&gt;
       &lt;/apex:actionRegion&gt;
      &lt;/apex:form&gt;
  &lt;/apex:page&gt;
  </code></pre>
  
  <p>and the controller code is</p>
  
  <pre><code>public class sampleCon {
  public List&lt;Wrapper&gt; wrap1{get;set;}
  public Integer size{get;set;}
  
  public sampleCon(){
  wrap1=new List&lt;Wrapper&gt;();
  wrap1.add(new wrapper(0));
   size=wrap1.size();
  
  }
  
  public PageReference addElement(){
  size=wrap1.size();
  
  
  System.debug('Hello ji'+Apexpages.currentPage().getParameters().get('fieldName')+'size is'+size);
  Integer i=Integer.valueOf(ApexPages.currentPage().getParameters().get('fieldName'));
  
  if(i == size-1)
  {
  wrap1.add(new wrapper(size));
  
  size++;
  }
  
  return null;
  
  }
  
  
      public class wrapper{
      public integer i{get;set;}
      public String x{get;set;}
      public wrapper(Integer p){
  i=p;
      }}
      }
  </code></pre>
  
  <p>what i am trying is the last row button label should be Add and other button label should be Delete when i press add button a new row is added and the label should be changed acordingly for this i am adding row but it is not working as expected</p>
  
  <p>initial page screenshot is 
  <img src="https://i.stack.imgur.com/RZUqN.png" alt="enter image description here">
  when i press add button screen look like this.
  <img src="https://i.stack.imgur.com/6oxs1.png" alt="enter image description here">
  when i again press the Add button screen is looking like first screenshot.i was expecting that one more row will be added when i click add button in above screenshot.can any one please tell why only one row is showing when i click add button in second screen shot and how to correct it that when i again click on add button on above screen one more row will be added instead of showing initial screen.</p>