I have a form that is defined in a separate jsf page. This is is included to the main page when i click a link. Now the form is being displayed correctly. But the problem is that the submit button is not calling the action function defined.
The code to include the page( As suggested in this question: JSF2 Dynamically loading pages by ajax
<h:panelGroup id="editdivparent" layout="block">
<h:panelGroup id="editdiv" rendered="#{formsBean.edituserdiv}" layout="block">
<h:form id="userform" class="form-horizontal">
<ui:include src="edituserdetails.xhtml">
</ui:include>
</h:form>
</h:panelGroup>
</h:panelGroup>
The included page contains just the form elements with submit button:
<h:commandButton action="#{userBean.register() }" value="Update">
</h:commandButton>
I am getting no errors. On submitting the form the current page is redisplayed. I have put some print statements in the action function. Also there is a query error is put. None of them are being generated.
Am i doing something wrong here?
The commandButton action property already expects a method expression, so just take the parenthesis out, like this:
<h:commandButton action="#{userBean.register}" value="Update" />
Also, make sure you don't have nested forms when making templates with includes.
I hope it helps.
Related
I have to validate that a field in a form is not empty.
The problem is that the form is in a JQueryUI dialog (since I don't know how to create "windows" in JSF), so when I click the commandButton the page is refreshed and the JQuery dialog is lost. After refreshing, I can see the error message was printed in the page code by looking at the source code. If I use ajax in the commandButton then the page is not refreshed but I don't get the message printed, I got it as a sort of "Javascript alert" in the browser.
How can I get the error message without refreshing the page?
<h:inputText value="#{myController.name}" id="myname" required="true" requiredMessage="Name required">
<f:ajax />
</h:inputText>
<h:message errorClass="..." for="myname" />
Note: This looked similar to my problem but I don't think the solution is what I'm looking for.
Note: I am not using additional libraries like Primefaces, etc
With the hint of the comment, I was able to solve it this way:
In the commandButton, use ajax with both render and execute (render only doesn't work):
<h:commandButton id="...." action="#{myController.doSomething()}" type="submit" value="Do something">
<f:ajax execute="#form" render="#form" />
</h:commandButton>
Create a "pageUpdate()" method in myController that is called at the end of myController.doSomething(). This way, after the actions, the page is refreshed and the dialog is gone. There are of course other ways to close the dialog, but it is convenient for me to update the page when there is no error in the dialog action, so my objects in memory are updated too.
I think JQuery dialog messes with my styles after the ajax call returns with error, so check that out if you do it.
I have an application up and running. I have a page addstudent.xhtml page where the user adds the student details.When user finishes adding and submits he will be redirected displaystudent.xhtml page.
My question is when user directly types on browser
localHost:8081/Student/displaystudent.xhtml. Page is displayed with blank values.This should not happen. How do I prevent this even though he types on browser.
Both the files addstudent.xhtml displaystudent.xhtml pages are in web-inf folder. I am using Jsf2, primefaces 3.5
Make displaystudent.xhtml an include file which you render conditionally in addstudent.xhtml depending on whether the student is successfully added.
E.g., assuming standard JSF:
<h:panelGroup id="addStudent" layout="block">
<h:form rendered="#{empty bean.student.id}">
<h2>Add student</h2>
<h:inputText value="#{bean.student.name}" />
...
<h:commandButton value="Add" action="#{bean.add}">
<f:ajax execute="#form" render=":addStudent" />
</h:commandButton>
</h:form>
<h:panelGroup layout="block" rendered="#{not empty bean.student.id}">
<h2>Added student</h2>
<dl>
<dt>Student name</dt><dd>#{bean.student.name}</dd>
</dl>
</h:panelGroup>
</h:panelGroup>
(simplified; you could of course split off the add student to <ui:include src="/WEB-INF/displaystudent.xhtml"> and so on)
The button, whereby the add() method should return void or null, re-renders the <h:panelGroup id="addStudent">. If the student was successfully been added in the DB, then it should have a non-empty ID. This will cause the form to be hidden and the results panel to be shown.
See also:
Conditionally displaying JSF components
How to navigate in JSF? How to make URL reflect current page (and not previous one)
I am working on an enhancement project. There is a parent <form> element. I have an XHTML file included inside this parent form. The included XHTML file has an <a4j:commandLink>. This action is not getting called.
Now, this will work if i wrap the <a4j:commandLink> inside an <h:form>. This way, the parent form's action is called as well as the <a4j:commandLink>'s action. But nesting forms is not encouraged.
I can't use the parent form's action because it goes to a servlet and my action is in a
request scoped bean. I cant access the bean in the servlet.
Any help on how to make the action call without the <h:form> is highly appreciated.
Here is how it looks like:
<form id="parentFormId" name="parentFormId" action="aservletaction">
<a4j:outputPanel id="includedRegion">
<ui:include src="setupView.xhtml"></ui:include>
</a4j:outputPanel>
</form>
Contents of setupView.xhtml:
<ui:composition>
<a4j:outputPanel>
<h:form>
<a4j:commandLink action="#{myBean.actionMethod}"
render="adatatableid" limitRender="true"/>
</h:form>
</ui:composition>
RichFaces components have to be inside a form otherwise they won't work (at least the executable ones).
Now, <a4j:commandLink> (and commandButton) executing the whole form is the default behaviour, to change it use the execute attribute:
<a4j:commandLink execute="#this" … >
This will limit the execution only to the link.
It ought not work. Do not nest forms, as its not legal in HTML in general and in HTML code rendered by JSF in particular. So, you've got a following construct in your code:
<form>
...
<h:form>
...
</h:form>
...
</form>
Get rid if it and it'll work as expected, i.e. by creating a plain form-to-form structure.
This is an update on a previous post I made regarding conditional rendering of page components. I can now conditionally render different components on the page based on selected user inputs using the f:ajax tag. The trouble is that when I click my commandbutton the inputs that are conditionally rendered using ajax aren't being read on submit. I am guessing it is because the whole page isn't rerendered when I add in the new components and the submit button can't see them, even though they are there. Here is the segment of my form page(it is wrapped in a h:form tag):
<h:outputLabel for="selectPersonType" value="Select Type: "/>
<h:selectOneMenu id="selectPersonType" value="#{addPersonBean.personType}" label="Person Type" required="true">
<f:selectItem itemValue=""/>
<f:selectItems value="#{listBean.personTypes}" />
<f:ajax render="results"/>
</h:selectOneMenu>
<h:message for="selectPersonType" style="color: red"/>
</h:panelGrid>
<h:panelGroup id="results">
<h:panelGroup rendered="#{addPersonBean.personType == 'STUDENT'}">
<h:outputLabel for="selectSchoolType" value="School Type: " />
<h:selectOneMenu id="selectSchoolType" value="#{addPersonBean.schoolType}">
<f:selectItems value="#{listBean.schoolTypes}" />
<f:ajax execute="selectSchoolType"/>
</h:selectOneMenu>
</h:panelGroup>
<h:panelGroup rendered="#{addPersonBean.personType == 'PATIENT'}">
<h:outputLabel for="smoker" value="Smoker? " />
<h:selectBooleanCheckbox id="smoker" value="#{addPersonBean.smoker}">
<f:ajax execute="smoker"/>
</h:selectBooleanCheckbox>
</h:panelGroup>
</h:panelGroup>
<h:commandButton value="Add Person" action="#{addPersonBean.action}"/>
The trouble here is that the components with ids 'selectSchoolType' and 'smoker's values don't get set when I click the commandButton because they are rendered conditionally using the selectPersonType select menu after the page has loaded. Is there a way to fire the components when their values change instead of when I click the submit button (therefore, their values should be processed before I even click submit). As you can see I have tried to use f:ajax with the execute attribute attached to the components in question but it didn't seem to work. (I believe the default events for these components are valueChange so haven't added them to the f:ajax tags, but I have tried 'change' and 'valueChange').
All your <f:ajax> things are inside a conditionally rendered component. This construct will fail when the condition behind rendered attribute evaluates to false during processing the form submit. This will happen when the #{addPersonBean} is in the request scope and doesn't preinitialize the condition behind the rendered attribute during (post)construction, or when it's performing business logic in getters/setters in a wrong way.
Placing the #{addPersonBean} in the view scope and ensuring that you aren't doing business logic in getters/setters should fix this problem.
See also:
commandButton/commandLink/ajax action/listener method not invoked or input value not updated - point 5 applies to you
How to choose the right bean scope?
I have the following two pages below.
hello.xhtml, rendered by .../hello.jsf url.
<h:form>
<h:commandButton id="submit" value="Submit" action="response"/>
</h:form>
response.xhtml, rendered by .../response.jsf url.
<h:form>
<h:commandButton id="back" value="Back" action="hello"/>
</h:form>
When Submit button is clicked, the hello page is redirected to the response page but the url remains the same, i.e., the url is still .../hello.jsf.
I'd like the url to be .../response.jsf after the Submit button is clicked. Any help, please?
Many thanks!
If you are actually not using old fashioned JSF navigation cases as implied by kolossus, but are instead using new JSF2 implicit navigation feature, then just add faces-redirect=true query string parameter to the outcome.
<h:form>
<h:commandButton id="submit" value="Submit" action="response?faces-redirect=true" />
</h:form>
However, if you don't need to invoke any bean action at all, and intend to use plain page-to-page navigation, then it makes no sense to perform a POST request for this. Just use the <h:button> then.
<h:button id="submit" value="Submit" outcome="response" />
See also:
Difference between h:button and h:commandButton
When should I use h:outputLink instead of h:commandLink?
Add the redirect attribute to your faces_config.xml file like so:
<navigation-rule>
<from-view-id>/hello.xhtml</from-view-id>
<navigation-case>
<from-outcome>response</from-outcome>
<to-view-id>/response.xhtml</to-view-id>
<!--the redirect element -->
<redirect/>
</navigation-case>
</navigation-rule>
EDIT: I got the impression that you're using a faces-config.xml from your navigation outcome styling. I have confirmed personally that what you're doing is also permissible for the new JSF 2 style navigation. See BalusC's answer for using the redirect url parameter in a JSF2-style navigation handling