3

I'm currently in project to create dynamic form, using Primefaces 8.0 and Primefaces Extension 8.0. I want to make length validation in user input for phone number with minimum and maximum length using f:validateLength, but somehow the validation always fails said the length is greater than allowed even though i set the maximum to 10 and I just input 1 character. Here's my code

xhtml:

<h:form prependId="false">
            <p:messages/>
            <pe:dynaForm id="df" 
                         value="#{testMBean.modelz}" var="data" 
                         class="ui-fluid" style="width: 100%;" varContainerId="dfid">
                <pe:dynaFormControl id="dfc-text" type="Text" style="white-space: normal;">
                    <p:panelGrid id="pg-txt" columns="3" layout="grid" class="no-padding no-border"
                                 styleClass="ui-panelgrid-blank form-group"
                                 columnClasses="ui-grid-col-4,ui-grid-col-8,ui-grid-col-2">
                        <p:outputLabel for="@next" 
                                       value="#{data.labelEn}"/>
                        <p:inputText id="txt" value="#{data.value}" required="false">
                            <f:validateLength for="@previous" minimum="#{data.minLength}" maximum="#{data.maxLength}"/>
                        </p:inputText>
                        <p:outputLabel value="#{data.minLength} - #{data.maxLength}"/>
                    </p:panelGrid>
                </pe:dynaFormControl>
            </pe:dynaForm>
            <p:commandButton process="@form" update="@form"/>
</h:form>

TestMBean:

private DynaFormModel modelz;

modelz = new DynaFormModel();
DynaFormRow row = modelz.createRegularRow();
DynamicModel dm = new DynamicModel();
dm.setMinLength(0);
dm.setMaxLength(10);
dm.setLabelEn("Test");
row.addControl(dm, "Text");
dm = new DynamicModel();
dm.setMinLength(1);
dm.setMaxLength(20);
dm.setLabelEn("Test2");
row.addControl(dm, "Text");

DynamicModel:

@Getter
@Setter
@ToString
public class DynamicModel implements Serializable {
    private String labelEn;
    private Object value;
    private Integer minLength;
    private Integer maxLength;
}

The result: It's said that the maximum allowed value is 0.

It's said that the maximum allowed value is 0 but as you can see I display the value for minLength and maxLength and it shows that the minLength is 0 and maxLength is 10. So I check the source and got this: Yes it shows 0 for both min and max Length

Am I doing something wrong? Can anyone please point out where I did wrong. Thanks.

Jasper de Vries
  • 19,370
  • 6
  • 64
  • 102
Blablabla
  • 127
  • 1
  • 1
  • 8

1 Answers1

0

I solved the problem using custom validator that extends javax.faces.validator.LengthValidator with f:attribute tag to set the minimum and maximum value.

Create TextValidator which extends javax.faces.validator.LengthValidator to intercept the attributes:

public class TextValidator extends LengthValidator {

    @Override
    public void validate(FacesContext context, UIComponent component, Object value)
            throws ValidatorException {
        if (value != null && !value.toString().trim().isEmpty()) {
            Object minimum = component.getAttributes().get("minimum");
            Object maximum = component.getAttributes().get("maximum");
            setMinimum(minimum != null ? Integer.valueOf(minimum.toString()) : 0);
            setMaximum(maximum != null ? Integer.valueOf(maximum.toString()) : 0);
        }
        super.validate(context, component, value);
    }

}

TestMBean:

TextValidator textValidator = new TextValidator();
modelz = new DynaFormModel();
DynaFormRow row = modelz.createRegularRow();
DynamicModel dm = new DynamicModel();
dm.setMinLength(0);
dm.setMaxLength(10);
dm.setLabelEn("Test");
row.addControl(dm, "Text");
dm = new DynamicModel();
dm.setMinLength(2);
dm.setMaxLength(20);
dm.setLabelEn("Test2");
row.addControl(dm, "Text2");

Then bind textValidator to f:validator tag in xhtml:

<h:form prependId="false">
        <p:messages/>
        <pe:dynaForm id="df" 
                     value="#{testMBean.modelz}" var="data" 
                     class="ui-fluid" style="width: 100%;" varContainerId="dfid">
            <pe:dynaFormControl id="dfc-text" type="Text" style="white-space: normal;">
                <p:panelGrid id="pg-txt" columns="3" layout="grid" class="no-padding no-border"
                             styleClass="ui-panelgrid-blank form-group"
                             columnClasses="ui-grid-col-4,ui-grid-col-8,ui-grid-col-2">
                    <p:outputLabel for="@next" 
                                   value="#{data.labelEn}"/>
                    <p:inputText id="txt" value="#{data.value}" required="false">
                        <f:validator binding="#{testMBean.textValidator}"/>
                        <f:attribute name="minimum" value="#{data.minLength}"/>
                        <f:attribute name="maximum" value="#{data.maxLength}"/>
                    </p:inputText>
                    <p:outputLabel value="#{data.minLength} - #{data.maxLength}"/>
                </p:panelGrid>
            </pe:dynaFormControl>
            <pe:dynaFormControl id="dfc-text2" type="Text2" style="white-space: normal;">
                <p:panelGrid id="pg-txt2" columns="3" layout="grid" class="no-padding no-border"
                             styleClass="ui-panelgrid-blank form-group"
                             columnClasses="ui-grid-col-4,ui-grid-col-8,ui-grid-col-2">
                    <p:outputLabel for="@next" 
                                   value="#{data.labelEn}"/>
                    <p:inputText id="txt2" value="#{data.value}" required="false">
                        <f:validator binding="#{testMBean.textValidator}"/>
                        <f:attribute name="minimum" value="#{data.minLength}"/>
                        <f:attribute name="maximum" value="#{data.maxLength}"/>
                    </p:inputText>
                    <p:outputLabel value="#{data.minLength} - #{data.maxLength}"/>
                </p:panelGrid>
            </pe:dynaFormControl>
        </pe:dynaForm>
        <p:commandButton process="@form" update="@form"/>
    </h:form>

Here's the output if the validation fails: enter image description here

And here's if the value passes the validation: enter image description here

Thanks to this answer

Blablabla
  • 127
  • 1
  • 1
  • 8