pe:fluidGrid and Bean Validation issue

[arturo]

Hi there,

Just wanted to test the brand new pe:fluidGrid component with a existing form that have input components grouped with panelGrids, like this:

Code: Select all

<h:form>
            <pe:fluidGrid>
                <pe:fluidGridItem>
                          <h2>Datos generales</h2>
                          <h:panelGrid columns="2">
                               <h:outputLabel for="numeroGrupo" value="Nº de Grupo:"/>
                               <p:inputText id="numeroGrupo" value="#{crearGrupo.grupo.numeroGrupo}"/>
                          </h:panelGrid>
                </pe:fluidGridItem>
                <!-- More fluid grids here -->
            </pe:fluidGrid>

The value="#{crearGrupo.grupo.numeroGrupo}" has a @NotNull constraint.

The problem is: When I submit the form without fill, it's submited without errors, reaching the Invoke Application Phase with invalid values and causing a lot of problems (in my case EJB exception caused by javax.validation.ConstraintViolationException).

I think Bean Validation is bypassed in some way.

If I remove the fluidGrid stuff, the form is working again. (Validation Phase fails as expected)

[Oleg]

I think you missed "value" und "var" in <pe:fluidGrid>. But ok. I can not see how FluidGrid and Bean Validation depend each from other. JSF components are undependent from Bean Validation. Right? Have you tested other data iteration components with Bean Validation? Maybe you are missing some settings in web.xml.

[arturo]

I didn't use "value" and "var" since I don't use the dynaForm feature, just wanted to layout components.

