hi as per my requirement there is one h:inputtext to find user. If user is found it populated first name, last name and email in corresponding h:inputtext which is disabled. but if not found that inputtext should become enabled and new details can be filled.
<h:inputText value="#{countryBean.usersDetailsDTO.eid}" id="eid" required="true" requiredMessage="Enter EID">
<f:ajax></f:ajax>
</h:inputText><h:message styleClass="msgStyle4" id="msgEid" for="eid"/>
</div>
<h:commandButton styleClass="search_btn" immediate="true">
<f:ajax listener="#{countryBean.getUserDetail}" render="empFName empLName empEmail" event="click" execute="#this" />
</h:commandButton>
<div class="clear"> </div>
<div class="form-field" style="margin-left:222px;">
first Name <h:inputText value="#{countryBean.usersDetailsDTO.firstName}" id="empFName" required="true" requiredMessage="Enter First Name">
<f:validator validatorId="nameValidation" />
</h:inputText><h:message styleClass="msgStyle4" id="msgfn" for="empFName"/>
</div>
<div class="clear"></div>
<div class="form-field" style="margin-left:10px;">
last name <h:inputText value="#{countryBean.usersDetailsDTO.lastName}" id="empLName" required="true" requiredMessage="Enter Last Name">
<f:validator validatorId="nameValidation" />
</h:inputText><h:message styleClass="msgStyle4" id="msgln" for="empLName"/>
</div><div class="clear"></div>
<div class="form-field" style="margin-left:10px;">
email<h:inputText value="#{countryBean.usersDetailsDTO.email}" id="empEmail" required="true" requiredMessage="Enter Email Address">
<f:validator validatorId="emailValidation" />
</h:inputText><h:message styleClass="msgStyle4" id="msgEmail" for="empEmail"/>
</div>
You can use disabled attribute on any time along with JSF EL to pass the Boolean value to disabled attribute.
For example in your case If you want to disable any h:inputText if first name is pre-populated then:
<h:inputText value="#{countryBean.usersDetailsDTO.email}" id="empEmail"
required="true" requiredMessage="Enter Email Address"
disabled="#{not(empty countryBean.usersDetailsDTO.firstName)}">
The above code will disable the Email input text disabled if firstname is pre-populated.
You can handle this on 2 ways:
1) You set the disable-tag of the inputText to a BackingBean-method like this:
<h:inputText ... disabled="#{countryBean.found}" ... />
2) Adding a valueChangeListener on the first inputText, so if it has a text, the others should be disabled.
Related
I use globalOnly="true" in h:messages to show messages as success or errors during bean methods......
<div class="row">
<div class="col">
<h:messages id="mensagens" warnClass="alert alert-danger" infoClass="alert alert-success" errorClass="alert alert-danger" globalOnly="true" />
</div>
</div>
and h:message for="" to validate field by field with bean validation
<h:inputText id="nome" styleClass="form-control" value="#{lojaMB.filial.nome}" />
<h:message for="nome" class="text-danger" />
It's works well......
But when I click on the "+" green button the modal opens
This modal use other managed bean and other form with ajax...
<h:commandButton value="Salvar" styleClass="btn btn-secondary" action="#{supermercadoMB.salvar}">
<f:ajax execute="#form" render=":mensagens :frmNovaFilial:supermercado #form" onevent="hideModal" />
</h:commandButton>
THE PROBLEM
when I click "Salvar" button the function "hideModal" executes, modal closes and bean validation send a error message by the blank field to parent page h:messages (no h:message ...) ....... but this message doesn't show........ Just shows when I remove globalOnly="true" .....but If I remove globalOnly="true" validations of field by field are show too on h:messages and h:message ......
how resolve this?
Create a parent element to your message component and after process the button update it
In the commandButton process only the nome inputText and the button itself
<h:panelGrid id="grid" columns="1">
<h:inputText id="nome" styleClass="form-control" value="#{lojaMB.filial.nome}" />
<h:message for="nome" class="text-danger" />
</h:panelGrid>
<h:commandButton value="Salvar" action="#{supermercadoMB.salvar}">
<f:ajax execute="#this :nome" render=":grid" onevent="hideModal" />
</h:commandButton>
I have a weird problem with jsf components (h:inputFile & h:selectBooleanCheckbox).
Both components receive focus, even when my mouse is somewhere else on the page. Here is the code:
<h:form id="logoUpload" enctype="multipart/form-data">
<div>
<h:outputLabel rendered="true">
<h:inputFile id="companyLogo" label="file" value="#{fileHandlerBean.part}" >
<f:validator validatorId="FileUploadValidator" />
</h:inputFile>
</h:outputLabel>
</div>
<div class="clear" />
<h:outputLabel rendered="true">
<div>
<div style="width: 5%">
<h:selectBooleanCheckbox id="acceptToULogo" value="#{companyEditController.confirmToU}">
<p:ajax event="change" update="buttonLogo" />
</h:selectBooleanCheckbox>
</div>
<div style="width: 95%">
<h:outputText value="Some Text " />
</div>
<br />
<h:commandButton id="buttonLogo" styleClass="formbutton" value="Upload"
action="#{companyEditController.companyLogoUpload()}"
actionListener="#{fileHandlerBean.uploadCompanyLogo()}"
disabled="#{!companyEditController.confirmToU}"/>
</div>
</h:outputLabel>
</h:form>
If I move the mouse over the h:outputText the checkbox receives focus.
I had the same problem with the h:inputFile tag. I solved it by surrounding it with a h:outputLabel tag, but unfortunately it doesn´t workd with the selectBooleanCheckbox.
Did somebody have the same problem in the past and knows a solution?
This is because everything is wrapped in the h:outputLabel tag. This outputLable is rendered as a plain label html element.
You can see form the W3C specification that anything inside the label will toggle the control
The element does not render as anything special for the user. However, it provides a usability improvement for mouse users, because if the user clicks on the text within the element, it toggles the control
To fix this, you need to replace the h:output label tag using a h:panelGroup layout="block" which renders a <div>:
<h:panelGroup layout="block" rendered="true">
<div>
<div style="width: 5%">
<h:selectBooleanCheckbox id="acceptToULogo" >
<p:ajax event="change" update="buttonLogo" />
</h:selectBooleanCheckbox>
</div>
<div style="width: 95%">
<h:outputText value="Some Text " />
</div>
<br />
<h:commandButton id="buttonLogo" styleClass="formbutton" value="Upload"/>
</div>
</h:panelGroup>
I want to create JSF form with attached file. But also to give a option form the users to submit the for without attach file. I don't want this to be mandatory.
<h:form id="form" enctype="multipart/form-data">
<div class="string">
<label class="name">
<h:inputText id="name" value="#{contacts.name}" pt:placeholder="Name*:"/>
</label>
</div>
<label class="message">
<h:inputTextarea value="#{contacts.comment}" pt:placeholder="Comment*:"/>
</label>
<h:inputFile id="fileToUpload" value="#{contacts.file}" required="true" requiredMessage="No file selected ..."/>
<h:commandButton value="Upload" action="#{contacts.upload()}">
<f:ajax execute="fileToUpload" />
</h:commandButton>
<h:message showDetail="false" showSummary="true" for="fileToUpload" style="color:red"/>
<div class="btns">
<h:commandLink id="submitlink" class="link" value="submit" action="#{contacts.sendEmail}" >
<f:ajax render="#form" execute="#form" onevent="handleDisableButton" resetValues="true"/>
</h:commandLink>
</div>
<h:outputText id="output" value="#{contacts.result}" />
</h:form>
Is there a way to implement this because now if I try to submit the form I always get message No file selected ...?
Also when I attach a file using the button upload button no message appears for successful file upload.
You have your inputFile as required. That is why you have to upload first always.
Also, if you are not seeing any message it's because you are not rendering again your h:message. Try using this in your managed bean:
FacesContext.getCurrentInstance().getPartialViewContext().getRenderIds()
.add("idMessage");
change
<h:inputFile id="fileToUpload" value="#{contacts.file}" required="true" requiredMessage="No file selected ..."/>
to
<h:inputFile id="fileToUpload" value="#{contacts.file}" />
Inside a <a4j:outputPanel> I have a disabled inputtext that displays Authors from a List<Author> that belongs to the class DocumentBean. I have also a <h:selectOneMenu> that displays names of Authors. When an Author from the menu is selected the Author is added to the List<Author> I mentioned above, and a new disabled inputtext appears.
Here's the code described above:
Autor:
<a4j:outputPanel id="teste">
<a4j:repeat value="#{insertDocController.docController.documentBean.authorList}" var="author">
<br />
<h:inputText value="#{author.name}" disabled="true" />
<br />
<a4j:commandButton type="submit" action="#{insertDocController.removeAutor(author.uri)}"
value="Remover" render="teste" />
</a4j:repeat>
<br />
<h:selectOneMenu id="chooseAuthor" value="#{insertDocController.selectedAuthorUri}">
<f:selectItem noSelectionOption="true" itemLabel="selecione" itemValue=""/>
<f:selectItems value="#{insertDocController.authorValues}" var="author"
itemValue="#{author.uri}" itemLabel="#{author.name}"/>
</h:selectOneMenu>
<a4j:commandButton type="submit" action="#{insertDocController.addAuthor()}"
value="Inserir" render="teste" />
<br />
</a4j:outputPanel>
Here's the addAuthor() from insertDocController:
public void addAuthor() {
if(this.selectedAuthorUri != null) {
AuthorBean a = new AuthorBean();
a.setUri(this.selectedAuthorUri);
a.setName(this.authMapper.searchNameByAuthorUri(this.selectedAuthorUri));
this.docController.getDocumentBean().addAuthor(a);
}
}
On that same xhtml page there's an inputtext. Everything was working properly, when the inputtext was like this:
Title: <h:inputText id="input"
value="#{insertDocController.docController.documentBean.title}">
</h:inputText>
But stopped working properly since I set the inputtext to be required and added a message to it, like this:
Title: <h:inputText id="input"
value="#{insertDocController.docController.documentBean.title}"
required="true" requiredMessage="Campo Obrigatorio">
<f:ajax execute="#this input" render="message" event="blur"/>
</h:inputText>
<h:message for="input" id="message" style="color:red"/>
After I changed the title inputtext, when I choose an Author on the <h:selectedOneMenu> it simply doesn't call the action method addAuthor() from the <a4j:commandbutton> inside the <h:selectedOneMenu>.
(That's the line with the action method that isn't called - It was extracted from the above code I gave you at first):
<a4j:commandButton type="submit" action="#{insertDocController.removeAutor(author.uri)}"
value="Remover" render="teste" />
If I turn the inputtext as it was before it starts to work again.
What may be the problem? Thank you!
You need to specify the execute attribute.
Delete Author
<a4j:commandButton type="submit" action="#{insertDocController.removeAutor(author.uri)}"
value="Remover" render="teste" execute="#this">
</a4j:commandButton>
For the add author button
<a4j:commandButton type="submit" action="#{insertDocController.addAuthor()}"
value="Inserir" render="teste" execute="#this, chooseAuthor">
</a4j:commandButton>
Hope it helps.
In JSF 1.1, is it possible to use value of inputText as f:parm of an outputLink?
For example:
<h:inputText value="enter Input Value" />
<h:outputLink value="someLink.jsp" styleClass="searchButton">
<f:param name="userName" value="whatever the input value is" />
</h:outputLink>
Not with standard JSF. You'd need to bring in some JavaScript code.
E.g.
<h:form id="formId">
<h:inputText id="inputId" />
<h:outputLink value="someLink.jsp?userName=" onclick="href+=encodeURIComponent(document.getElementById('formId:inputId').value)" />
</h:form>
An alternative is to just use a plain vanilla HTML.
<f:verbatim>
<form action="someLink.jsp">
<input type="text" name="userName" />
<input type="submit" />
</form>
</f:verbatim>
You could if necessary add some CSS to make the button to look like a link.