Currently I have a <h:inputText>
<h:outputLabel value="#{locale.nroEmployees}:"/>
<h:inputText value="#{companyEditBean.companyEmployeesAmount}"
disabled="#{not companyEditBean.editingAllowed}">
</h:inputText>
How can I achieve, that the user can only type digits in input fields?
You can filter it afterwards to only accept numbers, or do somehting similar to:
<h:inputText value="#{companyEditBean.companyEmployeesAmount}"
disabled="#{not companyEditBean.editingAllowed}"
onkeypress="if(event.which < 48 || event.which > 57) return false;"/>
As an alternative way, you can use primeface for achieving this:
<h:form>
<h:panelGrid columns="2">
<h:outputText value="Number Input"/>
<h:inputText id="txt_" />
</h:panelGrid>
<p:keyFilter for="txt_" mask="num" />
</h:form>
Or, with primeface extension you can do this (assuming you added required jar and defining extension namespace as pe)
<p:inputText id="txt_" required="false" label=""
value="#{beanclass.blablamethod}" maxlength="10">
<f:validateLength minimum="10" for="txt_" />
<pe:keyFilter regEx="/[\d\-]/"></pe:keyFilter>
</p:inputText>
Related
I have a loop for constructing 12 input fields:
<h:panelGroup id="panel">
<c:forEach id="iter" items="#{of:createIntegerArray(0,12)}" var="dVar" varStatus="dLoop">
<h:inputText id="input#{dLoop.index}" value="#{doc['input'+=dLoop.index]}" process="#form:panel" update="#form:panel" />
</c:forEach>
<o:validateMultiple id="validateFields" components="#{controller.componentsString}" validator="#{dValidator}" />
</h:panelGroup>
This works ok, until I put a standard validator on the input field. Then the #{dValidator} is not triggered.
So this is not triggering the validator in o:validateMultiple:
<h:panelGroup id="panel">
<c:forEach id="iter" items="#{of:createIntegerArray(0,12)}" var="dVar" varStatus="dLoop">
<h:inputText id="input#{dLoop.index}" value="#{doc['input'+=dLoop.index]}" process="#form:panel" update="#form:panel">
<o:validator validatorId="javax.faces.Length" minimum="5" />
</h:inputText>
</c:forEach>
<o:validateMultiple id="validateFields" components="#{controller.componentsString}" validator="#{dValidator}" />
</h:panelGroup>
Is this a bug in the library? Is there a workaround?
Thanks.
I want one requiredmessage for two h:selectOneMenu components, that is when a user submits the form if one of those selects values is not null, the bean method should be called, otherwise(both of them null) : I should tell him to select at least one, is it possible? or do I have to use JS.
Thanks in advance,
I'd use the OmniFaces validateOne validator for this or the validateOneOrMore if filling both is allowed too.
Code example from their site:
<h:form>
<h3>Please fill out only one of two fields</h3>
<o:validateOne id="one" components="foo bar" />
<h:panelGrid columns="3">
<o:outputLabel for="foo" value="Foo" />
<h:inputText id="foo" />
<h:message for="foo" />
<o:outputLabel for="bar" value="Bar" />
<h:inputText id="bar" />
<h:message for="bar" />
<h:panelGroup />
<h:commandButton value="submit">
<f:ajax execute="#form" render="#form" />
</h:commandButton>
<h:panelGroup>
<h:message for="one" />
<h:outputText value="OK!" rendered="#{facesContext.postback and not facesContext.validationFailed}" />
</h:panelGroup>
</h:panelGrid>
</h:form>
I have a view which is working well. However, when I add a required="true" into the body of the view, the view begin to be unable to read backing bean properly. Below is a comparison:
Anyone knows why?
.
Edit: Code fragment supplement
Below is the fragment of my code in which the problem arises. If I add required="true" into any p:inputText (not only the p:inputText that belong to this dialog but any p:inputText inside the html body), it stops displaying information from backing bean, remove it and everything works just fine.
<p:dialog header="Customer Editor" widgetVar="customerEditDialog"
resizable="false" id="customerEditDlg" showEffect="fade"
hideEffect="fade" modal="true">
<h:panelGrid id="editGrid" columns="2" cellpadding="4"
style="margin:0 auto;">
<h:outputLabel for="customerNameEdit" value="Name: " />
<p:inputText id="customerNameEdit" maxlength="30"
value="#{customerController.customerAdd.name}" />
<h:outputLabel for="customerPhoneNumberEdit" value="Phone Number " />
<p:inputText id="customerPhoneNumberEdit" maxlength="15"
onkeypress="if(event.which < 48 || event.which > 57) return false;"
value="#{customerController.customerAdd.phoneNumber}" />
<h:outputLabel for="customerEmailEdit" value="Email: " />
<p:inputText id="customerEmailEdit" maxlength="49"
value="#{customerController.customerAdd.email}" />
<h:outputLabel for="customerAddressEdit" value="Address: " />
<p:inputText id="customerAddressEdit" maxlength="190"
value="#{customerController.customerAdd.address}" />
<f:facet name="footer">
<div style="text-align: right">
<p:commandButton id="editCustomerButton"
update=":form:customerList, :form:messages"
oncomplete="customerEditDialog.hide()" value="Save"
actionListener="#{customerController.editCustomer()}">
</p:commandButton>
<p:commandButton id="cancelEditCustomerButton" update=":form"
onclick="customerEditDialog.hide()" value="Cancel">
</p:commandButton>
</div>
</f:facet>
</h:panelGrid>
</p:dialog>
See if jsf required=true destroys setPropertyActionListener? helps you.
The problem is most likely that the setter in your bean is not to be called because of validation errors somewhere else or you are nesting <h:form> elements.
i want to inplace edit a autoComplete text field:
<h:panelGroup>
<ui:repeat value="#{cc.attrs.relations}" var="ur">
<p:panel headerText="Relation">
<p:inplace editor="true" >
<!-- <p:inputText value="#{ur.relation.name}"
required="true" label="text"/>-->
<p:autoComplete
value="myval"
/>
</p:inplace>
</p:panel>
</ui:repeat>
</h:panelGroup>
However, this does not work (autocomplete is not shown.).
Do you know how to accomplish this?
The reason autocomplete is not shown is that inplace does not get its label as with i.e. inputText.
adding label="TheLabel" solves the problem.
<h:panelGroup>
<ui:repeat value="#{cc.attrs.relations}" var="ur">
<p:panel headerText="Relation">
<p:inplace editor="true" label="TheLabel">
<!-- <p:inputText value="#{ur.relation.name}"
required="true" label="text"/>-->
<p:autoComplete
value="myval"
/>
</p:inplace>
</p:panel>
</ui:repeat>
</h:panelGroup>
I have a h:panelGroup in JSF page with input field for data selection:
<h:panelGroup>Date to change password</h:panelGroup>
<h:panelGroup>
<h:inputText value="#{AddAccountController.formMap['DATETOCHANGEPASSWD']}" autocomplete="off" >
<f:validateLength minimum="0" maximum="35"/>
</h:inputText>
</h:panelGroup>
The question is how I can integrate the calendar into the input menu. Something like this:
<h:panelGroup>Date to change password</h:panelGroup>
<h:panelGroup>
<h:inputText value="#{AddAccountController.formMap['DATETOCHANGEPASSWD']}" autocomplete="off" >
<p:calendar value="#{AddAccountController.date4}" pattern="MM/dd/yyyy HH:mm:ss" />
<f:validateLength minimum="0" maximum="35"/>
</h:inputText>
</h:panelGroup>
I tested the code but it's not working. What is the proper way to use it into input field?
think you have to add two different field in from because this way it will not work in this way.
<h:panelGroup>Date to change password</h:panelGroup>
<h:panelGroup>
<h:inputText value="#{AddAccountController.formMap['DATETOCHANGEPASSWD']}" autocomplete="off" >
<f:validateLength minimum="0" maximum="35"/>
</h:inputText>
<p:calendar value="#{AddAccountController.date4}" pattern="MM/dd/yyyy HH:mm:ss"/>
</h:panelGroup>