I got a datatable with a custom layout selectoneradio. It doesnt submit correct values after the first row.
This is the datatable:
<h:form id="dataTableForm">
<br />
<p:dataTable id="absenceTable" var="absence" widgetVar="absenceTable"
value="#{adminController.absenceList}" rowIndexVar="rowIndex"
emptyMessage="Keine Absenzen mit ausstehender Genehmigung gefunden"
style="width:70%;margin-left:15%;margin-right:15%;margin-bottom:20px;margin-top:10px;"
rowKey="#{absence.id}" rows="30" paginator="true"
paginatorPosition="bottom" paginatorAlwaysVisible="false"
paginatorTemplate="{PageLinks}" sortBy="#{absence.startDate}"
sortOrder="descending"
filteredValue="#{adminController.filteredAbsences}">
<f:facet name="header">Mitarbeiterabsenzen mit ausstehender Genehmigung</f:facet>
<p:column>
<p:selectOneRadio id="action" value="#{absence.status}" required="false"
layout="custom" >
<f:selectItem itemValue="PENDING" noSelectionOption="true" />
<f:selectItem itemValue="APPROVED" />
<f:selectItem itemValue="REJECTED" />
<p:ajax event="valueChange" immediate="true" listener="#{adminController.checkBoxListener}" />
</p:selectOneRadio>
</p:column>
<p:column width="20">
<p:radioButton for="action" itemIndex="0" />
</p:column>
<p:column width="20">
<p:radioButton for="action" itemIndex="1" />
</p:column>
<p:column width="20">
<p:radioButton for="action" itemIndex="2" />
</p:column>
<f:facet name="footer">
<p:commandButton value="Speichern"
action="#{adminController.save()}" update="absenceTable" />
</f:facet>
</p:dataTable>
</h:form>
The row index and absence loop variable is defined on the datatable.
Its all in the same form.
The problem is, somehow, it only works for the first row. The other rows submit "on" instead of the value. I found in the generated html that they are not provided with value-tag like the radiobuttons in the first row are:
I guess its gonna be a stupid syntax issue or something... This is what i get debugging clicking on anything but the first row:
Im running on PF 5.2
This is a bug in PF5.2
The code runs smoothly on PF5.3
Related
When using autoComplete and columnToggler within a dataTable, I get a broken column-list in the column toggler.
That means, the column-list doesn't show the column-names but some javascript code instead (for each column).
Here is an example:
<p:commandButton id="showColsButton" type="button" value="Show Columns" />
<p:columnToggler datasource="myDataTable" trigger="showColsButton" />
<p:dataTable id="myDataTable" var="row" ...>
<p:column sortBy="#{row.myCol1}">
<f:facet name="header">
<div><h:outputText value="My Column 01" /></div>
<p:autoComplete ...>
<p:ajax event="itemSelect" update="myDataTable" />
</p:autoComplete>
</f:facet>
<h:outputText value="#{row.myCol1}" />
</p:column>
</p:dataTable>
Is this a bug or is there any solution for this specific problem?
Putting an input in the header facet is not valid. If you want to use it as a filter or something, put it in a f:facet name="filter".
<p:dataTable id="myDataTable" var="row" ...>
<p:column filterBy="#{row.myCol1}" sortBy="#{row.myCol1}">
<f:facet name="header">
<div><h:outputText value="My Column 01" /></div>
</f:facet>
<f:facet name="filter">
<p:autoComplete ...>
<p:ajax event="itemSelect" update="myDataTable" />
</p:autoComplete>
</f:facet>
<h:outputText value="#{row.myCol1}" />
</p:column>
But you might need to improve on the way the filter is used by not using the p:ajax but use an onchange=PF('dataTableWidget').filter(), adding a widgetVar attribute and adding filter attributes
See also
PrimeFaces showcase dataTable filter
I am using PF 5.3, on (weblogic 11g/jsf2.0/java 1.6).
I thought the issue of not shown emptyMessage in Datatable is fixed in 5.3, but inspite of using the latest version, i still dont see the message. Below is my sample code.
<p:dataTable id="attaDt" var="fileRow" value="#{pendpaybean.selectedPayDetailsFiles}"
rowIndexVar="rowIndex"
emptyMessage="No Files Uploaded"
>
<p:column headerText="Uploaded Date"
width="15px;" style="text-align:center"
>
<h:outputText value="#{fileRow.columns[0]}" />
</p:column>
<p:column headerText="Uploaded By"
width="30px;" style="text-align:center"
>
<h:outputText value="#{fileRow.columns[3]}" />
</p:column>
</p:datatable>
Any help ?
Your code works well. NOTE I put attribute value to null for showing emptyMessage.
Your adapted code:
<h:body>
<h:form>
<p:dataTable id="attaDt" value="#{null}" var="fileRow" rowIndexVar="rowIndex" emptyMessage="No Files Uploaded">
<p:column headerText="Uploaded Date" width="15px;" style="text-align:center">
<h:outputText value="#{fileRow.columns[0]}" />
</p:column>
<p:column headerText="Uploaded By" width="30px;" style="text-align:center">
<h:outputText value="#{fileRow.columns[3]}" />
</p:column>
</p:dataTable>
</h:form>
</h:body>
I'm using a datatable with filtering. This is the table declaration:
<p:dataTable id="#{tblId}" var="p" editable="true" editMode="cell"
resizableColumns="true" rowIndexVar="rowIndex" selectionMode="multiple"
rowKey="#{p.id}" selection="#{ppselection}"
emptyMessage="No Params in table" value="#{tblValue}" scrollable="true"
style="height:100%" sortMode="multiple" styleClass="#{styleClass}"
filteredValue="#{filteredParams}">
When adding a new row to the table, I want it to already be displayed according to the current filter. i.e. if the filter is "aa" and the row name is "aabbcc" then I want it displayed, but if the row name is "bbcc" then I don't want it displayed. Right now, all I came up with is decidng whether I want to manually add it to the filteredParams list or not.
This is an example of one of the columns in the table, although all the coulmns are filterable:
<p:column width="15%" id="ParameterColumn" headerText="Parameter" sortBy="#{p.name}"
filterBy="#{p.name}" filterMatchMode="contains">
<p:cellEditor id="Parameter">
<f:facet name="output">
<h:outputText id="param_name" value="#{p.name}" />
</f:facet>
<f:facet name="input">
<p:inputText id="nameInput" value="#{p.name}" style="width:99%"
validator="#{p.validateParamName}">
<p:ajax event="change"
update=":main_tabs:paramForm:ParamTbl, :main_tabs:paramForm:SplitedParamTbl" />
</p:inputText>
<p:messages for="nameInput" display="tooltip" />
</f:facet>
</p:cellEditor>
</p:column>
Thanks!!
You can trigger filtering in oncomplete method of ajax/button that adds new row:
oncomplete='tableWidgetVar.filter();'
I am using PrimeFaces 3.2 and want to export a dynamically created table as an .xls file. When i click on export, nothing seems to be happening.
Export Code
<h:commandLink id="Download_Excel_Format" ajax="false">
<p:graphicImage value="/resources/Excel_Icon.jpg" height="25" width="25" />
<p:dataExporter type="xls" target="dataTable" fileName="SomeFileName"/>
</h:commandLink>
dataTable
<p:dataTable id="dataTable" var="c" value="#{databaseSearch.customerList}"
paginator="true" rows="10" paginatorAlwaysVisible="false"
paginatorTemplate="Page {CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} Rows per page {RowsPerPageDropdown}"
rowsPerPageTemplate="5,10,15,30">
<p:column>
<f:facet name="header">
<h:outputText value="Machine" />
</f:facet>
<p:commandButton id="basic" value="#{c.machine}" action="#{updateEntry.setMachine(c.machine)}" oncomplete="dlg1.show();" styleClass="ui-Machinebutton" update=":Update_Entry"/>
<p:tooltip for="basic" value="Update/Delete Database Entry" showEffect="fade" hideEffect="fade" />
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Company" />
</f:facet>
<h:outputText value="#{c.company}" />
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Contact" />
</f:facet>
<h:outputText value="#{c.contact}" />
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Phone" />
</f:facet>
<h:outputText value="#{c.phone}" />
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Email" />
</f:facet>
<!-- <h:outputText value="#{c.email}" />-->
<h:outputLink value="mailto:#{c.email}?Subject=Baseline Monitor Alert | Machine : #{c.machine}">#{c.email}</h:outputLink>
</p:column>
</p:dataTable>
Both the dataTable and the Export command are within one form, however the dataTable is in a output panel (within the form).
Form
<h:form prependId="false" id="Main_Form">
</h:form>
Output Panel
<p:outputPanel id="panel" autoUpdate="false">
</p:outputPanel>
I even updated to PrimeFaces 3.4.2 to see if the dataExporter would work, but no avail, as far as i remember 3.2 has a bug if the dataTable generates columns dynamically, but that is not the case here right? am i doing something wrong?
dataExporter option looks much simpler, but if there is an alternative which is simple enough i am up for it.
Update
I am using a GlassFish 3.1.2.2 (build 5) & NetBeans 7.2.1, i do not get any errors, just the page refresh's, has a '#' at the end of the URL and stops, no errors means that i am not lacking any dependencies either... so i am lost here ...
Ok, i found the answer ! Tricky one though ... i had a commandButton with the ID=submit...renamed it and that did the trick !
<p:commandButton id="xsubmit" icon="ui-icon-search" title="Search Database" update="panel" actionListener="#{databaseSearch.customerList}" />
Im trying to update text field from dialog box .The text field is in the parent component. But its not happening . If i give the id of text field in the update of command button . I encountered the error :
javax.faces.FacesException: Cannot find component with identifier "customerCode" referenced from "tabView:lkpSltRec"
Since it is not able to find the component id . I have used the alternative . I have taken the hidden field .After command button is clicked , the hidden field gets updated and through simple javascript function im updating the text field of parent component .The javascript function is called from oncomplete of command button in the dialog box. Since ,as per project requirement i have to achieve it through primefaces only not through javascript . Plz, suggest me the approach in primefaces . Below is the code snippet:
Here ecap:lookup is the the customize component.
Selected Customer <p:inputText id="customerCode"
value="#{sixthTabBBean.customerName}" label="Selected Adddress"></p:inputText>
Selected Customer City <p:inputText id="selectedCity" value="#{sixthTabBBean.customerCity}" ></p:inputText>
<ecap:lookup lookupId="LOV0072" inputId="customerCode" clickStatus="city"
defaultDDValueIndex="0" title="CustomerCode"></ecap:lookup>
New LOV <ecap:lookup lookupId="LOV0092" inputId="customerCode" clickStatus="none"
defaultDDValueIndex="0" title="CustomerCode"></ecap:lookup>
City<p:inputText id="custCity" value="#{sixthTabBBean.customerCity}"
disabled="true" label="City"></p:inputText>
Selected Customer <p:inputText id="customerCode1"
value="#{sixthTabBBean.customerName}" label="Selected Adddress" ></p:inputText>
Selected Customer City <p:inputText id="selectedCity1" value="#{sixthTabBBean.customerCity}" ></p:inputText>
Selected Customer State <p:inputText id="selectedSate1" value="#{sixthTabBBean.customerState}" ></p:inputText>
<ecap:lookup lookupId="LOV0098" inputId="customerCode" clickStatus="state"
defaultDDValueIndex="0" title="CustomerCode"></ecap:lookup>
<p:dialog id="lkpDialog" widgetVar="lpDialogVar" header="Lookup"
modal="true" width="1000" height="600"
rendered="#{lookupSearch.popupRender}" >
<h:form rendered="#{lookupSearch.popupRender}" prependId="false">
<h:panelGrid cellpadding="10" id="diaFrmId">
<p:dataTable id="newfdt" var="flxSearch"
value="#{lookupSearch.lkpSearchCriteriaList}">
<p:column id="newwhc">
<f:facet name="header">
<h:outputLabel value="Search Fields"></h:outputLabel>
</f:facet>
<p:selectOneMenu styleClass="fdd180" id="newwdd"
value="#{flxSearch.searchCriterion.whereClause}">
<f:selectItems value="#{flxSearch.whrClausDropdown}" />
</p:selectOneMenu>
</p:column>
<p:column id="newcoc">
<f:facet name="header">
<h:outputLabel value="Conditions"></h:outputLabel>
</f:facet>
<p:selectOneMenu id="newco" styleClass="fdd95"
value="#{flxSearch.searchCriterion.operator}">
<f:selectItems id="newcriOperatorItms"
value="#{flxSearch.operatorDropdown}" />
</p:selectOneMenu>
</p:column>
<p:column id="newcic">
<f:facet name="header">
<h:outputLabel value="Value"></h:outputLabel>
</f:facet>
<p:inputText id="newcriInpNm"
rendered="#{!flxSearch.inputDate and !flxSearch.boolValue and !flxSearch.required}"
styleClass="285 ftb" deferChangeEvent="true"
value="#{flxSearch.searchCriterion.value}"
maxlength="#{flxSearch.maxLength}"
disabled="#{flxSearch.disableInput}" partialSubmit="true"
labelValue="#{flxSearch.searchCriterion.label}"
required="#{flxSearch.required}">
</p:inputText>
<p:inputText id="newcriInpM"
rendered="#{!flxSearch.inputDate and !flxSearch.boolValue and flxSearch.required }"
value="#{flxSearch.searchCriterion.value}"
maxlength="#{flxSearch.maxLength}"
disabled="#{flxSearch.disableInput}"
labelValue="#{flxSearch.searchCriterion.label}"
required="#{flxSearch.required}">
</p:inputText>
<p:selectOneMenu styleClass="fdd" id="newbldd"
value="#{flxSearch.searchCriterion.value}"
disabled="#{flxSearch.disableInput}"
rendered="#{flxSearch.boolValue }">
<f:selectItems value="#{flxSearch.booleanDropdown}" />
</p:selectOneMenu>
<p:calendar id="newcriDtNm" size="9"
rendered="#{flxSearch.inputDate and !flxSearch.boolValue and !flxSearch.required }"
disabled="#{flxSearch.disableInput}" showOn="button"
value="#{flxSearch.searchCriterion.value}"
labelValue="#{flxSearch.searchCriterion.label}">
</p:calendar>
<p:calendar id="newcriDtM" size="9"
rendered="#{flxSearch.inputDate and !flxSearch.boolValue and flxSearch.required }"
disabled="#{flxSearch.disableInput}"
value="#{flxSearch.searchCriterion.value}"
enableChangeDetector="false" partialSubmit="true"
labelValue="#{flxSearch.searchCriterion.label}"
required="#{flxSearch.required}" showOn="button">
</p:calendar>
</p:column>
</p:dataTable>
<!-- hidden text used to update values in the parent component -->
<p:inputText type="hidden" id="hiddencustomerCode"
value="#{sixthTabBBean.customerName}" ></p:inputText>
<p:inputText type="hidden" id="hiddencustCity"
value="#{sixthTabBBean.customerCity}" ></p:inputText>
<p:inputText type="hidden" id="hiddencustState"
value="#{sixthTabBBean.customerState}" ></p:inputText>
<p:fieldset legend="Combined By">
<h:panelGrid columns="2" cellpadding="10">
<p:selectOneRadio id="newSlctDrk"
valueChangeListener="#{lookupSearch.getSelectedLogOpr}"
value="#{lookupSearch.selLogOpr}"
title="Combine all search criteria with AND or OR">
<f:selectItems id="newSlctDrkItms"
value="#{lookupSearch.logicalOperators}" />
</p:selectOneRadio>
</h:panelGrid>
</p:fieldset>
<h:panelGrid columns="3">
<p:commandButton value="Find" id="lkpfndDg" update="resultFldSet"
actionListener="#{lookupSearch.search}">
</p:commandButton>
<p:commandButton value="Clear" id="lkpClearDg"
actionListener="#{lookupSearch.clear}" />
</h:panelGrid>
<p:fieldset legend="Result" id="resultFldSet">
<p:dataTable binding="#{lookupSearch.lkpResultDataTable}"
value="#{lookupSearch.searchResultsForPage}"></p:dataTable>
</p:fieldset>
<p:commandButton value="Select" id="lkpSltRec" update="customerCode"
oncomplete="lpDialogVar.hide();insertSelectedValue();"
actionListener="#{lookupSearch.selectValue}" />
</h:panelGrid>
</h:form>
</p:dialog>
</h:panelGrid>
Here ecap:lookup is the customize component.
Finally, i have got the solution . The exception i have encountered is because of the form tag . The ajax event fired from the dialog is not able to find the component outside the form .In this case use:
:#{p:component('componentId')}
Here it will search the id not only within the form but outside of it.