CODEWITHSUNDEEP
validationprimefacesautocompletedialog
Todd Thiessen
Todd Thiessen

Reputation: 39

Autocomplete suggestions are null if PrimeFaces dialog is used after validation failure

PrimeFaces 3.5. Tomcat 7 JSF 2.0.

Consider the following example.

  <p:commandButton value="Open Dialog" oncomplete="myDialogWidget.show()"/>

  <p:dialog id="myDialog" widgetVar="myDialogWidget" modal="true" header="#{someDataAutoCompleteBean.selectedOption}">
    <h:form>
      <p:outputLabel for="someData" value="Some Data:" />
      <p:autoComplete id="someData" value="#{someDataAutoCompleteBean.selectedOption}"
        completeMethod="#{someDataAutoCompleteBean.determineOptions}" forceSelection="true" required="true"
        requiredMessage="Data can not be blank." queryDelay="0"/>
      <p:commandButton update=":myDialog" value="Save and Stay" oncomplete="myDialogWidget.show()"/>
      <p:commandButton value="Save and Close" oncomplete="handleDialogSubmit(myDialogWidget, args)"/>
    </h:form>
  </p:dialog>

And here is the bean:

import java.util.ArrayList;
import java.util.List;
import javax.faces.bean.ManagedBean;

@ManagedBean
public class SomeDataAutoCompleteBean
{
  private String selectedOption;

  public List<String> determineOptions(String query)
  {
    List<String> results = new ArrayList<String>();

    for (int i = 0; i < 10; i++)
    {
      results.add(query + i);
    }

    return results;
  }

  public String getSelectedOption()
  {
    return selectedOption;
  }

  public void setSelectedOption(final String selectedOption)
  {
    this.selectedOption = selectedOption;
  }
}

And there is a javascript function that is relevant:

  function handleDialogSubmit(dialog, args)
  {
    if (args.validationFailed)
    {
      dialog.show();
    }
    else
    {
      dialog.hide();
    }
  }

If you click on the "Save and Stay" button, you correctly get a validation message which indicates that a value is missing. If you then try and select a suggestion in the auto complete box by typing in it, you will receive a NullPointerException.

This is because the "completeMethod" of the dialog is not getting called resulting in the list of suggestions being null. primefaces happily continues as if something is actually there.

If the autocomplete component isn't in a dialog, this problem doesn't exists. Setting appendToBody="true" doesn't fix it.

It is like the dialog needs some kind of partial reset; not enough so that components which have failed validation still stay red, but enough of a reset so that the completeMethod gets called. I have even tried to fix this by issuing a reset on the form in the "onstart" method of the auto complete component.

Note that you can avoid the error by not updating the dialog, but the form instead, when the "Save and Continue" button is pressed. However, this results in the header not getting refreshed and displaying an incorrect value.

I think this is a bug in Primefaces. Can anyone confirm or offer a solution/workaround?

Upvotes: 1

Views: 1589

Answers (1)

Todd Thiessen
Todd Thiessen

Reputation: 39

It seems the problem is related to updating the form, not the dialog. The problem can be fixed by moving the form outside of the dialog. ie:

  <h:form>
    <p:dialog id="myDialog" widgetVar="myDialogWidget" modal="true" header="#{someDataAutoCompleteBean.selectedOption}">
      <p:outputLabel for="someData" value="Some Data:" />
      <p:autoComplete id="someData" value="#{someDataAutoCompleteBean.selectedOption}"
        completeMethod="#{someDataAutoCompleteBean.determineOptions}" forceSelection="true" required="true"
        requiredMessage="Data can not be blank." queryDelay="0"/>
      <p:commandButton update=":myDialog" value="Save and Stay" oncomplete="myDialogWidget.show()"/>
      <p:commandButton value="Save and Close" oncomplete="handleDialogSubmit(myDialogWidget, args)"/>
    </p:dialog>
  </h:form>

Upvotes: 0

Related Questions