I am using Primefaces 5.3 version . For picklist component having lot of values scrollbar does not appear in IE preventing viewing all the values.
Below is the pciklist component code,
<p:pickList value="#{sublocation.secureAreaDualList}"
var="zone" styleClass="noupdate" converter="entityConverter"
showSourceFilter="true" showTargetFilter="true"
filterMatchMode="contains"
itemValue="#{zone}" itemLabel="#{zone.code} - #{zone.displayName}" responsive="true" process="#this" update="#this">
<p:ajax event="transfer" listener="#{requestMBean.onTransfer}" update="#this" />
</p:pickList>
What css should be overriden to display scroll bar in IE browser ?
Related
I am using a primeface dataTable and the primeface rowEditor. As tooltip for the deleteLink I use a primeface tooltip.
The primeface tooltip doesn´t look like the rowEditor tooltip. Is there a possibility that they look same?
<p:column style="width:32px">
<p:rowEditor editTitle="Bearbeiten" saveTitle="Speichern" cancelTitle="Abbrechen" />
</p:column>
<p:column style="width:32px">
<p:commandLink id="deleteLink" styleClass="ui-icon ui-icon-trash" action="#{SFKBean.deleteStrasse(str)}" update="strList, :sdform:msgs" />
<p:tooltip id="deleteLinkTT" for="deleteLink" value="Straße entfernen" position="bottom" />
</p:column>
That's how it looks
rowEditor '...title' tooltips are browser tooltips. p:tooltip generates non-browser tooltips that (can by design) are not easily made to look like browser tooltips (different for each browser) and are meant for components that doe not support browser based tooltips. If you want a 'normal' tooltip, use the title attribute on the p:commandLink
<p:commandLink id="deleteLink" styleClass="ui-icon ui-icon-trash" action="#{SFKBean.deleteStrasse(str)}" update="strList, :sdform:msgs" title="Straße entfernen" />
If you do want to style the p:tooltip like browser native ones, add a styleClass attribute to it and make selectors that are specific for browsers (might require some javascript)
I have curious rendering problem. I'm trying to attach overlay panel with the button. When I press the button, panel is rendered. However a sub-component in the panel is not. When panel is visible and I do double click on the button, sub-component get's rendered. In the same time, when panel is not rendered and I do double click, sub-component is not rendered (and panel not displayed).
Generated html and computed CSS is the same for both painted/non-painted components.
Do you know where the problem can be? Am I missing some setting? Have I overlooked something or is it a bug?
PrimeFaces template:
<p:layoutUnit position="center">
<h:form>
<p:commandButton id="chooseLangBtn" value="Btn" type="button" />
<p:overlayPanel id="langPanel" for="chooseLangBtn" showCloseIcon="true" dismissable="true">
<p:selectOneListbox id="langSelect"
rendered="true"
value="#{selectOneLanguageView.language}"
converter="languageConverter"
var="t" filter="true"
filterMatchMode="startsWith">
<f:selectItems value="#{languageService.languages}"
var="lang"
itemLabel="#{lang.name}"
itemValue="#{lang}" />
<p:column>
<h:graphicImage width="22px" alt="#{lang.name}" library="main" name="images/flags/var/#{t.code}.svg"/>
</p:column>
<p:column>
<h:outputText value="#{t.name}" />
</p:column>
</p:selectOneListbox>
</p:overlayPanel>
</h:form>
Empty/Rendered images:
It's a bug in the Omega theme. See current status here: https://github.com/primefaces/themes/issues/10
I need an answer to exactly this question posted in 2013 please.
I have a PrimeFaces menuitem with a url attribute that calls an xhtml, that 'defines' content to go into a layoutUnit. When clicked, the entire page doesn't reload, just the layout unit.
How do I display a PrimeFaces Extensions blockUI component when the menuItem is clicked?
I've tried:
<p:menuitem value="Users" url="/users.xhtml" onstart="PF('blockUIWidget').block()" oncomplete="PF('blockUIWidget').unblock()"/>
where the blockUIWidget is:
<pe:blockUI widgetVar="blockUIWidget">
<h:panelGrid columns="2">
<h:graphicImage library="images" name="loading.gif"/>
<h:outputText value="Loading"/>
</h:panelGrid>
Note, this widget works as expected from a commandButton:
<p:commandButton value="Login" action="submit" onstart="PF('blockUIWidget').block()" oncomplete="PF('blockUIWidget').unblock()"/>
I have the following code:
<p:tree value="#{sessBean.root}" var="node" animate="true" id="idTree" selectionMode="single" selection="#{sessBean.selectedNode}" >
<p:ajax listener="#{reqBean.doBtnSearch}" event="select" onstart="PF('tblDataWidget').clearFilters();" update=":form1:tabView:tblData" />
<p:treeNode>
<h:outputText value="#{node.descr}" />
</p:treeNode>
</p:tree>
<p:commandButton value="Add" icon="ui-icon-plus" id="doBtnAdd" action="#{reqBean.doBtnAddEntry}" update="tblData" oncomplete="PF('tblDataWidget').clearFilters();" />
I have a dataTable (tblData) with many entries, which are loaded and displayed when a tree node is clicked. So far, no problems. Datatable has filters on some columns, which also works fine. The problem appears, when I want to clear the filter (on button and tree node click). When I click the 'Add' button (see the code above), the filters are cleared as expected, but when I click on a tree node, clearing the filters doesn't work. Both commandButton and tree component are contained in a tabView container.
What am I doing wrong?
Thank you for your suggestions!
PS: using PrimeFaces 5.1
Try it :
<p:ajax listener="#{reqBean.doBtnSearch}" event="select" onstart="PF('tblDataWidget').clearFilters();" update="#{p:component('tblData')},#{p:component('idTree')}" />
I need a rich:popup that shows a rich:extendedDataTable, and when the user presses a button, the popup should be shown, and the extendedDataTable must be re-rendered, here is the code:
<rich:popupPanel id="popupId" show="false" modal="true">
<h:form>
<rich:extendedDataTable
value="#{bean.list}"
var="item" rows="5" id="table">
<rich:column>
<h:outputLabel value="#{item}" />
</rich:column>
</rich:extendedDataTable>
<a4j:commandButton value="x" immediate="true"
oncomplete="#{rich:component('popupId')}.hide(); return false;"/>
</h:form>
</rich:popupPanel>
<h:form>
<a4j:commandButton value="show"
oncomplete="#{rich:component('popupId')}.show(); return false;"
render="table" immediate="true" />
</h:form>
The first time I press the show it works fine, but when I close the panel with the X button and press again the show button, the extendedDataTable appears empty (It's rendered but appear empty, see image below).
The problem is fixed if I add an empty extendedDataTable before the popup, like this:
<rich:extendedDataTable />
<rich:popupPanel>
...
With rich:dataTable the problem doesn't exits, but I need a extendedDataTable.
And aditional extrange behaviour is when I resize the browser, the data appears.
Platform
RichFaces: 4.2.2.Final
Spring: 3.1.1.RELEASE
Cheers
Use onclick instead of oncomplete. ExtendedDataTable doesn't render properly inside invisible elements (it's a bug) so the popupPanel has to be made visible before the rerendering.
I had kinda the same issue.
I solved it in a not 100% richface correct way:
<a4j:commandButton
value="show"
action="#{actionForm.setShowEditor('true')}"
oncomplete="javascript:location.reload(true)"/>
<a4j:region layout="block" rendered="#{actionForm.showEditor}" id="panelArea">
<rich:popupPanel id="#{popupID}" modal="true" show="true" domElementAttachment="parent">
....
tabel
buttons
....
</rich:popupPanel>
</a4j:region>
The popup is always shown (show="true") inside the a4j:region.
But the a4j:region is only shown if variable to show the popup = true.
The full page refresh was in my case needed because otherwise my ckeditor had some initialisation errors. It should also work if you only rerender the a4j:region after you set the "#{actionForm.setShowEditor('true')}.