While doing a test case, I discovered what could be the root cause: fluidGrid is a NamingContainer (because it appends its id to it's childrens), but it doesn't process it's child components:

Code: Select all

        <h:form id="form">
            <p:messages id="msgs" autoUpdate="true"/>

            <pe:fluidGrid id="fluidGrid">
                <pe:fluidGridItem>
                    <p:inputText id="input" value="#{bean.value}"/>
                </pe:fluidGridItem>
                <pe:fluidGridItem>
                    <p:commandButton id="button" value="Submit value" actionListener="#{bean.checkSubmitedValue()}"/>
                </pe:fluidGridItem>
            </pe:fluidGrid>
            
        </h:form>

Bean.java

Code: Select all

@Named
@ViewScoped
public class Bean implements Serializable {

    @Size(max = 10)
    String value = "";

    public void checkSubmitedValue() {
        System.out.println("checkSubmitedValue called");
        System.out.println("value.length() = " + value.length());
        
        String msg = "value length is " + value.length();
        if (value.length() > 10) {
            msg = msg + ", BV contraint was bypassed";
        }
        FacesContext.getCurrentInstance().addMessage(null, new FacesMessage(msg));
    }

    public String getValue() {
        return value;
    }

    public void setValue(String value) {
        this.value = value;
    }
}

- If you click the button, the ajax call is sent, but the actionListener is never called
- If you move the button outside the fluidGrid, enter some value and click the button, the actionListener is called, but the submited value never changes

[Oleg]

Sure, you didn't set "process" in p:commandButton. Please try this

Code: Select all

<p:commandButton id="button" value="Submit value" process="fluidGrid" actionListener="#{bean.checkSubmitedValue()}"/>

or

Code: Select all

<p:commandButton id="button" value="Submit value" process=":form:fluidGrid" actionListener="#{bean.checkSubmitedValue()}"/>

[arturo]

Thanks Oleg for your advice, but it didn't work either.

I tried with:
- "@this fluidGrid"
- "@this :form:fluidGrid"
- Without set the process attribute
All give me the same results. (Components inside fluidGrid are not processed). @this is needed for the actionListener to be processed. If I don't set the process attribute, @all is sent in the ajax request.

Since BV is not the issue, I simplified the test, focusing on component processing test. In conclusion, components inside fluidGrid are not processed, not matter if is an ajax request or not.

Code: Select all

@Named
@ViewScoped
public class Bean implements Serializable {

    String value;

    public void checkSubmitedValue() {
        System.out.println("checkSubmitedValue Called");
        System.out.println("value = " + value);
    }

    public String getValue() {return value;}

    public void setValue(String value) {this.value = value;}
}

1st test: input and button are inside the fluidGrid
enter something in the input and click the button: nothing prints in the console -> button was not processed.

Code: Select all

        <h:form id="form">

            <pe:fluidGrid id="fluidGrid">
                <pe:fluidGridItem>
                    <p:inputText id="input" value="#{bean.value}"/>
                </pe:fluidGridItem>
                <pe:fluidGridItem>
                    <p:commandButton id="button"
                                     value="submit value"
                                     actionListener="#{bean.checkSubmitedValue()}"/>
                </pe:fluidGridItem>
            </pe:fluidGrid>

        </h:form>

2nd test: button is outside the fluidGrid
enter something in the input and click the button: checkSubmitedValue() is called, but print value = null no matter what you entered in the input -> input was not processed

Code: Select all

        <h:form id="form">

            <pe:fluidGrid id="fluidGrid">
                <pe:fluidGridItem>
                    <p:inputText id="input" value="#{bean.value}"/>
                </pe:fluidGridItem>
                <pe:fluidGridItem>
                </pe:fluidGridItem>
            </pe:fluidGrid>

            <p:commandButton id="button"
                             value="submit value"
                             actionListener="#{bean.checkSubmitedValue()}"/>
        </h:form>

3rd test:Both input and button are outside the fluidGrid
enter something in the input and click the button: checkSubmitedValue() is called, and print what you have entered in input -> both components are processed

Code: Select all

         <h:form id="form">

            <pe:fluidGrid id="fluidGrid">
                <pe:fluidGridItem>
                </pe:fluidGridItem>
                <pe:fluidGridItem>
                </pe:fluidGridItem>
            </pe:fluidGrid>

            <p:inputText id="input" value="#{bean.value}"/>
            <p:commandButton id="button"
                             value="submit value"
                             actionListener="#{bean.checkSubmitedValue()}"/>
        </h:form>

4rd test: Repeat tests 1, 2, 3 setting ajax="false"
-> Same results in all tests.

[Oleg]

But the processing is working well in the showcase http://fractalsoft.net/primeext-showcas ... naform.jsf If you press the "Submit" button there, required fields will be red.

Maybe the Mojarra version is a problem? I never tested with JSF 2.2. We have postponed these tests because MyFaces is not ready for 2.2. Can you try with JSF 2.1 please? Just to ensure that the problem is the new JSF version. I read some constants, etc. were changed in the 2.2.

[cybermedia]

This is happening to me as well.

I am trying to invoke an ajax action from within a fluidGridItem but nothing is happening.
When I am not using fluidGrid everything works.

Code: Select all

<pe:fluidGrid hGutter="50" widgetVar="fluidGridWdgt">
	<c:forEach var="propertyItem" items="#{productTypeController.getPropertyItems('REVIEW_PROPERTY', categoryItem)}">
		<pe:fluidGridItem>  
			<p:commandLink process="@this" ajax="true" actionListener="#{productTypeController.togglePropertyToProductType(propertyItem.id)}" 
				update="@this" style="text-decoration: none;">
				<c:choose>
					<c:when test="#{productTypeController.isPropertyInList(propertyItem.id)}">
						<i class="fa fa-check-square-o" ><p:outputLabel value=" #{propertyItem.name}"/></i>
					</c:when>
					<c:otherwise>
						<i class="fa fa-square-o" ><p:outputLabel value=" #{propertyItem.name}"/></i>
					</c:otherwise>
				</c:choose>
			</p:commandLink>              							
		</pe:fluidGridItem>
	</c:forEach>
</pe:fluidGrid> 

Is there any chance of a fix soon ? I am in desperate need of this beautifull component.

Tested with Mojarra 2.1.19-jboss (Jboss 7.1.1) and Mojarra 2.1.26 (Jboss 7.1.1)

[Oleg]

Please don't use JSTL like c:forEach. Please use "value" and "var" attributes on pe:fluidGrid and test it again!

Maybe I can do some tests too.

[Oleg]

I found the issue and created an issue ticket https://github.com/primefaces-extension ... issues/195

[Oleg]

I fixed the issue with processing of static items! Thanks for the reporting.

We will release the next version in december.