We are using Primefaces Datatable component where the values are coming from a database.
in our xx.xhtml file below code is present
<p:dataTable id="activitydescription" var="type"
value="#{activityBean.activityList}" rows="#{activityBean.rowNo}" rowKey="#{type.activitySchemeId}"
selection="#{activityBean.activityDTO}"
emptyMessage="No value found with given criteria"
paginatorPosition="bottom" sortMode="single" paginator="#{empty activityBean.activityList ? 'false':'true' }"
dynamic="true"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink}"
rowIndexVar="rowIndex"> ........
Now when this page is rendered on the browser we have seen a hidden field is created as below..
<input type="hidden" id="formId:activitydescription_selection" name="formId:activitydescription_selection" autocomplete="off" value="" /></div><script id="formId:activitydescription_s" type="text/javascript">
The field is created dynamically when the datatable component is rendered on browser.
So is there any way we can avoid this hidden field to be created.?
I hope i have rephrased my query very clearly.
Any help would be really appreciated.
You can't, this field is needed for the component to function correctly. But.... You can always download the source, implement a different solution and file a patch...
Related
I'm using a primefaces datatable and trying to make it clickable without using a javascript. Can anyone help me?
Here is my code. By clicking rows, I want to invoke a method.
<p:dataTable id="examplej" class="table couple-table" rowKey="#{info.id}" selectionMode="single" selection="#{bb.detail(info)}" rowIndexVar="rowIndex"
var="info" value="#{bb.coupleList}" rows="10" paginatorTemplate="{RowsPerPageDropdown} {FirstPageLink} {PreviousPageLink} {CurrentPageReport} {NextPageLink} {LastPageLink}"
rowsPerPageTemplate="5,10,15" paginator="true" emptyMessage="お探しの地域では見つかりませんでした">
<p:column class="column-couple">
<h:outputText value="#{info.addressOne}" />
</p:column>
This is a method which i want to invoke by clicking rows.
<p:commandLink action="#{bb.detail(info)}"/>
when i run my webapp, i get this error now.
javax.el.PropertyNotFoundException: The class 'java.lang.String' does not have the property 'id'.
Thank you in advance.
It can be done via selection and selectionMode attributes in <p:datatable> component. In selection you can specify action in backing bean what would you like to do with selected object. It is clearly documented and presented on primefaces showcase site
I'm relatively new to JSF and Primefaces, but I've been tasked to try and reduce the amount of AJAX requests made in a legacy codebase. This question is from a particular example where we have a directory listing UI of files and folders.
<p:dataTable id="directoryTable" var="directoryObject" value="#{fileCabinet.folderContents}"
resizableColumns="true" scrollable="true"
rowKey="#{directoryObject}" selectionMode="single"
selection="#{fileCabinet.currentObject}" dblClickSelect="true"
sortMode="multiple" emptyMessage="This folder is empty"
sortFunction="#{dataTableUtil.sort}">
<c:if test="#{directoryObject.objectType eq 'DIRECTORY'}">
<p:ajax event="rowSelect" listener="#{fileCabinet.onRowSelect}"
update=":form:directoryTable :menu" />
</c:if>
I've excluded the rest of the datatable for brevity. With this code, the ajax event is never attached even though the 'test' expression evaluates perfectly fine in subsequent 'rendered' attributes of html elements later on. Unfortunately, p:ajax doesn't support 'rendered' conditionals.
I've also tried c:choose / c:when, to the same results.
This feels like something that should be really easy to do! I'm probably missing some simple syntax to make this work.
Thanks!
I fixed this by using the disabled attribute for <p:ajax> with my conditional as the value (negated of course).
<p:ajax event="rowSelect"
listener="#{fileCabinet.onRowSelect}"
update=":form:directoryTable :menu"
disabled="#{directoryObject.objectType ne 'DIRECTORY'}" />
Since 4.0 version, Primefaces datatable comes with a disabledSelection property.
<p:dataTable var="foo" value="#{bean.foos}" selection="#{bean.selectedFoo}" disabledSelection="#{foo.bar == 1}">
<p:column selectionMode="single" />
<p:column>
<h:outputText value="#{foo.bar}" />
</p:column>
<p:dataTable>
I want refresh my lazytable from another from. I have the following xhtml:
<h:form id="tableform">
<p:remoteCommand name="updateTable" update="table" />
<p:dataTable widgetVar="tableWidget" id="table"
selection="#{personBean.selectedPerson}" selectionMode="single"
lazy="true" paginator="true" var="person" rowKey="#{person.id}"
value="#{personBean.personModel}" paginatorPosition="bottom" rows="5"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}">
<p:column filterBy="#{person.name}" headerText="Names:"
sortBy="#{person.name}">
<h:outputText value="#{person.name}" />
</p:column>
</p:dataTable>
<p:commandButton value="buttonInForm2" update=":tableform" />
<p:commandButton value="buttonInForm" update="#form" />
</h:form>
<h:form>
<p:commandButton value="directUpdate" update=":tableform" />
<p:commandButton value="directUpdate" update=":tableform:table" />
<p:commandButton value="remoteCommand" oncomplete="updateTable()" />
</h:form>
The remoteCommand (my current solution) and the buttons in the from refresh the table right. But when i use the "directUpdate"- buttons the filtertext of the table disappear. But i dont understand why? (The filter value stays at the background but the text is empty)
I know that i can use widgetVar.filter() on table but than the paginator will be reseted. My solution is the remoteCommand with it all works fine and the table reloads with current page and filter. (Better solutions are welcome)
The question why reset directUpdate the text and an update in the form not?
Thanks for time.
The <p:dataTable> has its own hidden inputs for among others pagination, selection and filtering so that the server side knows the client side state. This way it can prepare and return the same state as it is in the client side.
If you submit a certain form, only the inputs contained in the particular form will be sent, not from other forms. This is not a JSF specific problem. HTML has always worked that way. The world wide web would otherwise have looked very different.
With invoking the <p:remoteCommand> from outside the form, you're basically submitting the "right" form, namely the one it is contained in which also covers the data table.
Do note that you don't need a <p:commandButton> for it per se, just a simple <p:button ... onclick="updateTable(); return false;"> is already sufficient. Even the whole second form is unnecessary for the job.
What is idea?
Save the graphics in images.
Pass the binary to a String on the server.
Identify the graph from the binary (ready).
Create a pdf with data and graphics (ready, use itex).
View the pdf (ready).
But I can not export any graphics. This is because I can not detect them.
When I include a graphic in a datatable, widgetvar are repeated, so I can not use the solution of the showcase.
$('#output').empty().append(chartWidgetvar.exportAsImage());
This is part of my code.
<h:form id="reportePro">
<p:dataTable value="#{listas.reporteSeccionPro}" var="p"
selection="#{listas.reporteSeleccionadoSeccionPro}"
selectionMode="single" rowKey="#{p.idFila}"
emptyMessage="No existen coincidencias" id="reporteGeneral">
<p:column headerText="Chart">
<p:commandButton id="chartBtn" value="Gráficos" type="button" />
<p:overlayPanel id="chartPanel" for="chartBtn" hideEffect="fade"
showEffect="fade" appendToBody="true"
style="width:900px;height:450px;">
<p:pieChart id="pie"
styleClass="jqplot-table-legend jqplot-target"
value="#{p.pieModel}" extender="ext"
title="#{p.nomProSeccionPro}"
style="width:400px;height:450px;font-size:15px;"
showDataLabels="true" sliceMargin="5"
seriesColors="DB4C14, C0E9ED, A8CCED, C7B47F, F7F28F, 4DB0C4" />
</p:overlayPanel>
</p:column>
</p:dataTable>
</h:form>
I thought use dynamic id ,
<p:pieChart id="#{chart.idPie}" />
but can not be set.
I thought use dynamic widgetvar,
<p:pieChart widgetvar="#{chart.idPie}" />
but can not be set.
I thought of using only the id of the graphics,
#{p:widgetVar ('ComponentId')}
but remember that you can not use dynamic id
Another solution might be to use the canvas.toDataURL, for that, I need the id of the first canvas, but does not generate primefaces ID.
So I can not use this solution.
After spending hours and did not find the solution, I ask me.
It is possible to export a chart to an image, when they are in a datatable?
I am making a very simple datatable with JSF 2.0 tag dataTable but for some reason the page paginator is not displayed. Why is that?
<p:dataTable var="garbage" value="#{resultsController.allGarbage}" paginator="true" rows="10">
<p:column>
<f:facet name="header">
<h:outputText value="Filename" />
</f:facet>
<h:outputText value="#{garbage.filename}" />
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Description" />
</f:facet>
<h:outputText value="#{garbage.description}" />
</p:column>
<p:column>
<f:facet name="header">
<h:outputText value="Upload date" />
</f:facet>
<h:outputText value="#{garbage.uploadDate}" />
</p:column>
</p:dataTable>
Use p:dataTable instead of h:dataTable.
The pagination only works with the primefaces dataTable and not with the plain jsf dataTable.
The paginatorAlwaysVisible is an attribute of the primefaces datatable implementation, so you would have to use the datatable tag from the primefaces namespace: p:dataTable.
Edit: Also, you need a h:head element defined in your page, so that the jsf impl knows where to output additional scripts and stylesheets. If that is the case you should be seeing an error message like:
One or more resources have the target of 'head', but no 'head' component has been defined within the view.
To help debuging you could add the following context parameter to your web.xml:
<context-param>
<param-name>javax.faces.PROJECT_STAGE</param-name>
<param-value>Development</param-value>
</context-param>
#sfrj: You probably need something like this:
<p:dataTable var="garbage" value="#{resultsController.allGarbage}" paginator="true" rows="10" paginatorPosition="bottom" paginatorTemplate="{FirstPageLink} {PageLinks} {LastPageLink} {RowsPerPageDropdown}" rowsPerPageTemplate="5,10,15,20" paginatorAlwaysVisible="false">
paginator="true" only tells the p:dataTable component that you want the paginator control but you haven't specified what you want in it yet. Hence, you need the paginatorTemplate attribute. The paginatorAlwaysVisible="false" attribute is good aesthetically if your query returns no record - in which case, the paginator section won't be shown if there are no record. Else, it's visible if there is at least one record returned from your query.