I am using Primefaces 3.0.M4, 12/1/2011 build with JSF 2.0, web application. CheckAll checkbox in table header to toggle multiple selection checkboxes does not work in any browsers i tested in. I tried it in IE7, Firefox 5.0 in windows. Firefox 7 in ubuntu. No luck.
<p:dataTable id="blocksTable"
var="block" value="#{splitBlockBean.blockDataModel}"
selection="#{splitBlockBean.selectedBlocks}"
scrollable="true" scrollHeight="230" scrollWidth="410">
<p:column selectionMode="multiple"/>
<p:column style="width:300px;" headerText="Subnet Address">
#{block.label}
</p:column>
</p:dataTable>
Now, If I remove scrollbars around this table, it works fine. But not with scrollbars. I need scrollbars as this table can display records upto 256 and users wants to able to select all at one go without having to use paginator.
Interesting aspect I found in datatable.js is that JQuery does not return checkAllToggler checkbox if the table is surrounded by a scrollbar. Here's is the snippet from datatable.js
this.checkAllToggler = $(this.jqId + ' > table thead th.ui-selection-column input:checkbox');
this.checkAllToggler.bind('click', function() {
_self.toggleCheckAll();
});
Any help is apprecaited.
You need to use a recent 3.0.RC1 build, more info http://code.google.com/p/primefaces/issues/detail?id=1552
Related
I am doing mobile conversion of our website using PF mobile. In that I am trying to open views in a dialog using Primefaces mobile. It works just fine in desktop browser but not in mobile version. The page keeps waiting to load but nothing happens. Is it not implemented in PF mobile or is something wrong with my code?
Following is the view - webapp/m/dlg/sampledlg.xhtml
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"xmlns:h="http://java.sun.com/jsf/html"xmlns:f="http://java.sun.com/jsf/core"xmlns:p="http://primefaces.org/ui"xmlns:pm="http://primefaces.org/mobile"><f:view renderKitId="PRIMEFACES_MOBILE" /><h:head></h:head><h:body><pm:page id="main"><pm:header title="Main Page">/pm:header><pm:content><p:link outcome="pm:second" value="Go" /></pm:content></pm:page><pm:page id="second" lazy="true"><pm:header title="Second Page"></pm:header><pm:content>Sample content</pm:content></pm:page></h:body></html>
Following is the code from the backing bean.
RequestContext.getCurrentInstance().openDialog("dlg/sampledlg");
return;
Also basic dialog like the following that displays only a message doesnt work either in mobile pages. It works in desktop though.
RequestContext.getCurrentInstance().showMessageInDialog("This is sample text");
face-config.xml has the following:
<navigation-handler>
org.primefaces.application.DialogNavigationHandler
</navigation-handler>
<view-handler>org.primefaces.application.DialogViewHandler</view-handler>
<navigation-handler>org.primefaces.mobile.application.MobileNavigationHandler</navigation-handler>
I can absolutely add more information if needed. Any help here is much appreciated. Thank you in advance.
Here is my platform information:
- Tomee 7.0.0 M3
- Primefaces 6.0
- Jsf 2.2.12
- Jdk 1.7
- Jee 7
Working solution:
bean:
...
RequestContext.getCurrentInstance().execute("PF('dlgDelete').show();");
xhtml:
...
<p:dialog header="confirmation" widgetVar="dlgDelete" >
<p:outputLabel value="Are you...?"/>
<p:commandButton value="yes" action="#{appBean.deleteMethod()}" update="tblParts" oncomplete="PF('dlgDelete').hide();" icon="ui-icon-check" iconPos="right" styleClass="ui-btn-inline"/>
<p:commandButton value="no" onclick="PF('dlgDelete').hide();" icon="ui-icon-forbidden" iconPos="right" styleClass="ui-btn-inline"/>
</p:dialog>
I am using Primefaces 5.1 and I have a dashboard where I can drop components onto it.
But, when I drop a component on I want a different component to be rendered.
Here is my dashboard, and the panel component that is cloned and dropped onto the dashboard.
<p:dashboard id="board" model="#{dashboardBean.model}" binding="#{dashboardBean.dashboard}">
<p:ajax event="reorder" listener="#{dashboardBean.handleReorder}" update="msgs" />
</p:dashboard>
<p:panel id="draggable">
<h:outputLabel value="Drag Panel Into Dashboard"></h:outputLabel>
</p:panel>
<p:draggable for="draggable" helper="clone" dashboard="board"/>
Now I can trigger a capture the 'reorder' event and change the 'model' to replace it with the correct component on the java side. But the Dashboard does not get re-rendered at this point.
I can add a command button to trigger the re-render...
<h:commandButton value="Refresh" action="#{dashboardManagedBean.refreshChart}"/>
But I want this to happen automatically.
Can anyone offer some advice please.
(comment promoted to answer)
What if you referesh the component from handleReorder() using this RequestContext.getCurrentInstance().update("foo:bar")?
PF 3.5.10, Mojarra 2.1.21, JBoss 7.1.1, PE 7.1, Omnifaces 1.5
I want to use datatable row editing in a p:Dialog.
I have a datatable with a row editing in a Dialog. (Showcase: http://www.primefaces.org/showcase/ui/datatableRowEditing.jsf)
If I click "OK" on the Dialog the changes should be saved, and if I click "Cancel" the changes will be dismissed. If row editing for a row is activated and I can change the values in a row, and then I click "Ok" on a Dialog, the active changes in a row will be lost.
How can I retrieve an actual status of editing ? How can I know if a row in a datatable is currently edited ? If i know that I can warn User that the changes will be lost.
Edit: link to PF sources Grepcode: PF sources isEditingRow()
<p:dialog>
<h:form>
<p:tabView cache="false" id=.. binding=..>
<p:tab>
<p:dataTable binding=.. id=... widgetVar=... var=.. >
</p:dataTable>
</p:tab>
</p:tabView>
<p:commandButton process="#form" action="myBean.listener()" value="OK" update="#form"
onstart="anotherTable.filter()" />
</h:form>
</p:dialog>
Edit: I accepted the answer because I implemented the required feature myself.
Either you bind the component to your backing bean, or write your own buttons that trigger editing mode which will also set a flag in the backing bean that you can use to determine the status of editing.
Binding the component is probably the easier option...
My main jsf include 2 jsf’s where in each one of them there is a table with filtering option.
this is a short example from the main:
<h:panelGroup id="b1">
<p:commandButton
value="exe"
actionListener="#{bean.handle}"
rendered="#{bean.render}"
update=":mainForm:panel1,:mainForm:panel2">
</p:commandButton>
</h:panelGroup>
</h:panelGrid>
</p:panel>
<ui:include src="table1.xhtml" />
<ui:include src="table2.xhtml" />
The problem is that I need to remove the filters when changing the view between the 2 tables
I can’t use the client side via clearFilters since I have 2 tables:
<p:commandButton
oncomplete="table1Widget.clearFilters() ????"
so I was thinking that the best place will on the server side via handle method but the filter list is empty and also the table
DataTable dt1 = (DataTable) FacesContext.getCurrentInstance().getViewRoot().findComponent("mainForm: .... ");
How can i reset the filters ?
Thanks
I have 2 datatables at my session. I didn't understand reason but when i use dt1.reset() it resets both of them.
I tried
dt1 = new DataTable();
and it solved my problem.
Note: dt1.reset() works when i tried with 1 datatable.
You can use either of the following on that datatable that you have:
dt1..setFilters(null); Will get rid of the datatable filter values
dt1.reset() will also reset the datatable to a virgin state
Use the Primefaces current helper (version 6.2) to execute clearFilters on the server side as below:
PrimeFaces current = PrimeFaces.current();
current.executeScript("PF('dataTableWidget').clearFilters()");
I am stuck over a problem While dealing with primefaces charts.
Problem
When I click on a lineChart, a dialogue should appear which contains another linechart.
Sample Code
<p:lineChart id="chartOne" rendered="cond1"/>
<p:dialog widgetVar="dialogOne">
<p:lineChart id="chartTwo" rendered="cond1"/>
</p:dialog>
<script>
$('#chartOne').bind('jqplotClick',
function (ev, seriesIndex, pointIndex, data) {
dialogOne.show();
}
);
</script>
Now I am able to display dialogue on chart click but chart inside dialogue is not refreshing. I don't know much about refreshing content through JavaScript function.
Update1:
Condition is: chartOne should provide click over its whole canvas(not only datapoints or series). chartTwo should be rendered only if dialogOne.show() happens.
Any help...Much appreciated
It might be a solution to use a dynamic dialog.
From the documentation:
Dynamic mode allows dialog to fetch it's contents beforeit's shown rather than on page load which is useful to reduce initial page load times. Default is false.
Just define your dialog like this:
<p:dialog widgetVar="dialogOne" dynamic="true">
Update:
To refresh the dialog from Javascript you can use p:remoteCommand. Example:
<h:form id="formId">
<p:dialog id="dialog" />
</h:form>
<p:remoteCommand name="updateDialog" update=":formId:dialog"/>
Second update:
To use the p:remoteCommand call updateDialog() from Javascript.
Try this:
<p:lineChart id="chartOne" rendered="cond1" >
<p:ajax event="itemSelect" listener="#{bean.action}" update="chartTwo" oncomplete="dialogOne.show()" />
</p:lineChart>
<p:dialog widgetVar="dialogOne">
<p:lineChart id="chartTwo" rendered="cond1"/>
</p:dialog>
on the method action() of your backing bean, you should ready the data for chartTwo.
The clickable part of the chart, as per the user manual, would be the series, not the entire chart. check
http://www.primefaces.org/showcase-labs/ui/interactiveCharts.jsf
for more information and a working example.