Logout Link is not working - jsf-2

I am using JSF and Primefaces in my web application.
In this i am using one form which includes some some details to be filled by student.
So there is some validation on that fields
And, On this page there are two button one is Submit and Other is Logout
When I pressed submit button form is displaying validation error if details are not completed.
But Same things also shown while pressing LOGOUT link also
Logout is p:commadLink
<p:commandLink styleClass="logout" type="submit" action="#{userManagedBean.logout}">
<p:graphicImage value="/images/logout.png"></p:graphicImage>
</p:commandLink>
Submit is h:commandButton
<h:commandButton image="/images/submit_button.png" type="submit" action="#{referManagedBean.saveDetails}" value="submit"></h:commandButton>
I need Logout link skip this validation step and directly goes to managed bean called function.
How can i skip Validation Step ??

Since the log-out action seems that has nothing to do with the details form (being validated), you could just move the button to different form (h:form) so it wouldn't trigger the details form validation anyway.

I solved my problem i used immediate="true" by which it skips the validation phase.
<p:commandLink styleClass="logout" type="submit" immediate="true" action="#{userManagedBean.logout}">
<p:graphicImage value="/images/logout.png"></p:graphicImage>
</p:commandLink>

Related

JSF Validation error not printed in open dialog

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.

Using forms on multiple tabs to edit a single entity

In my application I have implemented a page where the user can edit its account information. Since there are a lot of fields I have broken them up into p:tab elements inside a p:tabView. Like this:
<p:tabView dynamic="true" rendered="#{account.accessOK}">
<p:tab title="Basic Information">
<h:form id="formBasic">
(some fields here)
<p:commandButton value="Save"
action="#{account.doSave()}"
update="formBasic msgs"
/>
</h:form>
</p:tab>
<p:tab title="Address">
<h:form id="formAddress">
(fields related to address here)
<p:commandButton value="Save"
action="#{account.doSave()}"
update="formBasic msgs"
/>
</h:form>
</p:tab>
<p:tab title="E-Mail & Phone Numbers">
(then another form here with more field)
</p:tab>
<p:tab title="Password">
<h:form id="formPass">
<p:panelGrid columns="3">
(and this form handles the password)
<p:commandButton value="Change"
action="#{account.doPassword()}"
update="msgs"
/>
</h:form>
</p:tab>
</p:tabView>
This seems pretty straightforward but there is a problem. Each tab has its own form so that the fields that gets processed when the user hits the p:commandButton are only those in the form. However the following sequence will probably confuse the user:
Change some fields on one tab but do not click the Save button.
Go to another tab and fill in fields there, then click the Save button. The fields on that form will be processed.
Go back to the tab edited in step 1 above and the fields will look like they have been processed, but have not. It will be a filled out form but no visual way to tell that the fields have not been saved.
Note that I do not want to put all the tabs into one form and execute all the fields on all the tabs at once. This is because some field changes might have side effects, such as setting the password. Also you don't want a validation pass to happen on fields that the user isn't changing during this visit.
So is there any method to solve this user interface deficiency?

JSF2 Dynamic form is not being submitted

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.

Immediate="true" causes update="component" to fail

I have a command button (a Cancel button to be specific) that I want to bypass the validation of some components on my page. When I have immediate="true" set on my command button, the update attribute does not work. By "not work" I mean that the values on :centerForm:p_definition do not reset to what they should be. If I select an item from a dropdown or enter data into an input text, the information should disappear when clicking cancel. Setting immediate="false" or leaving it off completely does reset the fields as expected. Here is the definition of the commandbutton I am having trouble with.
<p:commandButton value="Cancel" style="float: right;"
immediate="true"
actionListener="#{manageBomPropHandler.doCancel()}"
update=":centerForm:p_definition"/>
Is that the expected behavior from immediate="true"? If so, how have you gotten around this for cancel buttons?
"Update" will be called/executed at Update Model Value phase. When you set "immediate" attribute to button command, this phase is ignored.See below images for more detail.
P1: Standard Lifecycle executes Update Model Values phase
P2: Immediate Lifecycle ignored Update Model Values phase
If may help, there's a already solution for clean input fields with primefaces:
<p:commandButton value="Reset Tag" update="panel" process="#this" style="margin-right:20px;" >
<p:resetInput target="panel" />
</p:commandButton>
OR
<h:commandButton value="Reset p:ajax" style="margin-right:20px;" >
<p:ajax update="panel" resetValues="true" />
</h:commandButton>
Source: http://www.primefaces.org/showcase/ui/misc/resetInput.xhtml
In my case, in order to update the fields, I have attached p:ajax against the required component.
That ensured that corresponding fields/variable in backing bean is updated as soon as user makes changes in any of those fields.
Another requirement I had is to refresh a data table after user clicks a immediate - true command button.
In order to do that, I have used code like:
RequestContext.getCurrentInstance().reset("Datatable ID");
Yup, displaying my ignorance of the JSF lifecycle. Found the answer here: JSF commandButton with immediate="true" and here: https://cwiki.apache.org/confluence/display/MYFACES/Clear+Input+Components

