RichFaces a4j:commandButton. first click does not work the action, it works in the secon click - jsf

I have a problem that a I couldn't solve. When I click first time on a a4j:commandButton there is not action. The second and following time it works perfectly. I have read about this problem however I have not clear the solucion.
I am new, and I have find this solucion: (h:commandButton/h:commandLink does not work on first click, works only on second click) however I do not know where should I introduce the script code.
I have found this: however I think is an old jsf version:
(https://community.jboss.org/thread/165031)
And I have tried to repare it with: https://community.jboss.org/wiki/ProgrammaticControlOfPartialProcessingInRichFaces4. However, I have not been success
If someone could explain me the #BalusC solution step by step, it could be really hepful
Thanks very much:
My code is: (everything in the same file)
<ui:define name="table">
<h:form id= "formListCompanies">
<a4j:outputPanel id="tablePaneRegion">
<rich:extendedDataTable ....
<rich:column sortable="false" width="100%">
...
<a4j:commandLink id="editCmd" styleClass="no-decor" render="editGrid, editPane"
execute="#this" oncomplete="#{rich:component('editPane')}.show()">
<a4j:param value="#{it.index}" assignTo="#{myBean.currentIndex}" />
<f:setPropertyActionListener target="#{myBean.selected}" value="#{mypojo}" />
</a4j:commandLink>
....</rich:column>
....
<rich:popupPanel id="editPane" header="#{...}" domElementAttachment="body"
moveable="true" modal="true" resizeable="false" autosized="true"
onshow="focus(#{rich:component('name')});">
....
<!-- h:Inputtext ..-->
<h:panelGrid columns="2">
<a4j:commandButton value="#{'save'}" action="#{myBean.edit}"
render="dataTable" execute="editPaneRegion" />
<a4j:commandButton value="#{...}"
onclick="#{rich:component('editPane')}.hide(); return false;" />
</h:panelGrid>
</h:form>
</a4j:outputPanel>
</rich:popupPanel>
What I have already tried is to take out the h:form id= formListCompanies, and put there a h:panelgrid and a h:panelgroup
Is the problem related to the doble clicking issue? Am i in the right way?

rerender panel and form (form state lost error in jsf spec)... render="richPanelMantenimientoTipoVisualAjaxWebPart,frmMantenimientoTipoVisual"

Related

How to show a loading image (using a4j)?

The following code in my .xhtml works fine:
<h:commandButton id="btnConsultar"
action="#cadastrarProponenteBean.consultarCnpj}"
value="#{messages.tx_consultar}"
styleClass="btnAcao" />
But, when I add a4j:support:
<h:commandButton id="btnConsultar"
action="#{cadastrarProponenteBean.consultarCnpj}"
value="#{messages.tx_consultar}"
styleClass="btnAcao">
<a4j:support event="onclick" />
</h:commandButton>
the application breaks, I get strange errors, and my validation messages('getFacesContext().addMessage') are not shown.
Since I'm using a4j:support just to show a loading gif when user clicks, any advice on how to fix this problem?
I'm using JSF and RichFaces.
PS: already tried a4j:commandButton instead of h:commandButton but same problems...
You should use <a4j:status> similar to:
<a4j:status id="ajaxstatus" rendered="true">
<f:facet name="start">
<h:panelGroup>
<h:graphicImage value="/images/loading.gif" />
</h:panelGroup>
</f:facet>
<f:facet name="stop">
</f:facet>
</a4j:status>
I have it in template. Loading image is displayed during any long action.

Render rich:extendedDataTable

I need a rich:popup that shows a rich:extendedDataTable, and when the user presses a button, the popup should be shown, and the extendedDataTable must be re-rendered, here is the code:
<rich:popupPanel id="popupId" show="false" modal="true">
<h:form>
<rich:extendedDataTable
value="#{bean.list}"
var="item" rows="5" id="table">
<rich:column>
<h:outputLabel value="#{item}" />
</rich:column>
</rich:extendedDataTable>
<a4j:commandButton value="x" immediate="true"
oncomplete="#{rich:component('popupId')}.hide(); return false;"/>
</h:form>
</rich:popupPanel>
<h:form>
<a4j:commandButton value="show"
oncomplete="#{rich:component('popupId')}.show(); return false;"
render="table" immediate="true" />
</h:form>
The first time I press the show it works fine, but when I close the panel with the X button and press again the show button, the extendedDataTable appears empty (It's rendered but appear empty, see image below).
The problem is fixed if I add an empty extendedDataTable before the popup, like this:
<rich:extendedDataTable />
<rich:popupPanel>
...
With rich:dataTable the problem doesn't exits, but I need a extendedDataTable.
And aditional extrange behaviour is when I resize the browser, the data appears.
Platform
RichFaces: 4.2.2.Final
Spring: 3.1.1.RELEASE
Cheers
Use onclick instead of oncomplete. ExtendedDataTable doesn't render properly inside invisible elements (it's a bug) so the popupPanel has to be made visible before the rerendering.
I had kinda the same issue.
I solved it in a not 100% richface correct way:
<a4j:commandButton
value="show"
action="#{actionForm.setShowEditor('true')}"
oncomplete="javascript:location.reload(true)"/>
<a4j:region layout="block" rendered="#{actionForm.showEditor}" id="panelArea">
<rich:popupPanel id="#{popupID}" modal="true" show="true" domElementAttachment="parent">
....
tabel
buttons
....
</rich:popupPanel>
</a4j:region>
The popup is always shown (show="true") inside the a4j:region.
But the a4j:region is only shown if variable to show the popup = true.
The full page refresh was in my case needed because otherwise my ckeditor had some initialisation errors. It should also work if you only rerender the a4j:region after you set the "#{actionForm.setShowEditor('true')}.

How to know in JSF 1.2 and richfaches the id from h:column in a h:datatable

I have a datatable from which I open with a click on an image the <rich:modalPanel>. But the <rich:componentControl for="panel" attachTo="showPreview" must have the exact id, in my case below: showPreview, but as my link is inside a dataTable, it will be generated like 1:showPreview 2:showPreview.....n:showPreview
Is there any way to know in which line of the table i am, to get a dynamic binding?
My XHTML in JSF 1.2 looks something like this:
<h:dataTable styleClass="tb_tabletag" id="dtContentPosts" value="#{listOfObjects}" var="object">
<h:column id="columnnumber" >
<h:outputLink id="showPreview" value="#">
<h:graphicImage value="preview.png" />
<rich:componentControl for="panel" attachTo="showPreview" operation="show"
event="onclick"/>
</h:outputLink>
</h:column>
</h:dataTable>
...
...
...
<rich:modalPanel id="panel" autosized="true">
some stuff
</rich:modalPanel>
Thank you for any help!
Thanks Luiggi for your link, with the given source code,this helped me to find my simple trick:
i get now the number with: #{listOfObjects.indexOf(object)}
the only important thing is, that the modalPanel is in a <h:column></h:column> to receive the correct number
works perfect

Cannot find component with identifier in view

I have a problem are that when I try update a component that not are in same xhtml.
Somebody know how to do?
thx
PD: im using primefaces 3.2
Sorry for my english
I think that I dnot explain very well.
I have a xhtml father with tis structure:
<h:panelGrid id="tabla">
<h:form id="formTripu" prependId="false">
<h:panelGrid id="fichaTripulante">
<ui:include src="path1" />
<p:spacer height="5px" />
<p:tabView dynamic="false" cache="true">
<p:tab title="#{bundleTrip.datosAdministrativos}">
<ui:include
src="path2" />
</p:tab>
<p:tab title="Datos Operativos ">
<ui:include
src="path3" />
</p:tab>
I wish to do are when for example in path1 I use a h:selectBooleanCheckbox like:
<h:selectBooleanCheckbox inmediate="true" id="checkExt"
value="#{bean.Obj.field}">
<f:ajax render="estadoTripu"
actionListener="#{bean.method}" />
</h:selectBooleanCheckbox>
estadoTripu are in path2 (otherxthml but in same form).
<p:panel>
<h:panelGrid id="datos" columns="5">
<p:column>
<h:selectOneMenu id="estadoTripu"
value="#{bean.Obj.Field2}">
<f:selectItems
value="#{bean.list}" var="item"
itemValue="#{item.id}" immediate="true"
itemLabel="#{item.desc}">
</f:selectItems>
</h:selectOneMenu>
</h:panelGrid>
</p:column>
</h:panelGrid>
</p:panel>
Witch is paht in render o f:ajax????
thx everyone
try this: (Its a trick I learned from BalusC :) )
add binding="#{components.mySelecOneMenu}" to your h:selectOneMenu
<h:selectOneMenu binding="#{components.mySelecOneMenu}" .....
This how you button should look like (more or less)
<h:commandButton value="doSomeThing">
<f:ajax render="#{components.mySelecOneMenu.clientId}"/>
</<h:commandButton>
add this to your faces-config.xml
<managed-bean>
<description>Holder of all component bindings.</description>
<managed-bean-name>components</managed-bean-name>
<managed-bean-class>java.util.HashMap</managed-bean-class>
<managed-bean-scope>request</managed-bean-scope>
</managed-bean>
Here some detailed explanation of what I just recommend you to do
How do I break the tyranny of the clientID?
JSF component binding without bean property
if they are not in the same xhtml, do you include one in the other? If not, just change page and it will show the correct one.
But I don't think I correctly understand your question.
Add some code please
I find that component should be in same form an call ids start in form to component, its prefered put id every panelgrid, panel, etc because you have to call every component englobe comoponent that you want render.

