i am using jsf 2.0 and icefaces 3.0. i have migrated my application from icefaces 1.8 to 3.0 but
i am facing one issue for ice:commandbutton on every jsf page. it needs second click everytime then its sending the response to the broswer, i debugeed the issue by using IE developer tools (F12 in IE) by using network tab. so when i am hitting first time i am getting following repsonse :
<?xml version='1.0' encoding='UTF-8'?>
<partial-response><changes><update id="javax.faces.ViewState"><![CDATA[8640112048343005235:64165239481062360]]></update><extension aceCallbackParam="validationFailed">{"validationFailed":false}</extension></changes></partial-response>
and on second click it working.
following is my button code.
<ice:commandButton value="#{msgs['submit.label']}"
id="submitCmd2" type="submit"
actionListener="#{applicationController.submit}"
rendered="true" styleClass="buttonpurple" onclick="showLoader();"
style="width: 125px; " align="center" />
but i am not able to understand what is the cause and what solution i need to use to solve this problem. also i have gone through balusC links commandButton/commandLink/ajax action/listener method not invoked or input value not updated
Thanks in advance.
Instead of using actionListener try action in ice:commandbutton. There are some differences-between-action-and-actionlistener.
<ice:commandButton value="#{msgs['submit.label']}"
id="submitCmd2" type="submit"
action="#{applicationController.submit}"
rendered="true" styleClass="buttonpurple" onclick="showLoader();"
style="width: 125px; " align="center" />
Also type='submit' is not required, by default it is submit.
You can try the workaround described here
If that doesn't work, you can try ajax with jsf commandbutton, in it's own best way.
<h:commandButton value="#{msgs['submit.label']}"
id="submitCmd2"
actionListener="#{applicationController.submit}"
styleClass="buttonpurple" onclick="showLoader();"
style="width: 125px; " align="center">
<f:ajax execute="id1 id2 id3...." render="#form"/>
</h:commandButton>
Related
Anyone can please help me I am getting a weird issue I have list of records in datatable now i selected a record and click on Edit button now this selected record will be shown to popup window.
Now issue is that if i will edit selected value populated by previous window and press submit button page refreshing but action not invoked,but if i will change those value which not coming from parent Window or empty field in Popup Window then commandButton action Invoked.
Any one please tell me what the issue. What i am missing?
Parent Window is Session Scoped
Pop Window is View Scoped
JSF Version 2.1.13
Richfaces Version 4.3.5.Final
Javax.el 3.0.0
Servlet 2.4
el-api 2.2
el-impl 2.2
Jboss 7.1.0.Final
EDIT:-
PopUpWindow CommandButton Code
<a4j:commandButton
action="#{addFeaturePopUpBean.addFeature(parentBean)}"
value="#{bsmPortalLabel['button.common.submit']}"
image="/resources/images/submit-arrow.png"
render="cfsCreate,createRfs,createReso,notification,search-filter" >
<rich:tooltip id="toolemsSubmit" layout="block" >
<span style="white-space: nowrap">
#{bsmPortalLabel['tooltip.common.submit']}</span>
</rich:tooltip>
</a4j:commandButton>
EDIT1 :-
Exact Cause of the problem if i am using component link this
<h:inputText style="width:142px" id="featureName"
value="#{addFeaturePopUpBean.featuesObj.name}"
immediate="true"
validatorMessage="#{bsmPortalMessage['message.catalog.validation.compositeChar.name']}">
<f:validateRequired />
<f:validateRegex pattern="^[a-zA-Z0-9][a-zA-Z0-9_-]*$"></f:validateRegex>
<f:ajax event="blur" execute="featureName" render="msg1" />
</h:inputText>
<h:message id="msg1" for="featureName" style="color:red" />
Then commandButton invoked but if i will remove <f:ajax event="blur" execute="featureName" render="msg1" /> from the textBox now command not invoked .
But right now i am not able to figure out why this is happening?
How to show some content inside light-box of primefaces as I have to show some information about the image as no. of likes,no. of comments,and also have to provide option to post comments so on and so forth?
On xhtml page I have written this:
<p:lightBox styleClass="imagebox">
<c:forEach var="event1" items="#{event.files}" varStatus="cnt">
<h:outputLink value="#{listOfFilesForEventBean.getImage854By480ProfileUrl(event1)}" title="#{event1.location.locationName}">
<h:graphicImage value="#{listOfFilesForEventBean.getImageIconProfileUrl(event1)}"/>
</h:outputLink>
</c:forEach>
</p:lightBox>
Where files is list of image profiles that I am iterating.
And I want along with the image which is displayed on lightbox some information about the image should be displayed.
I had similar problem. If somebody is still looking for the answer here is my solution.
I did not find easy way to have some additional controls inside p:lightBox item.
Guess it assigns own JavaScript handlers to all its children and that makes a problem.
Also I had the problems with using commandButton inside ui:repeat. So I'm using my own implementation of p:lightBox and p:remoteCommand to call other actions(like post comments, delete image etc). Something like that:
<p:remoteCommand name="deleteImage" update="imagesGrid"
actionListener="#{imageBean.deleteImage}" />
<h:panelGroup id="imagesGrid">
<ui:repeat var="item" value="#{imageBean.list}">
<div class="docThumbContainer">
<div class="docPlaceholder"></div>
<div class="docThumbImage">
<h:outputLink value="/images?id=#{item.imageId}">
<h:graphicImage value="data:image/jpg;base64,#{item.thumbnail}"
alt="" />
</h:outputLink>
</div>
<div class="docThumbButtons">
<p:commandButton type="button" value="Delete"
onclick="deleteImage([{name:'imageId', value:#{item.imageId}}]);" />
</div>
</div>
</ui:repeat>
</h:panelGroup>
ImageBean:
public void deleteImage(ActionEvent event) {
ImageManager manager = getManager();
manager.deleteImage(StringUtil.parseInt(getUrlParameter("imageId"), -1));
}
Of course it is simplified replacement for p:lightBox. To show the full image in the overlay with prev/next buttons you need additional work. E.g. using p:dialog etc
I’m new in JavaServer Faces.
I have a simply form:
<div id="respond" class="comment-respond">
<h3 id="reply-title" class="comment-reply-title">#{msgs.leavereply}</h3>
<h1>#{!forumsBean.activeWithProject}</h1>
<h:form>
<h:inputTextarea value="#{forumpostsBean.text}" style="resize:none"/>
<h:commandButton value="#{msgs.add}" action="#{forumpostsBean.addForumpost}"/>
</h:form>
</div>
By clicking command button all it’s fine, executes method forumpostsBean.addForumpost.
But when I modify code to this:
<div id="respond" class="comment-respond">
<h3 id="reply-title" class="comment-reply-title">#{msgs.leavereply}</h3>
<h1>#{!forumsBean.activeWithProject}</h1>
<h:form>
<h:inputTextarea value="#{forumpostsBean.text}" style="resize:none" disabled="#{not forumsBean.active}"/>
<h:commandButton value="#{msgs.add}" action="#{forumpostsBean.addForumpost}" disabled="#{not forumsBean.active}"/>
</h:form>
</div>
When items not disabled, current page only have refreshed, but method forumpostsBean.addForumpost don’t executes.
In both variants, <h1>#{!forumsBean.activeWithProject}</h1> shows correct value.
You have 2 beans? one called forumpostsBean and another just forumsBean? I can't see if you've got them both but maybe its the main error? as the comment above says, maybe your logic is out of place.
You may want to use rendered="" on the button rather that just disabling it so its not part of the dom at all upon page load and then use an ajax call when you type data in your input field to do partial ajax render the div again and show it. good for testing.
I have the following code inside a registration form. Basically the button calls an action (an Ejb method and an Action listener which is an utility method).
When the user submits the registration form, a primefaces dialog should appear telling the user that registration is being processed. The same dialog disappears once the form is submitted. This can be achieved by Primefaces UIBlock; however, it requires the commandButton to be ajax enabled.
I thought about using : onstart = display some modal dialog & onsuccess or on complete = hide this dialog (<p:dialog widgetVar="dialog" ...) but this solution requires ajax to be enabled for primefaces commandButton.
Any clues on how I could achieve this while setting ajax to false inside a PrimeFaces commandButton?
Thanks
<h:form id="form_register">
<p:panel id="panel_register">
<div align="center" style="padding: 5px;">
<p:commandButton id="register" ajax="true"
actionListener="#{mailBean.deliverEmail(newMember.email,newMember.name, newMember.username, newMember.password, newMember.isadmin)}"
action="#{memberController.register}" value="Register"
label="Register">
<f:setPropertyActionListener target="#{requestScope.wait}"
value="#{true}" />
</p:commandButton>
</div>
<p:blockUI block="panel_register" trigger="register">
<h:outputText value="Please wait..." />
<br />
<p:graphicImage value="#{resource['gfx/gif.gif']}" />
</p:blockUI>
EDIT: Thanks guys. I was mis-using the update the attribute in commandButton. Now things work fine.
You should use the onstart and oncomplete actions to display/hide the dialog.
<p:commandButton id="register" onstart="dlg.show()" oncomplete="dlg.hide()" />
I have this module in my webapp where i need to update come catalogs.
The idea is to disable the h:commandButton and show a h:graphicImage, both actions are supposed to happen right after the button was clicked.
Finally, when the update process has ended it should do the other way, hide the h:graphicImage, enable the h:commandButton but this time also show a label h:outputText that says either 'Update Success' or 'Update Failure'.
The problem in my code is that the image and the label appear right after the process is finished and I can't find the way to do what I described above.
Where or what am I missing?,
Cheers.
<a4j:commandButton id="btnActualiza" value="Actualizar catálogos"
render="messageCatalogos actualizacionCorrecta
#this imgProcesando"
onclick="this.disabled=true;"
oncomplete="this.disabled=false"
actionListener="#{administrationBean.doImgProcesandoVisible}"
action="#{administrationBean.doActualizaCatalogos}"/>
<a4j:outputPanel id="imgProcesando">
<h:graphicImage rendered="#{administrationBean.imgProcesandoRendered}"
url="img/imgLoading.gif"/>
</a4j:outputPanel>
<h:panelGroup/>
<h:panelGroup/>
<a4j:outputPanel id="actualizacionCorrecta" style="font-size: 14px; color: #D17100">
<h:outputText rendered="#{administrationBean.actualizacionCorrectaLabelRendered}"
value="Actualización correcta !"/>
<h:outputText rendered="#{administrationBean.actualizacionFalloLabelRendered}"
value="Fallo la actualización !"/>
</a4j:outputPanel>
UPDATE
My dev environment:
Mojarra 2.1.6
RichFaces 4.1.0.Final
Tomcat 7.0.14(test) / Tomcat 7.0.22(prod)
You need to show and hide the image by JS instead.
<h:graphicImage id="loading" url="img/imgLoading.gif" style="display:none" />
with
<a4j:commandButton ...
onbegin="this.disabled=true; $('#formId\\:loading').show()"
oncomplete="this.disabled=false; $('#formId\\:loading').hide()"
/>