When I change the value of the selectOneMenu I need to set the row in the backing bean and update a button which is in the same row.
<p:dataTable
id="dataTableId" rowIndexVar="rowIndex" rowKey="#{record.id}"
rows="10" selection="#{bean.selectedRecord}" selectionMode="single"
value="#{bean.allRecords}" var="record" widgetVar="dataTableWV">
<p:column>
<p:selectOneMenu converter="omnifaces.SelectItemsConverter"
id="selectOnMenuId" value="#{bean.recordDTO}">
<f:selectItems
itemLabel="#{status.name}" itemValue="#{status.id}" value="#{bean.statusList}" var="status" />
<p:ajax event="change" update="saveButtonId">
<f:setPropertyActionListener target="#{bean.selectedRecord}" value="#{record}" />
</p:ajax>
</p:selectOneMenu>
</p:column>
<p:column>
<p:commandButton action="#{bean.someMethod}" icon="ui-icon-disk" id="saveButtonId" update="someId"/>
</p:column>
</p:dataTable>
Edit #Tiny suggestions:
<p:dataTable
id="dataTableId" rowIndexVar="rowIndex" rowKey="#{record.id}"
rows="10" selection="#{bean.selectedRecord}" selectionMode="single"
value="#{bean.allRecords}" var="record" widgetVar="dataTableWV">
<p:ajax event="rowSelect"
listener="#{bean.anotherMethod(record)}"
update="somesIds" />
<p:column>
<p:selectOneMenu converter="omnifaces.SelectItemsConverter"
id="selectOnMenuId" value="#{bean.recordDTO}">
<f:selectItems
itemLabel="#{status.name}" itemValue="#{status.id}" value="#{bean.statusList}" var="status" />
<p:ajax event="change"
listener="#{bean.anotherMethod(record)}"
update="saveButtonId" />
</p:selectOneMenu>
</p:column>
<p:column>
<p:commandButton action="#{bean.someMethod}" icon="ui-icon-disk" id="saveButtonId" update="someId"/>
</p:column>
</p:dataTable>
Related
When I click "create" button Primefaces executes controller.selectedTableItem method, why? I'm not even updating datatable?
<p:panel header="#{title}">
<p:toolbar>
<f:facet name="left">
<p:commandButton id="createButton" icon="ui-icon-plus"
value="#{localization.Create}" ajax="true"
update=":ShipmentFormDiv editButton viewButton">
<p:confirm header="#{localization.ConfirmationHeader}"
message="#{localization.ConfirmCreateMessage}"
icon="ui-icon-alert" />
</p:commandButton>
</f:facet>
</p:toolbar>
<p:dataTable id="datalist" widgetVar="datalist"
value="#{controller.lazyItems}" lazy="true" var="item"
paginator="true" rows="10" rowsPerPageTemplate="10,20,30,40,50"
selectionMode="single" selection="#{controller.selectedTableItem}"
paginatorPosition="bottom" reflow="true"
rowStyleClass="#{item.rowStyleClass}">
<p:ajax event="rowSelect"
update="#form:createButton,#form:viewButton,#form:editButton,#form:deleteButton,#form:InboundShipmentDataTableContextMenu,:ShipmentFormDiv, #form:timeline"
listener="#{controller.onSelect}" />
<p:ajax event="rowUnselect"
update="#form:createButton,#form:viewButton,#form:editButton,#form:deleteButton,#form:InboundShipmentDataTableContextMenu, :ShipmentFormDiv"
listener="#{controller.onUnselect}" />
<p:ajax event="contextMenu"
update="#form:createButton #form:viewButton #form:editButton #form:deleteButton"
listener="#{controller.onContextMenu}" />
<p:ajax event="rowDblselect"
onsuccess="document.getElementById('ShipmentListForm:viewButton').click();" />
<ui:include src="/admin/templates/columns/office.xhtml">
</ui:include>
</p:dataTable>
</p:panel>
I tkink it was because p:commandButton processes every component in ancestor form. It seems that process="#none" helps.
<p:commandButton id="createButton" icon="ui-icon-plus"
value="#{localization.Create}"
actionListener="#{controller.prepareCreate}"
update=":ShipmentFormDiv,:ShipmentListForm, editButton, viewButton"
process="#none">
<p:confirm header="#{localization.ConfirmationHeader}"
message="#{localization.ConfirmCreateMessage}"
icon="ui-icon-alert" />
</p:commandButton>
I'm nesting a datable in tabview. On the first page its all working correctly and i can edit the table, but after i switch the tabs, the datatable isnt editable anymore.
Is there something i'm doing wrong?
Using Primefaces 5.3
<h:form id="form">
<p:tabView id="tabs" value="#{studentsTableView.exams}" activeIndex="#{studentsTableView.activTab}" dynamic="true" var="exam" binding="#{tabView}" cache="false" >
<p:ajax event="tabChange" update="form:tabs" />
<p:tab id="tab" title="#{exam.name}">
<p:dataTable id="students" rowIndexVar="rowIndex" var="student" editable="true" widgetVar="gradetable" editMode="cell" tableStyle="width:auto" styleClass="myTable" value="#{studentsTableView.students}">
<p:ajax event="cellEdit" update="students" />
<p:column headerText="Nr">
<h:outputText value="#{rowIndex+1}" />
</p:column>
<p:column headerText="Vorname">
<h:outputText value="#{student.vorname}" />
</p:column>
<p:column headerText="Nachname">
<h:outputText value="#{student.nachname}" />
</p:column>
<p:column headerText="Matrikelnummer">
<h:outputText value="#{student.matrikelnummer}" />
</p:column>
<p:columns value="#{exam.allExams}" var="subexam" columnIndexVar="colIndex">
<f:facet name="header">
<h:outputText value="#{subexam.examName}" />
</f:facet>
<p:cellEditor>
<f:facet name="output"><h:outputText id="modeloutput" value="#{studentsTableView.getGrade(subexam, student)}" /></f:facet>
<f:facet name="input"><p:inputText id="modelInput" value="#{studentsTableView.currentGrade}" valueChangeListener="#{studentsTableView.insertGrade(subexam, student)}" style="width:90%">
<p:ajax event="change" update="modelInput" />
<p:ajax event="change" update="modeloutput" />
<p:ajax event="change" update="modeloutput" />
<p:ajax event="change" update=":form:tabs:0:students" />
</p:inputText></f:facet>
</p:cellEditor>
</p:columns>
<p:column id="endgrades" headerText="Endnote">
<h:outputText id="endgrade" value="#{studentsTableView.getEndGrade(exam, student)}" />
</p:column>
<p:column headerText="Formel">
<p:selectBooleanButton id="value1" value="true" onLabel="Yes" offLabel="No" style="width:60px" />
</p:column>
<p:column headerText="Kommentar">
<p:commandButton id="public" icon="ui-icon-comment" type="button" >
<p:ajax event="click" listener="#{studentsTableView.setPublicCommentInfos(exam, student)}" update="publicarea" />
</p:commandButton>
<p:overlayPanel id="imagePanel" for="public" hideEffect="fade">
<h:inputTextarea id="publicarea" value="#{studentsTableView.publicComment}" >
<p:ajax event="change" update="publicarea" />
</h:inputTextarea>
</p:overlayPanel>
<p:commandButton id="private" icon="ui-icon-locked" type="button" >
<p:ajax event="click" listener="#{studentsTableView.setPrivateCommentInfos(exam, student)}" update="privatearea" />
</p:commandButton>
<p:overlayPanel id="privatepanel" for="private" hideEffect="fade">
<h:inputTextarea id="privatearea" value="#{studentsTableView.privateComment}" >
<p:ajax event="change" update="privatearea" />
</h:inputTextarea>
</p:overlayPanel>
</p:column>
</p:dataTable>
</p:tab>
</p:tabView>
</h:form>
Your problem could be because you're still referencing the datatable id from the first tab, even though you switched to another. You could try to create a different id for each datatable from each tab and then working with those ids and updating them.
I am trying to use datatable selection in dialog widget. But I cannot get selected value in my bean. Datatable selection is working, if I delete dialog widget tag. I am using PrimeFaces 4.0. How can I fix this?
passengerform.xhtml
<p:hotkey bind="esc" handler="dialogWidget.hide();" />
<p:dialog id="dialog" widgetVar="dialogWidget"
header="Coupon List" modal="true" width="400" showEffect="fade"
hideEffect="fade" appendTo="#(body)">
<h:form id="formDialog">
<h:outputLabel value="Lütfen E-ticket Kuponunu Seçiniz." />
<p:dataTable id="singleDT" var="coupon"
value="#{passengerFormService.couponList}"
rowKey="#{coupon.id}" rowIndexVar="rowIndex"
selection="#{passengerFormService.selectedCoupon}"
selectionMode="single">
<p:ajax event="rowSelect"
listener="#{passengerFormService.selectCoupon}"
update=":tab1:tab1_1:eticketform:formDialog">
<f:setPropertyActionListener value="#{coupon}"
target="#{passengerFormService.coupon}" />
</p:ajax>
<f:facet name="header"></f:facet>
<h:inputHidden name="hidden1"
value="#{passengerFormService.passengerForm.id}" />
<p:column style="width:20px" width="20">
<f:facet name="header">
<h:outputText value="#" />
</f:facet>
<h:outputText value="#{rowIndex+1}" />
</p:column>
<p:column headerText="Id">
<h:outputText value="#{coupon.id}" />
</p:column>
<p:column headerText="Departure Location">
<h:outputText value="#{coupon.departureLocation}" />
</p:column>
<f:facet name="footer"></f:facet>
</p:dataTable>
<p:separator />
<h:panelGrid columns="2" cellspacing="5"
columnClasses="alignLeft,alignRight" style="width:100%">
<p:commandButton id="selectButton1" update=""
icon="ui-icon-close" value="İptal"
oncomplete="PF('dialogWidget').hide()" />
<p:commandButton id="cancelSelectedButton1"
update=":tab1:tab1_1:passengerInsertform"
icon="ui-icon-check"
value="Onayla" oncomplete="PF('dialogWidget').hide()" />
</h:panelGrid>
</h:form>
</p:dialog>
PassengerFormService.java
public void selectCoupon(SelectEvent event) {
Log.getLogger().debug("New2 coupon selected...");
Log.getLogger().debug("selected: " +getSelectedCoupon());
}
i have a strange behaviour on Primefaces update :
I have i page with a panel grid with several output text and a dataTable with several rows. If I modify a row, the datatable update correctly, but if I insert a new row or delete a row it doesn't update. The page code is the following:
<ui:composition>
<p:dialog id="composizioneDlg" widgetVar="ComposizioneDialog" modal="true" resizable="false" appendTo="#(body)" header="#{bundle.ListDescImmTitle}">
<h:form id="composizioneListForm">
<p:panelGrid columns="10" rendered="#{immobiliController.selected != null}">
<h:outputText value="#{bundle.ViewImmobiliLabel_categoria}"/>
<h:outputText value="#{immobiliController.selected.categoria.descrizione}"
-------SEVERAL OUTPUTS---------------------------------
</p:panelGrid>
<p:panel header="#{bundle.ListDescImmTitle}">
<p:dataTable id="datalistComp" value="#{descImmController.composizione}" var="item" >
-----SEVERAL OPTIONS OF DATA TABLE-------------------
<p:ajax event="rowSelect" update="createButton viewButton editButton deleteButton"/>
<p:ajax event="rowUnselect" update="createButton viewButton editButton deleteButton"/>
<p:column>
<f:facet name="header">
<h:outputText value="#{bundle.ListDescImmTitle_stato}"/>
</f:facet>
<h:outputText value="#{item.stato}"/>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="#{bundle.ListDescImmTitle_categoria}"/>
</f:facet>
<h:outputText value="#{item.categoria}"/>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="#{bundle.ListDescImmTitle_descrizione}"/>
</f:facet>
<h:outputText value="#{item.descrizione}"/>
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="#{bundle.ListDescImmTitle_mq}"/>
</f:facet>
<h:outputText value="#{item.mq}"/>
</p:column>
<f:facet name="footer">
<p:commandButton id="createButton" icon="ui-icon-plus" value="#{bundle.Create}" actionListener="#{descImmController.prepareCreate}" update=":DescImmCreateForm" oncomplete="PF('DescImmCreateDialog').show()"/>
<p:commandButton id="editButton" icon="ui-icon-pencil" value="#{bundle.Edit}" update=":DescImmEditForm" oncomplete="PF('DescImmEditDialog').show()" disabled="#{empty descImmController.selected}"/>
<p:commandButton id="deleteButton" icon="ui-icon-trash" value="#{bundle.Delete}" actionListener="#{descImmController.destroy}" update=":composizioneListForm:datalistComp, :growl" disabled="#{empty descImmController.selected}"/>
</f:facet>
</p:dataTable>
</p:panel>
</h:form>
</p:dialog>
</ui:composition>
The editButton code is this ( and it works ):
<ui:composition>
<p:dialog id="DescImmEditDlg" widgetVar="DescImmEditDialog" modal="true" resizable="false" appendTo="#(body)" header="#{bundle.EditDescImmTitle}">
<h:form id="DescImmEditForm">
<h:panelGroup id="display">
<p:panelGrid columns="2" rendered="#{descImmController.selected != null}">
<p:outputLabel value="#{bundle.EditDescImmLabel_stato}" for="stato" />
<p:inputText id="stato" value="#{descImmController.selected.stato}" title="#{bundle.EditDescImmTitle_stato}" />
<p:outputLabel value="#{bundle.EditDescImmLabel_descrizione}" for="descrizione" />
<p:inputText id="descrizione" value="#{descImmController.selected.descrizione}" title="#{bundle.EditDescImmTitle_descrizione}" />
<p:outputLabel value="#{bundle.EditDescImmLabel_mq}" for="mq" />
<p:inputText id="mq" value="#{descImmController.selected.mq}" title="#{bundle.EditDescImmTitle_mq}" />
</p:panelGrid>
<p:commandButton actionListener="#{descImmController.update}" value="#{bundle.Save}" update="display, :composizioneListForm:datalistComp, :growl" oncomplete="handleSubmit(args, 'DescImmEditDialog');"/>
<p:commandButton value="#{bundle.Cancel}" onclick="DescImmEditDialog.hide()"/>
</h:panelGroup>
</h:form>
</p:dialog>
</ui:composition>
This is the code of createButton ( not update instead of editButton ) :
<ui:composition>
<p:dialog id="DescImmCreateDlg" widgetVar="DescImmCreateDialog" modal="true" resizable="false" appendTo="#(body)" header="#{bundle.CreateDescImmTitle}">
<h:form id="DescImmCreateForm">
<h:panelGroup id="display">
<p:panelGrid columns="2" rendered="#{descImmController.selected != null}">
<p:outputLabel value="#{bundle.CreateDescImmLabel_descrizione}" for="descrizione" />
<p:inputText id="descrizione" value="#{descImmController.selected.descrizione}" title="#{bundle.CreateDescImmTitle_descrizione}" />
<p:outputLabel value="#{bundle.CreateDescImmLabel_mq}" for="mq" />
<p:inputText id="mq" value="#{descImmController.selected.mq}" title="#{bundle.CreateDescImmTitle_mq}" />
</p:panelGrid>
<p:commandButton actionListener="#{descImmController.create}" value="#{bundle.Save}" update="display, :composizioneListForm:datalistComp, :growl" oncomplete="handleSubmit(args,'DescImmCreateDialog');"/>
<p:commandButton value="#{bundle.Cancel}" onclick="DescImmCreateDialog.hide()"/>
</h:panelGroup>
</h:form>
</p:dialog>
</ui:composition>
Where is my fault on call update="" in deleteButton and in createButton ????
After rewrite the code from the beginning ( but with the same code ) all goes well. Now It works
I want increment visible rows of p:dataTable when click on p:outputLink. Here is picture:
and my code is:
<p:dataTable value="#{tasks}" styleClass="dashTable"
var="tasklar" rows="5" lazy="true"
selection="#{flowScope.selectedTask}" selectionMode="single" >
<p:ajax event="rowSelect" />
<p:column headerText="#{messages.label_task_temasy}">
<h:outputText value="#{tasklar.taskTemasy}"/> </p:column>
</p:dataTable>
Thank`s for help.
I have resolved my problem. Here is code:
<h:form id="dataForm">
<p:dataTable value="#{tasks}" styleClass="dashTable"
var="tasklar" rows="#{taskCriteria.pageSize}" lazy="true"
selection="#{flowScope.selectedTask}" selectionMode="single" >
<p:ajax event="rowSelect" />
<p:column headerText="#{messages.label_task_temasy}">
<h:outputText value="#{tasklar.taskTemasy}"/> </p:column>
</p:dataTable>
<p:commandLink style="float:left" update=":dataForm"
action="#{taskCriteria.setPageSize(taskCriteria.pageSize+5)}">
<h:outputText value="Show more..." />
</p:commandLink>
</h:form>