I am migrating my application UI which is written in richfaces into primefaces.
We have a commandlink in a code which opens up a panel directly using rich:toggleControl inside a rich tab in rich tabPanel.
<a4j:commandLink style="color:blue; text-decoration: underline; font-size:8pt;font-style: italic;" value="Yearly calculation link (click here)" >
<rich:toggleControl targetItem="#next" targetPanel="yearlyCalculationPanel" />
</a4j:commandLink>
This command link opens the particular panel in an another tab directly.
Does primefaces have an alternate to this particular functionality?
Related
Environment: JSF 2.2.14, PrimeFaces 6.2
I have my command button set up as below, when the button is disabled, title will show up (when hovered over) in PF6.1, but won't show in PF6.2
<p:commandButton id="removeCmd" icon="fa fa-times"
actionListener="#{controller.remove()}"
update="#form"
disabled="#{ontroller.isCommandDisabled()}"
style="width: 20px; height:20px;margin-left: 5px;"
title="#{controller.isCommandDisabled() ? 'Command disabled due to user privilege' : 'remove selected item'}"
onstart="PF('bui').show(); PF('bar').show();"
oncomplete="PF('bui').hide(); PF('bar').hide();"
styleClass="removeCmd"/>
Title show up fine when button is not disabled.
Does anyone encounter the same problem? I also tried to wrap my p:commandButton inside h:panelGrid and use p:tooltip with it, not working either.
UPDATE: issue created on github: https://github.com/primefaces/primefaces/issues/3656
By nature I'm curious (and I follow the changes in PrimeFaces a little). If the title of a button does not work anymore between 6.1 and 6.2 I start analyzing a little. The generated html for a button in both PrimeFaces versions is identical. This makes me think whether it would have stopped working for other components as well. So I created a simple page
<p:inputText title="myInput enabled" />
<p:inputText title="myInput disabled" disabled="true"/>
And the behaviour change between using PrimeFaces 6.1 and 6.2 was the same. Title working for both in 6.1 and only for the first in 6.2. Since there was a major jquery change between PrimeFaces 6.1 and 6.2, I posted 'jquery show title tooltip of disabled inputs and buttons' in google.
One of the hits was:
Show tooltip for disabled items
In it there was a reference to some css(!) that disables dom events and consequently not showing titles.
pointer-events: none;
I opened my browser developer tool and in the filter part in the css tab, I put 'pointer'. When using 6.1, there was nothing there, but in 6.2 there was.
.ui-state-disabled {
cursor: default !important;
pointer-events: none;
}
Which seems to be coming from the components.css file (according to my browser developer tool). This is not a file that exists in the PrimeFaces repository but one that is created when the PrimeFaces release is build via maven:
One of the files that is included here is the jquery-ui.css and in it is the piece of css referenced above.
When I disabled the corresponding pointer-events: none in my browser developer tool, the titles became visible both for the input and the button.
So if you want to override this, please set this to 'all' (or any other value of your liking).
html .ui-state-disabled {
pointer-events: all;
}
See also
How do I override default PrimeFaces CSS with custom styles?
I am implementing a gallery using PrimeFaces with the component p:galleria, everything works as expected but the footer (Film Strip) is shown twice.
By the way, if I close and then reopen the modal dialog which contains the gallery the Film Strip displays correctly.
More Information:
The gallery is contained in a modal dialog
PrimeFaces version: 5.3
Browsers: Chrome and IE
Any help is appreciated
I have resolved this behavior with the next workaround...
I had to open the external dialog using onclick() event instead of oncomplete()
Greetings!!!!
I already have onclick but the filmstrip still gets doubled.
A working workaround for me is to update the galleria when the dialog is shown, e.g.
<p:commandLink onclick="PF('popup').show();" update="galleria"/>
<p:dialog id="popup">
<p:galleria id="galleria"/>
</p:dialog>
I have added PrimeFaces p:editor component on my form and defined controls for it like this:
<p:editor id="editorId" value="#{someBean.SomeText}"
controls="bold italic paste pastetext" width="800" height="150" rows="6"
disabled="#{not someBean.editorEnabled}"
autoResize="false" onchange="submitSomething()" />
And as you can see in the attached image the paste button is disabled. So i wonder how can you enable this button?
I'm running PrimeFaces 6.0 on WebSphere Application Server 8.5.
I get the same issue on primefaces showcase:
http://www.primefaces.org/showcase/ui/input/editor.xhtml
using
Firefox 49.0.1 and Chrome 53.0.2785.143.
In a html page I have a h:commandButton that I want to make it to work in combination with a h:selectBooleanCheckbox, so every time I press the button the checkbox will be checked and otherwise.
Is it possible to do that directly in the html, and not in the java code behind it?
<h:commandButton value="#{userBean.buttonText()}" action="#{userBean.changeOutput()}"/>
<h:panelGrid columns="4" rendered="#{userBean.details}" styleClass="clicked" >
<h:outputText .... />
<h:outputText ..../>
</h:panelGrid>`
If you are using JSF 2, you have to update the area that include your checkbox, using f:ajax tag.
You can find a lot of examples here in stackoverflow, look this example just hide/show a div: After showing / hiding a JSF element with AJAX how to hide the triggering element?
Hope it helps.
I have a Primefaces editor on my page and I want to submit the content to the server when the user focuses on a different component on the page.
<p:editor value="#{}">
<p:ajax />
</p:editor>
This works find for example with p:inputText, but with the editor I get this error:
Unable to attach <p:ajax> to non-ClientBehaviorHolder parent
I also tried adding the onchange attribute to the p:editor and calling a remoteCommand to submit the content, like this:
<p:editor widgetVar="documentation" onchange="submitDocumentation" />
<p:remoteCommand name="submitDocumentation" process="#parent" update="#none" />
That works, but on every single keystroke. I only want to submit the content of the editor when the focus is lost.
Is it possible to use Ajax to submit the content of a Primefaces Editor when focus is lost?
Using Tomcat 7, Mojarra and Primefaces 4.0
You can do it in the next way.
$(document).ready(function() {
//documentation is the editor widgetVar
PF('documentation').jq.find("iframe").contents().find('body').blur(function(){
submitDocumentation();//remoteCommand
});
});