I'm working with Primefaces 5.1 and would like a help in component
How I can update the FacesMessages in my page when the user performed one click in the icon from the dropdown in autocomplete( this when the autocomplete is empty)
I've tried many ways but I can not do FacesMessage be updated, that event or how I should conduct is action?
<p:autoComplete id="stepDescriptionDropDownId"
dropdown="true"
value="#{Step.stepSearch.selectedStep}"
converter="basedEntityConverter"
var="stepSearch"
itemValue="#{stepSearch}"
itemLabel="#{stepSearch.description}"
completeMethod="#{Step.doCompleteStepSearchDescription}"
panelStyleClass="autoCompletePanelBorderNone"
immediate="true"
size="30">
<p:column>
<h:outputText value="#{stepSearch.id.stepCode}" />
</p:column>
<p:column>
<h:outputText value="#{stepSearch.description}" />
</p:column>
<p:ajax event="itemSelect" process="#form" update="inputTextStepCodeId, :facesMessagesId" listener="#{Step.doValidateSteps}" />
</p:autoComplete>
In short, how can I call a method when the User clicks on the icon?
Related
Primefaces Migration-Guide 5.3 to 6.0:
ContextMenu: p:contextMenu must be placed AFTER the target component (e.g. datatable) in the xhtml now.
I tried exactly that, but it' not working. No Menu at all.
Placing ContextMenu before dataTable: Menu is showing. Additional output on browser console:
ContextMenu targets a widget which is not available yet. Please place the contextMenu after the target component. targetWidgetVar: widget_base_cars
My Webshpere Liberty log:
...org.primefaces.webapp.PostConstructApplicationEventListener I Running on PrimeFaces 7.0
Java:
java.version = 1.8.0_102
Stripped down to primefaces showcase
<h:body>
<h1>Context Menu</h1>
<h2>ContextMenu: p:contextMenu must be placed AFTER the target component</h2>
<h:form id="base" >
<p:dataTable id="cars" var="car" value="#{dtContextMenuView.cars}" rowKey="#{car.id}" >
<f:facet name="header">
List with #{dtContextMenuView.numberOfCars} Items
</f:facet>
<p:column headerText="Id">
<h:outputText value="#{car.id}" />
</p:column>
<p:column headerText="Year">
<h:outputText value="#{car.year}" />
</p:column>
<p:column headerText="Brand">
<h:outputText value="#{car.brand}" />
</p:column>
<p:column headerText="Color">
<h:outputText value="#{car.color}" />
</p:column>
</p:dataTable>
<p:contextMenu for="cars" >
<p:menuitem value="Hello" />
<p:menuitem value="World" />
</p:contextMenu>
<h2>but it fails</h2>
</h:form>
</h:body>
I expect the menu to show on right click.
Is it a bug, or am i the bug?
I reproduced this testing around with PF 5.3/6.0/7.0. I'm with you as long as your p:dataTable is not selectable:
The p:contextMenu appears on rightclick when added above the p:dataTable element in xhtml. When added below, no context menu appears at all. But tbh.: is a context menu useful on a datatable which does not allow selection?
When making it selectable by adding the attributes
selection="#{myBean.selectedValue}" selectionMode="singel"
it behaves like this:
p:contextMenu below p:dataTable as suggested by migration guide: On rightclick, the clicked row is selected and context menu appears on it.
p:contextMenu above p:dataTable: on rightclick, context menu appears either, but the row is not selected.
So if p:contextMenu is added above the table, selection does not work as expected which must be the reason for the migration guide telling "add it below!".
Btw: I did not get that warning in my JavaScript console during my tests, don't know why.
I have a primefaces datascroller containing list of accordionPanels in it. I am using 'loader' facet for lazy loading. On clicking more the next chunk of data is listed. The problem is, if I click a commandButton inside the accordion tab, the 'loader' facet stops working. This is my code:
<p:dataScroller layout="block"
value="#{bean.mainList}" var="manvo" chunkSize="3" lazy="true">
<f:facet name="loader">
<p:commandButton type="button" value="More" process="#this" />
</f:facet>
<p:accordionPanel activeIndex="1" dynamic="true" scrollHeight="auto">
<p:tab title="#{manvo.releaseName} >> #{manvo.tcName}">
<p:commandButton value="TestIt" actionListener="#{bean.testSubmit()}" update="#form"/>
</p:tab>
</p:accordionPanel>
I use the dynamic overlayPanel of primefaces inside one p:tab inside one p:dialog like this :
<p:dialog id="dialog" modal="true" header="Nouveau Article"
widgetVar="dlg">
<h:form prependId="false" enctype="multipart/form-data">
<p:tabView id="monpanel">
<p:tab id="tab1" title="Informations">
....
</p:tab>
<p:tab id="tab2" title="Prix">
....
</p:tab>
<p:tab id="tab3" title="Stock et fournisseurs">
<h:outputLabel value="" /><h:outputLabel value="" /><h:outputLabel value="" />
<p:commandButton id="carBtn" value="Selectionner Fournisseurs" type="button" />
<p:overlayPanel appendToBody="true" my="left top" id="carPanel" for="carBtn" hideEffect="fade"
dynamic="true">
<p:dataTable id="table" var="car" rowKey="#{car.fournisseurId}"
value="#{articlesMB.listfournisseurs}" selection="#{articlesMB.selectedFournisseurs}"
rows="10" paginator="true" >
<p:column selectionMode="multiple" style="width:20px" />
<p:column headerText="Id">
<h:outputText value="#{car.fournisseurId}" />
</p:column>
<p:column headerText="Nom">
<h:outputText value="#{car.personne.nom}" />
</p:column>
</p:dataTable>
</p:overlayPanel>
</p:tab>
</p:tabView>
<p:commandButton id="article-ajouter"
update=":messages monpanel :articlesdata"
action="#{articlesMB.ajouter}" value="add" />
</h:form>
</p:dialog>
in the first time it works fine, but when I click on the add button and the validation failed (for any cause) and I click on dynamic button of overlaypanel, it appears but when I check or uncheck one of rows of datatable it disappear, I don't know the cause
do you have any idea how to resolve this problem
You cammandButton should use 'process' attribute, you specify component to submit info(not specify overlay).
For ex:
<p:inputText id="txttest" required="true" value="" />
<p:commandButton process="txttest" id="article-ajouter"
update=":messages monpanel :articlesdata"
action="#{articlesMB.ajouter}" value="add" />
The reason your overlay panel only works once is because you update the panel that holds the command button that overlayPanel is attached to.
It is a bug in overlayPanel emerged after PF 5. You can fix this without resorting process attribute, I think solutions like this reduces the readability of the code.
If you define a widgetVar to overlayPanel, say 'carPanelWDG', and call PF('carPanelWDG').loadContents() function in the onComplete event of the command button everything just works. And even if there is no comment explaining the reason why you did such a thing, anyone can interpret this easily.
I've got a weird bug when editing a date field using a Calendar component inside of an editable DataTable. To explain, I'm going to need to show you some pictures.
First, here is the actual page I'm working from:
Now, let's change date 1 in the list to the 13th of February and click OK.
As you can see, the table changes, but the row takes on another row's data.
Other than in the GUI, the update's gone just fine, and if we reload the page the date has been updated in the database. This is what the table looks like after the page has been refreshed:
I've turned the code inside and out trying to get at this bug, and I'm starting to wonder if it's a bug in PrimeFaces itself. I've stepped through the entire workflow and have concluded that the backing ArrayList has the correct values at all times. I was thinking it may have had something to do with me sorting the list both when fetching it from the database and using the sortBy attribute of the DataTable. After disabling both however, the bug continues to manifest itself.
Here's my code for the page. Can anyone see anything I've done wrong? If so, you're my hero =)
<ui:composition template="/WEB-INF/standard-page-template.xhtml">
<ui:define name="title">Change Dates</ui:define>
<ui:define name="content">
<p:panel header="Change dates" style="width:760px">
<h:form>
<p:panel>
Just the search stuff here...
</p:panel>
<p:panel header="Search">
<h:panelGrid columns="1">
<p:dataTable id="listDatesTable" value="#{view.dateWrappers}" var="wrapper"
rowIndexVar="index" editable="true"
emptyMessage="Search for an ID above">
<p:ajax event="rowEdit" listener="#{changePublishDateView.changeDate}"/>
<p:column headerText="Dragning" width="90">
<h:outputText value="#{wrapper.id}"/>
</p:column>
<p:column headerText="Beskrivning" width="180">
<h:outputText value="#{wrapper.description}"/>
</p:column>
<p:column headerText="Distribution" width="100">
<h:outputText value="#{wrapper.id2}"/>
</p:column>
<p:column headerText="Publiceringstid" width="170" styleClass="#{view.duplicateDateInRow(wrapper)}">
<p:cellEditor>
<f:facet name="output">
<h:outputText value="#{wrapper.newhDate}">
<f:convertDateTime pattern="yyyy-MM-dd HH:mm"/>
</h:outputText>
</f:facet>
<f:facet name="input">
<p:calendar
mindate="#{view.minDate}" stepMinute="30" minHour="8" maxHour="22"
pattern="yyyy-MM-dd HH:mm" value="#{wrapper.newDate}"/>
</f:facet>
</p:cellEditor>
</p:column>
<p:column width="50">
<p:rowEditor/>
</p:column>
</p:dataTable>
</h:panelGrid>
</p:panel>
</h:form>
</p:panel>
</ui:define>
As it turns out, this bug was due to the data in the individual rows being mostly identical.
Solution: Set a rowKey attribute on the datatable, to the date field. Now it works fine with or without sorting.
http://www.developer.am/primefaces/?page=RowKey
I have this code. It should fire rowSelect event, after the user select a row and close the dialog box. it worked fine before i updated to primfaces 3.3(I had ver3.2). I dont have any exception in console and when I debuged i see the method doesnt call. I dont know where to begin to solv this problem. Could someone help me with this?
<p:dialog id="dlg" closable="true" header="New reciever" widgetVar="receiverListDlg" visible="false" modal="true">
<p:dataTable var="reciever" value="#{transactionController.recieverList}">
<p:ajax event="rowSelect" listener="#{transactionController.onRowSelect}" update=":form" onsuccess="receiverListDlg.hide()" />
<f:facet name="header">
Previouse recievers for #{customer.firstName}
</f:facet>
<p:column selectionMode="single" />
<p:column headerText="#{msg.havale_customer_firstname}">
<h:outputText value="#{reciever.firstName}" />
</p:column>
<p:column headerText="#{msg.havale_customer_lastName}">
<h:outputText value="#{reciever.lastName}" />
</p:column>
<p:column headerText="#{msg.havale_customer_phoneNr}">
<h:outputText value="#{reciever.phoneNr}" />
</p:column>
</p:dataTable>
</p:dialog>
Now Primefaces provided some new ajax events:
onSelectCheckBox
onUnselectCheckbox
onSelectRadio
So rowSelect and rowUnselect will not be fired in your case.
I think you should use the "rowSelectRadio" ajax event.
The dataTable should be surrounded by <h:form>. Also you should add the following attributes to the p:dataTable (I don't know if all of them are required, but I have them all and it works fine).
- selectionMode="single"
- rowKey="#{receiver.id}" (replace 'id' with the actual ID attribute of Receiver)
- selection="#{transactionController.selectedReceiver"
I'm new to stackoverflow as user but I use it frequently as I saw that is something going on here with Prime! ;-)
Okay, I'm currently migrating a RichFaces 3.3.3 JSF 1.2 project to Mojarra 2.1.7 (SNAPSHOT 20120206) and PrimeFaces 3.3 which is IMHO revelation to JSF.
Long story short I was searching for this error mentioned in the topic for half the week and I gave it a try to step back to PF 3.2 and tataaaa rowSelect and all my other implementations work now.
I have a simple form with a datatable and selectionMode="multiple" and the ajax events:
<h:form>
<p:dataTable id="massnahmenAuswahl"
value="#{massnahmenController.massnahmen}"
var="eineMassnahme"
selection="#{massnahmenController.massnahmenSelected}"
rowKey="#{eineMassnahme.massnahme}">
<p:ajax event="rowSelect"
listener="#{massnahmenController.rowSelected}" process="#this"
update="#this" />
<p:ajax event="rowUnselect"
listener="#{massnahmenController.rowUnselected}" process="#this"
update="#this" />
<p:ajax event="toggleSelect"
listener="#{massnahmenController.rowToggleSelected}" process="#this"
update="#this" />
<p:column selectionMode="multiple" style="width:18px"
disabledSelection="#{!login.editable}" styleClass="checkbox" />
<p:column>
<h:outputText escape="false" value="#{eineMassnahme.zeile}" />
</p:column>
<p:column>
<h:outputText escape="false" value="#{eineMassnahme.bezeichnung}" />
</p:column>
<p:column>
<fiona:labelImgGA for="#{eineMassnahme.massnahme}" />
</p:column>
<p:column>
<p:selectBooleanCheckbox value="#{eineMassnahme.vorjahr}"
disabled="true" />
</p:column>
<f:facet name="footer">
<p:commandButton value="Speichern"
action="#{massnahmenController.speichern}"
disabled="#{!login.editable}" process="#this" update="#form" />
<p:spacer/>
<p:commandButton value="Weiter"
action="#{massnahmenController.saveAndNext}"
disabled="#{!login.editable}" process="#this" update="#form" />
</f:facet>
</p:dataTable>
</h:form>
Will this be fixed in near future?
Until now I really go with PF!
Don't disappoint me! ;-)
UPDATE:
The solution is to use lazy=true since PF 3.3. I've seen it in issue 2993 in PrimeFaces issue tracker!