title: JSF2 commandButton; AJAX or non AJAX, it refreshed the whole page
body: <p>this is a simple example which demonstrates the case.</p>
  
  <p>you have a form with a Panel and two commandButton, one is AJAX the other is not. by clicking on any of them, an InputText will be created in the backing bean and added to the Panel.</p>
  
  <p>My managed bean:</p>
  
  <pre><code>@ManagedBean
  
  public class DynamicPanel {
  
  private Panel dynmaic;
  
  
  
  public Panel getDynmaic() {
      return dynmaic;
  }
  
  public void setDynmaic(Panel dynmaic) {
      this.dynmaic = dynmaic;
  }
  
  public String adddynamic(){
  
      InputText text = new InputText();        
      dynmaic.getChildren().add(text);
      text.setValue(text.getId()+" Size= "+ dynmaic.getChildren().size());
      return null;
  }
  
  public String removeall(){
      this.dynmaic.getChildren().clear();
      return null;
  }
  }
  </code></pre>
  
  <p>My XHTML page</p>
  
  <pre><code>&lt;?xml version='1.0' encoding='UTF-8' ?&gt;
  &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html" xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui" xmlns:f="http://java.sun.com/jsf/core"&gt;
  &lt;h:head&gt;
      &lt;title&gt;Facelet Title&lt;/title&gt;
  &lt;/h:head&gt;
  &lt;h:body&gt;
      &lt;h:form&gt;
          &lt;p:panel id="dynamic" binding="#{dynamicPanel.dynmaic}"&gt;
  
          &lt;/p:panel&gt;
  
          &lt;h:commandButton value="Add with AJAX" id="ajaxBtn" &gt;
          &lt;f:ajax onevent="onClick" execute="#{dynamicPanel.adddynamic()}" render="dynamic" /&gt;
           &lt;/h:commandButton&gt;
  
          &lt;h:commandButton value="Add" action="#{dynamicPanel.adddynamic}" /&gt;
          &lt;h:commandButton value="remove all" action="#{dynamicPanel.removeall}" /&gt;   
      &lt;/h:form&gt;
  
  
  &lt;/h:body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>my faces-config.xml is empty.</p>
  
  <p>Now, I have three issues with the code above.  Could someone please clarify it to me, I'm new to JSF2.</p>
  
  <p>the first is, why both command buttons behave the same?  clicking on ether one would refresh the whole page.</p>
  
  <p>the second issue is, why clicking on the non AJAX commandButton adds two Inputfieds at a time?</p>
  
  <p>the third is, why changing the scope of the managed bean to @SessionScoped  will give an error once you load the page? ( somehow just loading the page, the form issues an ajax request without me clicking on the commandButton. Why is that?</p>