Command buttons invokes actions on second push (jsf)

I came to strange behaviour of my application. Command buttons start to invoke actions on second hit. On first - nothing happens. It takes effect on firefox and chromium, but in epiphany works as usual.
My environment:
- ubuntu 11.04
- glassfish 3.1.1
- jsf 2.X
- primefaces 3.2
- firefox 12.0
- epiphany 2.30.6
Code example:
<ui:define name="content">
<h:form id="form">
<h:panelGrid id="panelGrid" columns="3">
<h:outputText value="#{msg.fieUserName}:"/>
<h:inputText id="name" value="#{userBb.editedUser.username}" />
<h:message for="name" styleClass="error_msg"/>
<h:outputText value="#{msg.fieUserDescription}:"/>
<h:inputText id="description" value="#{userBb.editedUser.description}" />
<h:message for="description" styleClass="error_msg"/>
<h:outputText value="#{msg.fieUserPassword}:"/>
<h:inputSecret id="password" value="#{userBb.editedUser.password}" redisplay="true"/>
<h:message for="password" styleClass="error_msg"/>
<h:outputText value="#{msg.fieUserRights}:"/>
<p:selectOneMenu id= "rights"
value= "#{userBb.editedUserGroup}"
converter="#{pGroupOfUsersConverter}">
<f:selectItems
value ="#{groupDao.findAll()}"
var ="row"
itemLabel="#{groupDao.rightsDescription(row.id)}"
itemValue="#{row.groupname}"
>
</f:selectItems>
</p:selectOneMenu>
<h:message for="rights" styleClass="error_msg"/>
<h:outputText value="#{msg.fiePorofolioName}:" rendered="#{userBb.chosenNew}"/>
<h:inputText id="portName" value="#{userBb.portfelForNewUser.nazwa}" rendered="#{userBb.chosenNew}">
<f:validateBean disabled="true" />
</h:inputText>
<h:message for="portName" styleClass="error_msg" rendered="#{userBb.chosenNew}"/>
<h:outputText value="#{msg.fiePotofolioCurrency}:" rendered="#{userBb.chosenNew}"/>
<p:selectOneMenu id= "waldep"
value= "#{userBb.portfelForNewUser.walutaDepozytowa}"
converter="#{igConverter}"
rendered= "#{userBb.chosenNew}"
>
<f:selectItems value= "#{igDao.waluty}"
var= "row"
itemLabel="#{row.nazwa}"/>
</p:selectOneMenu>
<h:message for="waldep" styleClass="error_msg" rendered="#{userBb.chosenNew}"/>
</h:panelGrid>
<h:panelGrid columns="2">
<h:commandButton value="#{msg.butCreate}" action="#{userBb.formCreate()}" rendered="#{userBb.chosenNew}" />
<h:commandButton value="#{msg.butSave}" action="#{userBb.formEdit()}" rendered="#{!userBb.chosenNew}"/>
<h:commandButton value="#{msg.butBack}" action="#{userBb.formBack()}"/>
</h:panelGrid>
</h:form>
</ui:define>
In this example method userBb.formCreate() is invoked only on second click on command button although button is visible. When fields are not properly filled up than appropriate messages appear next to them, but... only on second click! Any advice?
I check out points from: this advice, but not found solution.
Ok, I found what was wrong. So:
Appearance of the problem:
I've got a page for user data. Some input items and command buttons. When clicking "Create" button, input data is checked out. If data is ok user is created and table of users appears, or when there are errors - errors messages appear and user stays on the same page:
I found some erratic behavior. Nothing has happened on first click (action), only second and subsequent actions have an effect. But. This behavior was related to kind of web browser I use.
All actions takes place from the first click, in webrowsers: epiphany and konqueror. Although in firefox and chromium I observed this erratic behavior which I described above. Code for a command button was:
<h:commandButton value="#{msg.butCreate}" action="#{userBb.formCreate()}" rendered="#{userBb.chosenNew}"/>
Different behaviors in different webbrowsers.
The cause.
The cause was enumerated by #Balusc in his note, which I read roughly first time. It was indeed pt. 7.
The solution.
I've tried to change button declaration this way:
<h:commandButton value="#{msg.butCreate}" action="#{userBb.formCreate()}" rendered="#{userBb.chosenNew}">
<f:ajax render="userForm"/>
</h:commandButton>
where userForm was proper id of h:form. No result, still only second and subsequent clicks has an effect - shows error messages.
So I changed declaration command button from previous page, that invoked erratic behavior page. Originally it was:
<p:commandButton value="#{msg.butNew}" action="#{userBb.actionNew()}"/>
primefaces command button. And that was it, as Balusc wrote: "If a parent of the with the UICommand button is been rendered/updated by an ajax request beforehand, then the first action will always fail."
So I changed declaration to:
<p:commandButton value="#{msg.butNew}" action="#{userBb.actionNew()}" ajax="false"/>
And that's it. It works fine in any browser, for the first action.

Resources