I'm doing project in primefaces. I included the data table and sort order. when I click the icon it will not working.
I tried the below code:
<p:dataTable var="car" value="#{dtSortView.cars1}">
<p:column headerText="Id" sortBy="#{car.id}">
<h:outputText value="#{car.id}" />
</p:column>
</p:dataTable>
You need to wrap your p:dataTable inside h:form tag.
<h:form id="carForm">
<p:dataTable var="car" value="#{dtSortView.cars1}">
<p:column headerText="Id" sortBy="#{car.id}">
<h:outputText value="#{car.id}" />
</p:column>
</p:dataTable>
</h:form>
You can check this from here .
Hope it helps.
Related
I have an issue with primefaces to update a dataTable. The problem is, that after submiting the "change" button, the datatabel is not updated - not with ajax=false, not with update=... . Maybe anyone has an idea?
Note: button and datatable are in two different forms, but should not be a problem, works for another case in my project. And userOrders are loaded lazily, but i logged the list in bean, the data is correctly available.
<h:form rendered="#{orderModel.positions.size() > 0}">
<p:commandButton icon="fa fa-edit" value="change" update=":table:orderDT, temp" action="#{orderModel.editOrder()}" rendered="#{orderModel.posChecked and orderModel.orderEditable}"/>
</h:form>
<h:form id="table" >
<p:dataTable id="orderDT" rendered="#{orderModel.user.orders.size() > 0}" reflow="true" var="order" value="#{orderModel.userOrders}" selection="#{orderModel.tempOrder}" selectionMode="single" rowKey="#{order.id}" scrollable="true" style="margin: 20px">
<p:ajax event="rowSelect" update=":table" listener="#{orderModel.onRowSelected}"/>
<f:facet name="header">
GetÃĪtigte Bestellungen
</f:facet>
<p:column style="width:16px">
<p:rowToggler/>
</p:column>
<p:column headerText="Bestellnummer">
<h:outputText value="#{order.id}"/>
</p:column>
<p:rowExpansion>
<p:dataTable id="exp" var="pos" value="#{order.orderPositions}" reflow="true">
<p:column headerText="Anzahl">
<h:outputText value="#{pos.quantity}"/>
</p:column>
</p:dataTable>
</p:rowExpansion>
</p:dataTable>
</h:form>
Solved it on my own: I adapted the rendered="#{orderModel.user.orders.size() > 0} to rendered="#{orderModel.userOrders.size() > 0} and added lazyLoading. Probbaly the first would be enough, but I think the accessed fields should be the same.
I want to add one row(hard coding) in the beginning of both columns. Can someone help me on how to implement it?
I am new to JSF so unable to get it.
<p:dataTable var="DataTableValue" value="#{showTableBean.list}">
<p:column headerText="Attribute" >
<h:outputText value="#{DataTableValue.attribute}" />
</p:column>
<p:column headerText="Vehicle Data">
<h:outputText value="#{DataTableValue.value}" />
</p:column>
</p:dataTable>
I am providing a search function using JSF. I get the list and display it correctly in a datatable :
<p:dataTable id="props" var="prop" value="#{propController.propSearch}" editable="true" style="margin-bottom:20px">
<p:column headerText="Id" width="20">
<h:outputText value="#{prop.id}" />
</p:column>
<p:column headerText="Name" width="300">
<h:outputText value="#{prop.name}"/>
</p:column>
<p:column headerText="Description">
<h:outputText value="#{prop.shortDescription}" />
</p:column>
<p:column headerText="Price" width="120">
<h:outputText value="#{prop.price}" />
</p:column>
<p:column width="120">
<h:commandButton value="View Prop" immediate="true" action="#{propController.viewSingleProp(prop)}" />
</p:column>
<p:column width="120">
<h:commandButton value="Delete" immediate="true" onclick="return confirm('Are you sure you want to delete this prop?')" actionListener="#{propController.deleteProp(prop)}" />
</p:column>
</p:dataTable>
</h:form>
However the commandButton to view each individual item does not get called. Instead the search page just refreshes with no data.
Why is this happening?
(I hope your opening tag of <h:form> is just missing in your code posted in your question, not in your actual code!)
You need to remove the attribute immediate="true" from the h:commandButton.
See:
Immediate=true VS immediate=false in JSF Component
I have this datatable:
<h:form id="form">
<p:dataTable id="tblInfo" var="ref" value="#{consultasBean.listaRefacciones}" paginator="true" rows="10" selectionMode="single" selection="#{consultasBean.refaccionSeleccionada}" rowKey="#{ref.idRefaccion}">
<p:column headerText="Equipo">
<h:outputText value="#{ref.equipo}" />
</p:column>
<p:column headerText="Marca">
<h:outputText value="#{ref.marca}" />
</p:column>
//More colums here...
</p:dataTable>
And I want to show this dialog after the user select a row:
<p:dialog id="myDialog" widgetVar="refaccionDialog" header="Detalle Refaccion" resizable="false" width="300" showEffect="explode" hideEffect="explode">
<h:panelGrid id="display" columns="2" cellpadding="4">
<h:outputText value="Info:" />
<h:outputText value="#{consultasBean.refaccionSeleccionada.equipo}" />
</h:panelGrid>
//More things here...
</p:dialog>
And this is part of my bean (viewscoped):
private List<RefaccionBean> listaRefacciones = null;
private RefaccionBean refaccionSeleccionada = null;
// setters and getters...
listaRefacciones already has info, so dont worry about how it gets it.
I know i have to use p:ajax but just dont know how.
I was checking this (example 1 is what i want) but the info is too old and does not work now.
Please help me.
Just include a p:ajax inside your table
<p:ajax event="rowSelect" oncomplete="PF('refaccionDialog').show()" update=":dialogId" />
Hope this helps.
rowKey attribute of datatable is wrongly written.
it should be like as follows
rowKey="#{ref.idRefaccion}"
The datatable code should as follows
<h:form id="form">
<p:dataTable id="tblInfo" var="ref" value="#{consultasBean.listaRefacciones}" paginator="true" rows="10" selectionMode="single"
selection="#{consultasBean.refaccionSeleccionada}" rowKey="#{ref.idRefaccion}">
<p:column headerText="Equipo">
<h:outputText value="#{ref.equipo}" />
</p:column>
<p:column headerText="Marca">
<h:outputText value="#{ref.marca}" />
</p:column>
//More colums here...
</p:dataTable>
I have filters for columns.
Here i want to show water mark in filter (As Shown in figure in red circle)
I am using prime faces 3.4
I have tred this
<h:form id="parametersListForm" prependId="false">
<p:dataTable id="parameteresList" value="#{parameterController.lstParameter}"
var="parameters" selectionMode="single"
selection="#{parameterController.selectedParameter}"
styleClass="tnt-main-table">
<p:ajax event="rowSelect" update=":parameterDetailsForm"
listener="#{parameterController.onParametersRowSelect}" />
<p:column id="colomnRefType" filterBy="#{parameters.beRefType}"
headerText="#{msgs['parameters.beRefType.label']}"
filterMatchMode="contains">
<h:outputText value="#{parameters.beRefType}"/>
<p:watermark value="Ref Type"
forElement= ":parameteresList:colomnRefType_filter">
</p:watermark>
</p:column>
</p:dataTable>
</h:form>
How can I achieve this?
There is an attribute forElement of p:watermark for that. The specifications state that forElement should contain jquery selector of the html input component. But according to these threads here and here, the forElement should strictly be only the client ID of the html input component.
So you can do following:
<p:dataTable id="battingStyleTable" ... ... ..>
<p:column id="myColumn"
filterBy="#{battingStyle.battingStyleString}"
filterMatchMode="contains">
<f:facet name="header">Name</f:facet>
<h:outputText value="#{battingStyle.battingStyleString}" />
<p:watermark value="Watermark text"
forElement='battingStyleTable:myColumn_filter'></p:watermark>
<!-- Please note that the prependId of my form is false, and id of the datatable is battingStyleTable and id of the column is myColumn. Thats why the id of the textfield of the filter will be battingStyleTable:myColumn_filter. Please change it accordingly. If you can't do prependId="false" to your form then you must include form id in the start also, like myFormId:myDatatableId:myColumnId_filter -->
</p:column>
...............
..........
................
</p:dataTable>
Finally got solution.
<h:form id="parametersListForm">
<p:dataTable id="parameteresList" value="#{parameterController.lstParameter}"
var="parameters" styleClass="tnt-main-table">
<p:column id="columnRefType" filterBy="#{parameters.beRefType}" >
<h:outputText value="#{parameters.beRefType}" />
<p:watermark forElement="parametersListForm:parameteresList:columnRefType:filter"
value="#{msgs['parameters.beRefType.label']}"/>
</p:column>
</p:dataTable>
</h:form>
Hope it helps to some one :)
Try to use this syntax to address the filter field. Worked for me with Primefaces 6.1.
<h:form id="f_myForm">
<p:dataTable id="dt_myTable">
<p:column id="col_myCol>
<h:outputText id="ot_myText" />
<p:watermark for="#(#f_myForm\\:dt_myTable\\:col_myCol\\:filter)" value="MyPlaceholder" />
</p:column>
</p:dataTable>
</h:form>