CODEWITHSUNDEEP
validationjsfjsf-2conditional-rendering
Marcelo Barros
Marcelo Barros

Reputation: 1048

Render a component only when validation success

In JSF 2.X, can I render a component only when the validation success?

In my application I have many fields that must be filled. These data can be imported from a WebService through a search key.

When the user enter a valid search key the system searches the other fields and render them with the new values. But when the user enter a nonexistent key (or any other validation error) the server generates a validation error but still renders the fields, thus losing any data that there were filled.

What I need is that the user can perform the query and that if the query does not return results, this does not affect any data that he has already entered.

Below is a code example. Thus, if the user has filled in the fields inside updateThisOnSuccess and just after making an attempt to query without success, the value that is filled in is not lost.

    <h:inputText value="#{controller.searchWebService}" >
        <f:ajax execute="@this" render="updateThisOnSuccess messages" />
    </h:inputText>

    <h:panelGroup id="updateThisOnSuccess">
        <h:inputText value="#{controller.field}" />
        <!-- other fields -->
    </h:panelGroup>

Submit the field values to run the search also does not seem an option as this will cause need to validate the fields inside updateThisOnSuccess.

Note: I saw the answer given by @BalusC to a similar question, but this is different from what I'm wondering why, in that case, foo-holder is always rendered and foo is conditioning. It's not my case, since this approach would make the controls do not appear when the validation fails.

Upvotes: 1

Views: 3619

Answers (4)

A.Panzer
A.Panzer

Reputation: 391

Try this

<h:panelGroup id="updateThisOnSuccess">
    <ui:fragment rendered="#{not facesContext.validationFailed}">
        <h:inputText value="#{controller.field}" />
        <!-- other fields -->
    </ui:fragment>
</h:panelGroup>

Upvotes: 2

Marcelo Barros
Marcelo Barros

Reputation: 1048

You can change the components that will be processed in render phase changing the Collection at getRenderIds() of PartialViewContext. According to documentation this Collection is mutable.

FacesContext.getCurrentInstance().getPartialViewContext().getRenderIds().remove("formName:updateThisOnSuccess");

To test this solution, I used this controller:

@Named
@ViewScoped
public class Controller implements Serializable {

    private static final long serialVersionUID = 1L;

    private final static List<String> LIST_VALID_WEB_SERVICE_SEARCHS =
        Arrays.asList(new String[] {"foo", "bar"});

    private String webServiceParameter;
    private Integer field01;

    public void searchWebService() {

        if (LIST_VALID_WEB_SERVICE_SEARCHS.contains(getWebServiceParameter())) {
            setField01(123);
        } else {

            FacesContext facesContext = FacesContext.getCurrentInstance();

            facesContext.getPartialViewContext().getRenderIds().remove("formFields");

            FacesMessage facesMessage = new FacesMessage("Search not found in WebService.");
            facesMessage.setSeverity(FacesMessage.SEVERITY_ERROR);
            facesContext.addMessage("formName:searchWebService", facesMessage);
        }
    }

    public void submit() {
        System.out.println("submitted");
    }

    // Getters and Setters
}

And used this view:

<h:form id="formSearch">
    <h:inputText id="webServiceParameter" value="#{controller.webServiceParameter}">
        <f:ajax execute="@this" render="formFields messages" listener="#{controller.searchWebService}" />
    </h:inputText><br />
</h:form>

<h:form id="formFields">
    <h:inputText id="field01" value="#{controller.field01}" required="true">
        <f:validateLongRange minimum="2" maximum="345" />
    </h:inputText><br />
    <!-- other fields -->

    <h:commandButton value="submit" action="#{controller.submit}">
        <f:ajax render="@form messages" execute="@form" />
    </h:commandButton>
</h:form>

<h:messages id="messages" />

Upvotes: 0

Javier Haro
Javier Haro

Reputation: 1255

Plaase try this. The requirements are that you must implement model validations with Bean Validation and the search field must implement JSF validation if required. If you write "123456" then data is returned, else nothing is returned and a message is printed.

The backing bean:

@Named
@ViewScoped
public class yourBean implements Serializable{

    private static final long serialVersionUID = 1L;

    @Size(min=2)
    private String field01;

    private String searchWebService;    

    public void saveF(){
        System.out.println("save");
    }

    public void searchWebServiceF(){

        Boolean successWS = ("123456").equals(this.searchWebService);
        if(successWS){
            this.setField01("WS data");
        }else{
            FacesContext.getCurrentInstance().
                addMessage(null, new FacesMessage(FacesMessage.SEVERITY_ERROR, "WS fails", ""));
        }
    }

    public String getSearchWebService() {
        return searchWebService;
    }
    public void setSearchWebService(String searchWebService) {
        this.searchWebService = searchWebService;
    }
    public String getField01() {
        return field01;
    }
    public void setField01(String field01) {
        this.field01 = field01;
    }
}

In your page:

<h:form id="form01">
<h:messages id="message"/>
    <h:inputText id="wsid" value="#{pruebasBorradorBean.searchWebService}">
        <f:validateLength maximum="6"/>
        <f:ajax execute="@form" render="@form" listener="#{pruebasBorradorBean.searchWebServiceF()}" />
    </h:inputText>

    <h:panelGroup id="thedata">
        <h:inputText value="#{pruebasBorradorBean.field01}">
            <f:validateBean disabled="#{param['javax.faces.source']!='form01:save'}"/>
        </h:inputText>
        <!-- other fields -->
    </h:panelGroup>
    <h:commandButton id="save" value="submit">
        <f:ajax render="thedata message" execute="@this thedata" listener="#{pruebasBorradorBean.saveF()}"/>
    </h:commandButton>

</h:form>

Upvotes: 0

Javier Haro
Javier Haro

Reputation: 1255

You can do something like that:

<f:ajax execute="@this" render="#{controller.success} message"/>

where success is a String attribute that will be empty if the WS fails and will be "updateThisOnSuccess" if not .

Or you could get rid of the JSF validation mechanism for informing the user the WS has failed. Think of it, it is not really a validation of the Model. You could draw an icon beside the WS Id field in red color or something similar using a boolean flag attribute in the backing bean.

Upvotes: -1

Related Questions