Primefaces 7.0, JSF 2.1.19
I am trying to replace richfaces 3.3.3 with primefaces 7.0 (and upgrade JSF to 2.1) and got a special behaviour from the fileUpload widget: When I first render the page it works without problems (no fileupload done, just render it), then I navigate again to the same page it is broken:
The fileupload component:
<p:fileUpload disabled="#{antragAttachments.fileUploadDisabled}" id="attachmentUpload" widgetVar="attachmentUpload" binding="#{antragAttachments.fileUpload}"
fileUploadListener="#{antragAttachments.fileUploadListener}" label="Durchsuchen..." uploadLabel="Datei anhängen" cancelLabel="Abbrechen" invalidFileMessage="test typ"
mode="advanced" fileLimit="1" sizeLimit="15728640" invalidSizeMessage="Der Dateianhang ist zu groß! Die maximale Größe beträgt 15MB!" previewWidth="1"
oncomplete="uploadComplete();" auto="true">
</p:fileUpload>
This is the (menu) component the navigate again to the xthtml:
<ui:repeat value="#{name}" var="item" >
<div id="menuOP" class="ebene#{item.shifting} #{item.selected ? 'divselected' : 'divnotselected'} #{item.spriteClass}">
<p:commandLink immediate="#{item.immediate}" value="#{item.label}" rendered="#{item.enabled}" action="#{item.navigate}"
styleClass="#{item.selected ? 'selected' : 'notselected'}" oncomplete="#{item.oncomplete}"/>
<h:outputText id="menuNoLinkText" rendered="#{!item.enabled}" styleClass="disabled" value="#{item.label}" />
</div>
</ui:repeat>
I tried to remove the immediate, set the type to "submit", use h:commandLink (without the oncomplete of course) just to see if I can get this running somehow. Does not work.
I also looked at the Primefaces fileupload introduction from balusC, but my problem is not the fileupload, it is the second rendering. There is also a Primefaces forum entry about something similar, but the trick von melloware did not work also.
What I do not understand, by the first click on the menu the rendering works fine and after every click on the menu-commandlink the browser console tells me that the widget is not available.
I found examples with similar problems, but there is most of the time a javascript call of the widget like PF('attachmentUpload').doSomething(), but this is not the case here.
EDIT:
I found out that when I first click on the commandlink the fileupload.js is loaded:
By the second click this is not the case anymore:
I also found a thread with the same problem: <p:layout> and <p:fileUpload> not working on page refresh, but there the only solution seems to be to take the css and js for fileupload and add it manualy to as resource... which is a little creepy...
Related
I'm currently working on an application that uses JSF 2.2 together with Primefaces running on Wildfly 11.
Error Environment: Primefaces 6.2.5
Working environment: Primefaces 6.2.2
Expected Behavior:
Clicking a context menu item, should invoke a re rendering of the toolbar in the screen. This worked in previous versions.
Actual Behavior:
When I click on a menu item in our screen, it will initiate a re-rendering of the toolbar. Moreover, the context menu is used as a composite component in the screen. But, the context menu item generates following error.
javax.el.MethodNotFoundException: /xhtml/screen/toolbar.xhtml.
listener="#{cc.attrs.someClass.onPreRenderToolbar}": Method not found: class
customComponent.onPreRenderToolbar(javax.faces.event.ComponentSystemEvent)
The problem is that it initiates the onPreRenderToolbar method on the “someClass” rather than the toolbar itself (this did not happen for PF 6.2.2 and earlier).
XHTML:
<h:form id="form" rendered="#{not (param['toolbar'] eq 'false') }">
<p:menubar id="menuBar" model="#{cc.attrs.toolbar.model}">
<c:if test="#{not empty cc.attrs.toolbar}" >
<f:event type="preRenderComponent" listener="
{cc.attrs.toolbar.onPreRenderToolbar}"/>
</c:if>
</p:menubar>
</h:form>
The Context Menu is inside the "someClass" (which essentially is a form), while the toolbar is outside this component.
Someone have any input/suggestions on what could be changed between these two versions that could cause this issue?
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
});
});
I am looking for something like <rich:popupPanel> in RichFaces 4, but then for RichFaces 3. I haven't found anything like in documenation. There is only <rich:modalPanel> which doesn't suit my needs, because it has problems displaying my datamodel in table. The selection doesn't work, it always returns no rows selected. If I put my table component in <rich:panel> or <rich:togglePanel>, then it works fine.
Is there any popup window excluding <rich:modalPanel> in RichFaces 3?
I dont have 50 reputation to ask you more details in a comment, so i will answer directly hoping this is what you're asking about.
I think you mean that your problem is that the content of the ModalPanel is not rerendered dynamically. but for this you can wrap your table (or the components you want to update) in an <a4j:outputPanel> with ajaxRendered="true"
Setting ajaxRendered="true" will cause the <a4j:outputPanel> to be updated with each Ajax response for the page, even when not listed explicitly by the requesting component. This can in turn be overridden by specific attributes on any requesting components.
http://docs.jboss.org/richfaces/latest_4_0_X/Component_Reference/en-US/html/chap-Component_Reference-Containers.html#sect-Component_Reference-Containers-a4joutputPanel
In my code I have something like :
<a4j:commandLink id="timelineBtn" action="#{timelineBean.doGenerateLog}"
oncomplete="Richfaces.showModalPanel('timelinePnl');return false;"
value="#{labels['timeline.button.lbl']}"/>
that opens the modalPanel :
<rich:modalPanel style="width:800;height:600;" id="timelinePnl">
<a4j:outputPanel id="dataPanel" ajaxRendered="true">
<!-- your components to be updated go here -->
</a4j:outputPanel>
</rich:modalPanel>
So my content is updated with the results of my timelineBean.doGenerateLog method each time i open the modalPanel .
I am using PrimeFaces 4.0, JSF2, jBoss EAP 6.1, Bootsrtap 3. I've got two places in my project where I use <p:autocomplete>, one renders OK the other does not. Suggestion part of auto complete should appear inside a <div> container at the bottom of the page:
<div id="searchForm:j_id_8t_5k_panel" class="ui-autocomplete-panel ui-widget-content ui-corner-all ui-helper-hidden ui-shadow"></div>
but my buggy one renders in the same place where <p:autocomplete> tag should be, it actually replaces input with plain <ul> with suggestions that you can not click.
I am using proper JSF tags like <h:body> etc.
My autocomplete component:
<p:autoComplete value="#{search.item}" completeMethod="#{search.autocomplete}"
var="item" itemLabel="#{item.label}" itemValue="#{item}" converter="objectConverter"
forceSelection="true" minQueryLength="3" scrollHeight="200"
global="false" />
Anyone had a similar problem?
The cause of my problem was that I've put my <p:autocomplete> inside a <p:outputPanel autoUpdate="true">. After removing autoUpdate everything works fine! Don't really know why it should break an autocomplete element, but it does. Hope it helps someone.
Edit - please see bottom.
I've got a primefaces calendar component on my page. The textbox appears but when I click it the calendar does not appear. Here is the component code.
<p:calendar id="clientApptTime" value="#{ScheduleMB.datePrime}"
pattern="HH:mm" timeOnly="true" />
My facelet and the template both use h:head and h:body tags and I have the
xmlns:p="http://primefaces.org/ui" up top.
I'm using primefaces 3.3.1, java 1.6 and Mojarra 2.1.
Also I'm not getting any error messages on either the server or my error console.
Anybody have any ideas?
And here is the rendered page source:
span id="j_idt34:clientApptTime"><input id="j_idt34:clientApptTime_input"
name="j_idt34:clientApptTime_input" type="text" class="ui-inputfield ui-widget
ui-state-default ui-corner-all" /></span><script id="j_idt34:clientApptTime_s"
type="text/javascript">$(function()
{PrimeFaces.cw('Calendar','widget_j_idt34_clientApptTime',
{id:'j_idt34:clientApptTime',popup:true,locale:'en_US',dateFormat:'m/d/y
hh:mm',timeOnly:true,stepHour:1,stepMinute:1,stepSecond:1,hourMin:0,hourMax:23,minuteMin:0,
minuteMax:59,secondMin:0,secondMax:59});});</script>
Answer seems to be that Primefaces will not work with Tomahawk. After I removed all the Tomahawk references Primefaces worked fine. Anyone know what I can do about that (this may be a question for another post)?