PrimeFaces Datatable filtering removed when sorting with o:form includeRequestParams="true" [duplicate] - primefaces

This question already has answers here:
How to choose the right bean scope?
(2 answers)
Closed 4 years ago.
this is an issue following this one: PrimeFaces datatable.filter() and url parameter
is use PrimeFaces-5.1 and omnifaces-2.1 to render a datatable with pagination, filtering and sorting while using request parameters.
my datatable is constructed like this:
<o:form includeRequestParams="true">
<p:dataTable id="hostStateHistoryTable" value="#{HostHistoryBean.hostStateHistoryList}" var="status" widgetVar="statusTable"
filteredValue="#{HostHistoryBean.filteredHostStateHistoryList}"
rowStyleClass="#{status.state eq 0 ? 'up' : null} #{status.state eq 1 ? 'down' : null} #{status.state eq 2 ? 'unreachable' : null}"
rows="50" paginator="true" paginatorTemplate="{PageLinks} {RowsPerPageDropdown}" rowsPerPageTemplate="10,50,100">
<p:column sortBy="#{status.stateTime}">
<f:facet name="header">Start Time</f:facet>
<h:outputText id="Start" value="#{status.stateTime}" />
</p:column>
... all columns
</p:dataTable>
</o:form>
But Sorting is removing the PrimeFaces Datatable Filtering.
I can sort alone and filter alone without problem, but when i sort the datable after filtering it remove the filter. again Clicking on the same filter won't do anything but filtering on another value will display the expected result.
It seems that the o:form will resend the request, including attribute, instead of using the datatable filteredValue.
Edit:
I uploaded an eclipse based MCVE project here: http://www.dacave.fr/stackoverflow/test.faces.rar

Ok so i found out that filteredValue was reseted on each ajax call because of the #RequestScoped.
I think i was kind of mixing up things.
So i switched all #ManagedBeans to #Named
then i created a new #SessionScoped Bean with most of the attributes and i #inject a #RequestScoped bean with the request based attributes into it.
Now everything works as expected

Related

Primefaces commandButton is calling actionListener method but Not if having "rendered" attribute [duplicate]

This question already has answers here:
commandButton/commandLink/ajax action/listener method not invoked or input value not set/updated
(12 answers)
Form submit in conditionally rendered component is not processed
(1 answer)
Closed 11 months ago.
I am facing an issue with primefaces(version 8.0) commandButton like, whenever I'm using rendered attribute to satisfy some condition, the method inside actionListener is not firing. But if I don't use the rendered attribute, it is normally invoking the method. I wonder why it's behaving in this way and how can I resolve this.
The commandButton is as,
<p:commandButton value="Display" actionListener="#{dispManagedBean.display}" process="#this"
update="growlMessage" icon="ui-icon-circle-arrow-e" rendered="#{demoManagedBean.isDisplay}" >
<f:attribute name="dispId" value="#{demoManagedBean.dispId}" />
</p:commandButton>
This is not calling dispManagedBean.display method anyway. But if I remove the rendered="#{demoManagedBean.isDisplay}" , then it is hitting the method normally.
Again, I tried with disabled="#{not demoManagedBean.isDisplay}" condition, and again it is not working there too.
I tried with <c:if test=""></c:if> jstl condition, it is not invoking there also.
But I must use that condition, it is the business logic. I cant omit that. How can I achieve this?

Primefaces data table sorting and aligning

I want to build the web site footer dynamically from the Arraylist. I am using primefaces as UI.
The green image below is the one i want using primefaces so far i got the data table like image below (in blue and white).
This is the primefaces code i am using. Can someone give me an idea how i can have the primefaces data table or data list to build the footer like green image below.
In the footer2List i have "category" which as the header like (social media, community) and the "description" as the child data.
Thanks in advance.
<p:dataTable var="fot" value="#{footer2MB.footer2List}" sortBy="#{fot.category}">
<p:columnGroup type="header">
<p:row>
<p:column colspan="2">
<b><h:outputText value="#{fot.category}"/></b>
</p:column>
</p:row>
</p:columnGroup>
<p:column headerText="fotId" colspan="7">
<h:outputLink target="_new#{fot.url}" value="#{request.contextPath}#{fot.url}">
<h:outputText value = "#{fot.description}" />
</h:outputLink>
</p:column>
</p:dataTable>
It really feels like you are trying to put a round peg in a square hole when you are trying to (ab)use a datatable for this. The amount of css you would need to format it like you have shown is disproportionatly high compared to using two nested ui:repeats.
You seem to have the parent-child relation in one table. So if you have not already done so, start with modeling your own JPA entity like done in "JPA mapping for Parent-Child with same class" (if you are not using jpa, you need to write some code but that is also rather simple and straight forward)
Write JQL that retrieves the toplevel records: select r from MyRecord r where parent_id is null.
Then in pseudocode do:
<ui:repeat value="#{myBean.rootRecords}" var="rootRecord">
<h3>#{rootRecord.title}</h3>
<ul>
<ui:repeat value="#{rootRecord.children}" var="child">
<li>#{child.title}</li>
</ui:repeat>
</ul>
</ui:repeat>
Which is sort of what is done here: Displaying the values of a nested array list in JSF data table
One optimization you could look at is the either lazy or eager loading of the children in JPA. Another would be the use of p:cache... Primefaces p:cache
All plain and simple without the hassle of a datatable.
(off-topic: I am almost 100% sure you already spent more time trying to (ab)use the datatable and creating the question and discussing it with me than it would have cost if you did it directly in the way described in this answer ;-))

