Am i missing something or PF 12.0.0 DataTable selection is not working as expected when using disabledSelection?
client-side does not have any CSS class to differentiate between selectable an non-selectable rows
select all checkbox in column header (<p:column selectionMode="multiple">) selects all rows (not just selectable ?!) - by this i mean, browser is sending form parameter myForm:myTable_selection:#all and then server sets every list item from value to selection - at the same time, only selecteble rows are checked on client side
If selectionMode=multiple is present in p:dataTable then it's not working at all (by 'not working at all' i mean client-side checkboxes are all disabled without console error logs)? Only if selectionMode is omitted it's working but still, because of 2) i need to filter out rows on server side manually
I'm using something like this (without Ajax events for row select)
<h:form id="tblForm">
<p:dataTable id="myTable" widgetVar="myTableWv" value="#{myBean.list}" var="item" size="small"
sortBy="#{myBean.defaultSort}" filterBy="#{myBean.defaultFilter}"
selection="#{myBean.listOfSelected}" selectionPageOnly="false"
rowKey="#{item.id}" disabledSelection="#{myBean.shouldDisable(item)}">
<p:column selectionMode="multiple" />
<p:column>
<f:facet name="header">
<p:commandButton process="#this myTable" action="#{myBean.doSomethingWithSelectedItems}" />
</f:facet>
</p:column>
</p:dataTable>
</h:form>
Edit: 12.0.2 release notes are saying 1) is solved
Edit2: It's not working only when selectionPageOnly=false is used
OK turns out it was a similar issue to previously reported. The issue was not checking if the selection was also disabled!
Fixed here for 13.0: https://github.com/primefaces/primefaces/pull/9553
Related
In a project, I have to merge two datatables (the first to set the header of the second and the second displaying the informations contained in an uploaded file) into one to simplify the legibility on the page.
Since the first datatable was using a cellEditor I tried using one in the merged one the following way for the header:
<f:facet name="header">
<p:cellEditor>
<f:facet name="output">
<h:outputLabel id="output" value="some text" />
</f:facet>
<f:facet name="input">
<p:selectOneMenu value="#{handler.selectItems}">
<!-- List of selectItems -->
<p:ajax event="change" update="output" />
</p:selectOneMenu>
</f:facet>
</p:cellEditor>
</f:facet>
But when I build the project and click on the header of my columns, I don't have any list of selectItems appearing to give me the possibility to change the header. It was used in <p:column> before without problem so I imagine the <f:facet> is the problem
I succesfully made the possibility to change the value of the header using <p:inplace> instead, but it doesn't behave exactly like I want.
I want that even if I don't modify the value when I click on the header (and make the list appears), I can click somewhere on the page and make the list disappear to have a "clean" header. I don't really want to use the editor="true" option of inplace because the goal is also to try to reduce the number of click needed for the user. I also made it a bit using <p:ajax event="blur" update="output" /> but some value of the list of selectItems make one or two inputText appear. And with that event, when I click in the text box, it closes the field automatically and I can only the value of the field once. After, the moment I click on the list to open it, it closes the field.
How can I fix that ?
I have a primefaces datatable with a number of rows, known at runtime. Each row has a checkbox in the first column. The footer of the table contains a commandButton which I want to be disabled, if none of the checkboxes are selected. Otherwise it should be enabled.
The table looks roughly like this:
<p:dataTable id="table"
value="#{allgSucheController.pstListe}"
selection="#{allgSucheController.selectedPruefstelle}"
var="pst"
lazy="true">
<p:column id="checkboxes_header">
<f:facet id="container1">
<h:selectBooleanCheckbox id="chk_all">
</f:facet>
<h:selectBooleanCheckbox id="checkbox"
value="pst.selected">
</h:selectBooleanCheckbox>
</p:column>
<!-- snip -->
<f:facet name="footer">
<span id="c_dwl">
<h:commandButton id="btnDownload"
value="Download"
ajax="true"
disabled="???">
</h:commandButton>
</span>
</f:facet>
</p:dataTable>
I tried to set the value of the disabled attribute of the command button to pst.selected, but it didn't work. The command button was disabled, but did not get enabled if I checked any checkboxes.
It tried to call a method in the controller which loops over the row data of the table returning true if at least one is selected, but that did not work either because I can not call methods from xhtml.
I am new to jsf and I could not find any solution to my problem on the internet.
How can I have my button disabled if none of the checkboxes are checked and enable it if at least one checkbox is checked?
I'm working on a PrimeFaces project, where I choose to use a p:DataTable inside a p:DataGrid. The DataTable has the selectionMode attribute set to "multiple". I have a button on the page and when I click on it, I want to get all the selected checkboxes inside the various generated tables. All the checkboxes bring the same type of information (they are in different tables because of an information grouping scheme I use in the project).
Since I have multiple DataTables in the final rendered page, how can I get the selected checkboxes? I tried using the selection="#{myBean.selectedOptions}" attribute of the DataTable, but it seems to get just one of the generated tables' selected options (aparently the first one). What can I do to get the selected options of all tables generated by the p:DataGrid? Javascript? Is there any point I'm missing in the DataTable behavior?
(Well.. I don`t know whether I was able to make myself clear enough - English is not my native language).
[edited]
More information:
The number o DataTables generated is variable
I tried using the jsf visit method to traverse the user interface component view as shown here, looking for all checkboxes inside the DataGrid, but it couldn't find any of the checkboxes (I printed out to the console all the elements found). I think it's because the checkboxes are encapsulated in DataTable component. This made me think about not using the selectionMode="multiple" and, instead, manually add the checkboxes and a hidden input element for each one so I can find the checkboxes (or the "input hidden") using the visit method. The sad part of this aproach is that I'd have to stop using some good stuff of the DataTable selectionMode="multiple" feature, like hilighting the row if the corresponding checkbox is checked, and the ready to use "check all" checkbox it automatically put in the header of the ckeckboxes column.
I tried using a nested List in the selection attribute, but it didn't work. The main idea was using something like selection="#{bean.myListOfLists.get(t.counter)}". The "counter" variable is taken from the very object that is used to fulfill the current row of the DataTable (represented by the t variable in the attribute var="t"). The DataTable seems to not accept this approach. It doesn`t fulfill the nested lists.
I tried using the above approch with a modification: instead of a list of lists, a build a new class "B" and made a list of B (selection="#{bean.myListOf_B_Objects.get(t.counter).listInsideBObject}"). The result is simliar to the last approach: none of the lists inside the B objects were fulfilled.
Below there is a simplified view of what I did (more similar to the last case, but it's just to get the big picture)
<p:dataGrid var="gridCellContent"
value="#{myBean.dataGridContent}"
layout="grid" id="id01" columns="3"">
<p:dataTable var="something"
value="#{gridCellContent.listOfSomething}"
rowKey="#{something.id}"
selection="#{myBean.listOf_B_Objects.get(gridCellContent.counter).listInside_B_Object}">
<p:column selectionMode="multiple" />
<p:column>
<h:outputText value="#{something.sometext}" />
</p:column>
</p:dataTable>
<f:facet name="footer">
<p:commandButton id="btnSave" value="Save"
actionListener="#{myBean.btnSave}"/>
</f:facet>
</p:dataGrid>
[edited 2] Following #JaqenH'ghar's sugestion I tried out the modifications below, which unfortunately still din't work:
<p:dataGrid var="gridCellContent"
value="#{myBean.dataGridContent}"
layout="grid" id="id01" columns="3"
rowIndexVar="count">
<p:dataTable var="something"
value="#{gridCellContent.listOfSomething}"
rowKey="#{something.id}"
selection="#{myBean.listOfLists.get(count)}">
<p:column selectionMode="multiple" />
<p:column>
<h:outputText value="#{something.sometext}" />
</p:column>
</p:dataTable>
<f:facet name="footer">
<p:commandButton id="btnSave" value="Save"
actionListener="#{myBean.btnSave}"/>
</f:facet>
</p:dataGrid>
And for myBean:
#ManagedBean
public class MyBean {
...
private List<List<Something>> listOfLists = new ArrayList<List<Something>>();
public List<List<Something>> getListOfLists(){
this.listOfLists.add(new ArrayList<Something>());
return this.listOfLists;
}
public void setListOfLists(List<Something> listOfSomething) {
this.listOfLists.add(listOfSomething);
}
...
}
Using PrimeFaces 5.0.
My datatable uses lazy loading and live scrolling and I try to filter both fields:
<p:dataTable id="eventsTable" value="#{eventController.eventModel}" var="event" lazy="true"
scrollRows="100" liveScroll="true" scrollable="true" scrollHeight="500">
<p:column headerText="EID" filterBy="#{enent.eid}">
<h:outputText value="#{event.eid}" />
</p:column>
<p:column headerText="Type" filterBy="#{event.type}">
<h:outputText value="#{event.type}" />
</p:column>
</p:dataTable>
The initial load retrieves data correctly, and live scrolling seems to work fine.
But when I try to filter one of the fields the datatable is completely emptied (It does not even show the "No records found" message). When I debug I can see that my queries are executed correctly and return data.
Also, If I switch using paging instead of liveScroll, pages are lazy loaded correctly and filters also work.
Any thoughts?
You must set the rows attribute of the datatable.
How can I clear global filter in PrimeFaces DataTable using "Clear" CommandButton? I found similar question on PrimeFaces forum, but looks like not answered - the tip one can find there didn't help me. I tried to solve the problem as follows:
<p:dataTable id="myTab" widgetVar="myTabWidgetVar" var="obj"
value="#{managedBean.objects}">
<f:facet name="header">
<p:outputPanel>
<h:outputText value="Search all fields:"/>
<p:inputText id="globalFilter" onkeyup="myTabWidgetVar.filter()"/>
</p:outputPanel>
</f:facet>
</p:dataTable>
<p:commandButton value="Clear" onclick="myTabWidgetVar.clearFilters();"
update="#form"/>
It clears column filters only. Value in global filter remains uncleared. Can you help me to solve the problem?
Here is how:
$("#someFormId\\:myTab\\:globalFilter").val("").keyup();//if you got `prependId="false" , than omit the `someFormId\\:` part from the selector and leave only `myTab\\:globalFilter`
This will fill your filter with empty string and trigger a keyup event , resulting in clearing your filter and clearing the filter state of the table
If you just want to clear the filter without resetting the filter applied to your table use
$("#someFormId\\:myTab\\:globalFilter").val("");
If you want to use this code in a commandButton there is no need to use ajax (update...)
Just use onclick like this
<p:commandButton value="Clear"
onclick="$('#someFormId\\:myTab\\:globalFilter').val('').keyup(); return false;"/>
use return false; so the button wont submit your page...
<pdataTable widgetVar="departments" />
<p:commandButton value="#{lang:text('Add department')}"
id="....."
actionListener="....."
update="#form"
oncomplete="PF('departments').clearFilters()"
styleClass="........."/>
It works in my case for prime faces
Primefaces datatable has "filteredValue" option. Let's assume you set filtered values like; filteredValue="#managedBean.filteredObjects}".
filteredObjects has the same type with datatable's value which is "managedBean.objects" in your case. Before you load datatable, set filteredObjects variable to NULL. It will solve your problem.