p:commandlink inside ui:repeat

In our application we are displaying the menus dynamically. We have the menu object(menuitems in below code) populated with all the menu items (read from an xml). The home page then generates the menus by usinng ui:repeat. Insdie ui:repeat there are p:commandlink.
Below is the code
<h:form id="mainMenu">
<h:panelGroup id="MMPanel" layout="block" styleClass="left_menu">
<ui:repeat var="node" value="#{menuitems.level1menus}">
<p:commandLink immediate="true" styleClass="menu"
action="#{menuitems.onLevel1MenuChange(node.id)}"
update=":pageTitle :menuLevel2 :menuLevel3" title="#{node.name}"
rendered="#{menuitems.selectedLevel1.id!=node.id}" onclick="menuSelect(this)">
<span class="icon icon_#{node.name}"></span>
<span class="text">#{node.name}</span>
</p:commandLink>
<p:commandLink immediate="true" styleClass="menu activelink"
action="#{menuitems.onLevel1MenuChange(node.id)}"
update=":pageTitle :menuLevel2 :menuLevel3" title="#{node.name}"
rendered="#{menuitems.selectedLevel1.id==node.id}" onclick="menuSelect(this)">
<span class="icon icon_#{node.name}"></span>
<span class="text">#{node.name}</span>
</p:commandLink>
</ui:repeat>
</h:panelGroup>
</h:form>
The menuitems bean is at Session level.
There are two diffeent p:commandlink inside ui:repeat. The only difference between the 2 is in the styleclass and rendered attribute. This is done to identify the default menu item when the user logs for the first time and give it an extra css of "activeLink".
The java script called on onclick is given below (in case it is required)
function menuSelect(selectOne){
$(".left_menu>a").removeClass("activelink");
$(selectOne).addClass("activelink");
removeAllChannels();
}
function removeAllChannels(){
$.atmosphere.unsubscribe();
}
The removeAllChannels is to remove primepush autorefresh channels we have.
The issue i am facing is this.
All the links are getting rendered correctly and in Firebug i see all of them have the same html.
But the one which is generated with the extra css "activeLink" (through rendered condition -- menuitems.selectedLevel1.id==node.id) is not working. Nothing happens when i click this default link. All other links work fine.
So when i click on a different link, it takes me to the required page. But when i click back on the menu which was default, nothing happens
I added a Custom phase listener and saw that all the lifecyle stages are called when this link is clicked but the action method is not.
I went through the links this and this but could not figure out the issue.
Please help.
Do tell me if something is not clear
As part of safeguard against tampered/hacked requests, the JSF component's rendered attribute is re-evaluated during processing the form submit. In case of a command link/button, if it evaluates false, then its action won't be queued/invoked. This matches the symptoms you're seeing.
This can in turn happen if the managed bean #{menuitems} is request scoped and/or when the properties behind #{menuitems.level1menus} or #{menuitems.selectedLevel1} are incompatibly changed during the postback request.
Putting the bean in the view scope and ensuring that the getters do not do any business job should fix this problem.
See also:
How to choose the right bean scope?
commandButton/commandLink/ajax action/listener method not invoked or input value not updated - point 5 applies to you

Resources