title: primefaces ajax update element
body: <p>i have a behaviour here i don't understand. I am using Spring 3.1, Primefaces 3.3.1 and JSF 2.</p>
  
  <p>I am using a datatable and want to add a row via a dialog within a form.
  This is my table, including the button to call the dialog:</p>
  
  <pre><code>&lt;h:form id="form"&gt;
  
              &lt;!-- open the dialog on click --&gt;
      &lt;p:commandButton value="New" onclick="dlgAddTask.show()"
          update="taskList" /&gt;
  
      &lt;p:dataTable var="task" value="#{taskBean.tasks}" id="taskList"
          widgetVar="taskList" editable="true" rowkey="task.id"
          paginator="true" rows="50"
          paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
          rowsPerPageTemplate="25,50,100"&gt;
  
          &lt;p:ajax event="rowEdit" update="@this" listener="#{taskBean.save}" /&gt;
  
          &lt;p:column headerText="Name" style="width:125px"&gt;
              &lt;p:cellEditor&gt;
                  &lt;f:facet name="output"&gt;
                      &lt;h:outputText value="#{task.name}" style="width:100%" /&gt;
                  &lt;/f:facet&gt;
                  &lt;f:facet name="input"&gt;
                      &lt;p:inputText value="#{task.name}" style="width:100%" /&gt;
                  &lt;/f:facet&gt;
              &lt;/p:cellEditor&gt;
          &lt;/p:column&gt;
  
          &lt;p:column style="width:20px"&gt;
              &lt;p:rowEditor /&gt;
          &lt;/p:column&gt;
  
      &lt;/p:dataTable&gt;
  
  &lt;/h:form&gt;
  </code></pre>
  
  <p>This is my dialog with the relevant javascript (it's in the same form as the table is):
      </p>
  
  <pre><code>    &lt;p:dialog id="dlgAddTask" header="Add New Task" widgetVar="dlgAddTask"&gt;
          &lt;h:form&gt;
  
              &lt;h:panelGrid columns="2" cellpadding="5" width="500"&gt;
                  &lt;h:outputLabel for="name" value="Name" /&gt;
                  &lt;p:inputText value="#{addTaskBean.name}" id="name" required="true"
                      label="name" /&gt;
  
                  &lt;h:outputLabel for="description" value="Description:" /&gt;
                  &lt;p:inputTextarea value="#{addTaskBean.description}"
                      id="description" label="description" /&gt;
  
                  &lt;h:outputLabel for="dueTo" value="Due To:" /&gt;
                  &lt;p:calendar value="#{addTaskBean.dueTo}" id="dueTo" label="dueTo" /&gt;
  
                  &lt;h:outputLabel for="done" value="Done:" /&gt;
                  &lt;p:selectBooleanCheckbox value="#{addTaskBean.done}" id="done"
                      label="done" /&gt;
  
                  &lt;f:facet name="footer"&gt;
                      &lt;p:commandButton id="addButton" value="Add"
                          actionListener="#{addTaskBean.addTask}"
                          oncomplete="handleLoginRequest(xhr, status, args)" /&gt;                       
  
  
                      &lt;p:commandButton value="Cancel" onclick="dlgAddButton.hide()" /&gt;
                  &lt;/f:facet&gt;
              &lt;/h:panelGrid&gt;
  
          &lt;/h:form&gt;
      &lt;/p:dialog&gt;
  
      &lt;script type="text/javascript"&gt;
              function handleLoginRequest(xhr, status, args) {
                  if (args.validationFailed || !args.taskAdded) {
                      jQuery('#dialog').effect("shake", {
                          times : 3
                      }, 100);
                  } else {
                      dlgAddTask.hide();
                  }
              }
          &lt;/script&gt;
  
  &lt;/h:form&gt;
  </code></pre>
  
  <p>And this is my Bean (leaving out the getter and setter):</p>
  
  <pre><code>public class AddTaskBean {
  
  @Inject
  TaskDao taskDao;
  
  private boolean done;
  
  private String name;
  
  private String description;
  
  private Date dueTo;
  
  @Transactional
  public void addTask() {
  
      RequestContext context = RequestContext.getCurrentInstance();
      FacesMessage msg = null;
      Task task = new Task();
      boolean taskAdded = false;
  
      task.setDescription(getDescription());
      task.setDone(isDone());
      task.setDueTo(getDueTo());
      task.setName(getName());
  
      if (taskDao.persist(task) != null) {
          taskAdded = true;
          msg = new FacesMessage(FacesMessage.SEVERITY_INFO, "Task",
                  getName() + " added.");
      } else {
          taskAdded = false;
          msg = new FacesMessage(FacesMessage.SEVERITY_WARN, "Task Error",
                  "Something went wrong on adding task.");
      }
  
      FacesContext.getCurrentInstance().addMessage(null, msg);
      context.addCallbackParam("taskAdded", taskAdded);
  
  }
  </code></pre>
  
  <p>Now, if i open the dialog, add a task, it works up to the update point. So i have a new task in the database, the dialog closes, but the table does not get updated.
  Hitting F5 shows me the new task in the table.</p>
  
  <p>But (please read carefully as it is a bit tricky to explain for me), if i dont close the dialog after adding a task (by not calling the javascript via oncomplete="handleLoginRequest(xhr, status, args)"), the task will be added too, but the dialog remains open of course.
  If i press cancel then, the dialog closes and the table get's updated and i can see the new task.</p>
  
  <p>I cannot explain this, maybe one of you can?</p>
  
  <p>Thanks in Advance</p>