Duplicate ID in view with iterations and composite components

I have a strange error that only happens sometimes and I can't figure out what is going wrong.
I get the following error:
Component ID form_lpm:PODports:PODlocalChargeTable:j_idt1665:j_idt1667:chargeDiv has already been found in the view.
Okay we all know that you can't have duplicate IDs in JSF but that ID above doesn't actually exists!
I have something like this:
<ui:repeat id="PODport">
<p:dataTable id="PODlocalChargeTable">
<p:columns>
<my:compositeComp/>
</p:columns>
</p:dataTable>
</ui:repeat>
The composite component (my:compositeComp) has an ID chargeDiv in there.
So in the error message j_idt1665 is the dynamic ID for the p:columns iteration and j_idt1667 the ID for the composite component.
However in the actual generated HTML we get these IDs (as you would expect): The green counter is for the ui:repeat, the blue one for the dataTable and the orange one is for the p:columns.
At first this page is rendered fine (with the IDs shown above) but when I do an ajax request and update the form I get the error with the duplicate ID. The strange thing is that the counters are removed from that ID. Why is that and what can I do?
I have tried to specify IDs for the p:columns (dynCol) and the composite component (compId) and interestingly I now get pretty much the same error but one of the counters is still in the ID:
<ui:repeat id="PODport">
<p:dataTable id="PODlocalChargeTable">
<p:columns id="dynCol">
<my:compositeComp id="compId"/>
</p:columns>
</p:dataTable>
</ui:repeat>
Component ID
form_lpm:PODports:PODlocalChargeTable:dynCol:2:compId:chargeDiv has
already been found in the view
I had the problem with two different composite components. The components were basically just something like this:
<p:outputPanel id="chargeDiv">
content
</p:outputPanel>
<p:tooltip for="chargeDiv">
tooltip content
</p:tooltip>
I am using JSF 2.1 (Mojarra 2.1.29-08) and Primefaces 6.1.18
Update:
I have done a bit more testing and it is definitely related to the use of composite components.
If I have a very simple composite component:
<cc:implementation>
<p:outputPanel id="chargeDiv">
</p:outputPanel>
</cc:implementation>
and I have dynamic columns like
<p:columns var="myvar" value="#{bean.list}" id="dynCol">
<my:compositeComp/>
</p:columns>
I get the error with the duplicate ID.
If I use the content of the composite component directly in the p:columns:
<p:columns var="myvar" value="#{bean.list}" id="dynCol">
<p:outputPanel id="chargeDiv">
content
</p:outputPanel>
</p:columns>
then it works fine.

Primefaces Datatable in nested TabView

I'm using pf4.0 and jsf 2.2 for my webapp. Now I have a nested TabView containing a second TabView with a datatable. Like this:
<p:tabView>
<p:tab>
<p:tabView>
<p:tab>
<p:dataTable>
....
</p:dataTable>
</p:tab>
</p:tabView>
...
the problem now is that if i use a filter in the datatable the following js error occurs:Uncaught TypeError: Cannot read property 'outerHeight' of undefined
Does anyone out there have a solution? Haven't found anything regarding to this problem :(
UPDATE:
I tried to reproduce the problem in an simple application and I found out, that this error only occures when scrollable=true and scrollHeight=250px is set.
Anyone got an idea?

PrimeFaces PickList : two String fields filter

I was wondering if it's possible to have a two fields filter with a picklist of primefaces.
I tried this but it's not working. I would like to filter on firstname and name but they are in two different fields.
<p:pickList value="#{bean.usersDualModel}" var="user"
itemValue="#{user}" itemLabel="#{user.firstname} #{user.name}"
converter="user" showSourceFilter="true" showTargetFilter="true"
filterMatchMode="contains" >
<p:column>
<h:outputText value="#{user.firstname} #{user.name}" />
</p:column>
</p:pickList>
Thanks
In fact, I think it's possible because it's working know with the code I posted above. However, the Javascript method is easy to set up with two fields so I could have done it quickly. Thanks for the suggestion.
The reason it wasn't working the first time is that there is an bug in Primefaces for the picklist filter and it's not patched officialy. The filter mode stayed in startsWith whatever the value I entered.
So my picklist is still
<p:pickList value="#{bean.usersDualModel}" var="user"
itemValue="#{user}" itemLabel="#{user.firstname} #{user.name}"
converter="user" showSourceFilter="true" showTargetFilter="true"
filterMatchMode="contains" > ...
And there is a custom patch by know. Here is the link of the report.
https://code.google.com/p/primefaces/issues/detail?id=5234
This is not possible with the default component. However you can create a custom filter (example taken from Primefaces manual):
<p:pickList value="#{pickListBean.cities}" var="city" itemLabel="#{city}"
itemValue="#{city}" showSourceFilter="true" showTargetFilter="true
filterMatchMode="custom" filterMatchMode="myfilter">
</p:pickList>
function myfilter(itemLabel, filterValue) {
//Filter for firstname or name
//return true or false
}
Of course you can also create a custom component by extending the primefaces picklist or create two seperate inputtext fields and fire any filtering manually with javascript/jquery.