pe:imageRotateAndResize not working with p:graphicImage cache=false - jsf-2

I am using primefaces extensions to zoom and rotate images:
<p:graphicImage id="imageViewerId" value="#{contentBL.inlineContent}" cache="false" />
<pe:imageRotateAndResize id="rotateAndResizeImageId" for="imageViewerId" widgetVar="rotateAndResizeVar" />
<p:commandButton title="Rotate Left" icon="fa fa-mail-reply"
onclick="PF('rotateAndResizeVar').rotateLeft(90); adjustContentViewerSize(); return false;" />
<p:commandButton icon="fa fa-mail-forward" title="Rotate Right"
onclick="PF('rotateAndResizeVar').rotateRight(90); adjustContentViewerSize(); return false;" />
<p:commandButton icon="fa fa-plus-circle" title="Scale +"
onclick="PF('rotateAndResizeVar').scale(1.1); adjustContentViewerSize(); return false;" />
<p:commandButton icon="fa fa-minus-circle" title="Scale -"
onclick="PF('rotateAndResizeVar').scale(0.9); adjustContentViewerSize(); return false;" />
Unfortunately this only works if attribute cache of p:graphicImage is true. If set to false, nothing happens if the rotate or zoom buttons are clicked. #{contentBL.inlineContent} delivers StreamedContent. Is there a way to get this working without caching the images? I am using primefaces 5.3.0 and primefaces extensions 4.0.0 and mojarra 2.2.12.

Made the url unique with f:param as workaround:
<p:graphicImage id="imageViewerId" value="#{contentBL.inlineContent}" cache="true">
<f:param name="customid" value="#{contentBL.generateUuid()}" />
</p:graphicImage>

Related

f:param works only first time when using the same name in multiple commandButtons

My requierement is to upload some data and generate different reports for download with one click. In the example below I show appropriate button witch has a parameter that is sent to the download bean to select the correct version of the report.
But the f:param is only set the first time a p:commandButton is executed and then stays the same also for other buttons. Why is that and how can I solve this issue?
<h:form id="mainForm" enctype="multipart/form-data">
<p:fileUpload ...../>
....
....
<p:selectBooleanCheckbox id="opt1"
<p:ajax event="change" update="hiddingPanel"/>
</p:selectBooleanCheckbox>
<p:selectBooleanCheckbox id="opt2"
<p:ajax event="change" update="hiddingPanel"/>
</p:selectBooleanCheckbox>
<h:panelGroup id="hiddingPanel">
<p:commandButton id="doOpt1" rendered="#{bean.opt1 and !bean.opt2}"
actionListener="#{bean.readFile}" ajax="false" />
<p:fileDownload value="#{downloadBean.content}" />
<f:param name="reportType" value="REPORT1"/>
</p:commandButton>
<p:commandButton id="doOpt1" rendered="#{!bean.opt1 and bean.opt2}"
actionListener="#{bean.readFile}" ajax="false" />
<p:fileDownload value="#{downloadBean.content}" />
<f:param name="reportType" value="REPORT2"/>
</p:commandButton>
</h:panelGroup>
</h:form>
Thanks for any suggestions!
Regards.

JSF 2.2 custom validator not triggered in ui:repeat

after a desperate period of trials and errors i come to you looking for help, since now i am even unsure if i am doing it all wrong.
My code below displays some fields from a user profile in read only input text boxes. The data comes from a bean as ArrayList of "field" objects, whos properties are described in the ui:param directives.
The user can click an unlock/lock button next to the box to start/finish editing her data.
I want to trigger input validation when the user presses enter after editing or clicks the lock button.
But whatever i tried, after editing and pressing enter or clicking the button, the changed value is not written back and my custom validator is not triggered. Somehow it seems that after clicking the button the then rendered input box is not bound to the field? However, the validator works (and all attributes get passed to it) if used in an input text that is always rendered - and i don't understand it :)
Please have a look at it. If i did not explain my intent well enough or if you need more code, please let me know.
Edit: the annotations of the backing bean:
#ManagedBean( name = "beanProfile" )
#RequestScoped
The jsf code:
<ui:composition>
<ui:param name="i18n" value="#{field.i18n}" />
<ui:param name="val" value="#{field.value}" />
<ui:param name="req" value="#{field.required}" />
<ui:param name="min" value="#{field.min}" />
<ui:param name="max" value="#{field.max}" />
<ui:param name="validationType" value="#{field.validationType}" />
<ui:param name="useHidden" value="#{field.hidden}" />
<ui:param name="locked" value="#{field.locked}" />
<ui:param name="fullName" value="#{beanProfile.name}" />
<h:form id="profileFrm">
<h:outputText value="#{msg.role_profile} " styleClass="headingOutputText" />
<h:outputText value="#{fullName}" styleClass="headerTitle" />
<p />
<h:panelGroup>
<ui:repeat var="field" value="#{beanProfile.userFields}">
<h:panelGrid columns="2">
<h:outputText value="#{msg[i18n]}" styleClass="headerTitle" />
<h:message showDetail="true" for="visInput" styleClass="warn"
rendered="#{!useHidden}" />
<h:message showDetail="true" for="invisInput" styleClass="warn"
rendered="#{useHidden}" />
</h:panelGrid>
<h:panelGrid columns="2" columnClasses="nameColumn">
<h:inputText id="visInput" required="true" value="#{val}"
rendered="#{!useHidden}" readonly="#{locked}" >
<f:validator validatorId="customValidator" />
<f:attribute name="requiredField" value="#{req}" />
<f:attribute name="minLen" value="#{min}" />
<f:attribute name="maxLen" value="#{max}" />
<f:attribute name="type" value="#{validationType}" />
</h:inputText>
<h:inputSecret id="invisInput" required="true" value="#{val}"
rendered="#{useHidden}" readonly="#{locked}">
<f:validator validatorId="customValidator" />
<f:attribute name="requiredField" value="#{req}" />
<f:attribute name="minLen" value="#{min}" />
<f:attribute name="maxLen" value="#{max}" />
<f:attribute name="type" value="#{validationType}" />
</h:inputSecret>
<h:commandLink id="lock" action="#{beanProfile.lock(field)}"
rendered="#{!locked}" title="#{msg.profile_lock}">
<h:graphicImage height="16" width="16"
name="images/padlock_unlocked.svg" alt="#{msg.profile_lock}" />
</h:commandLink>
<h:commandLink id="unlock" action="#{beanProfile.unlock(field)}"
rendered="#{locked}" title="#{msg.profile_unlock}">
<h:graphicImage height="16" width="16"
name="images/padlock_locked.svg" alt="#{msg.profile_unlock}" />
</h:commandLink>
</h:panelGrid>
</ui:repeat>
</h:panelGroup>
<p />
<h:commandButton id="submitProfileBtn" value="#{msg.cmd_submit}"
styleClass="button" includeViewParams="true"
action="#{beanProfile.submitProfile()}" />
</h:form>
</ui:composition>
The origin of your problem is that you are using the RequestScoped scope for your backing bean containing the Model, so when you want to do a postback request in order to execute the backing bean method the binding just have dissapeared (not in the server memory) and the JSF lifecycle doesn't execute as expected. The solution is to use a longer scope as the ViewScoped scope. Ideally you should use the CDI compatible viewScoped scope, so you have to use JSF 2.2.x version.
Thank you lametaweb, you led me in the right direction.
Being unable to use the #ViewScoped annotation i found the link
how-to-install-cdi-in-tomcat
and followed BalusC's directions for using CDI in Tomcat. Then i had to let all the java classes implement the Serializable interface.
Now i can use the #ViewScoped annotation and the validator gets triggered.

Opening one <p:confirmDialog> from another <p:confirmDialog> in JSF

I have a JSF page in which I have two dialogs. I want to open one dialog on closing the other.I am using Primefaces 4.0.
Here is my JSF page.
<h:form>
<h:commandLink value="Click me" onclick="bezoekConfirmation.show();return false;"/>
<p:confirmDialog
message="Bent u zeker dat u dit bezoek wilt verwijderen?"
closable="false" header="Bezoek verwijderen" severity="alert"
widgetVar="bezoekConfirmation">
<p:commandButton value="Yes" oncomplete="bezoekConfirmation.hide()"
onclick="dialog.show();" ajax="false" />
<p:commandButton value="No" onclick="bezoekConfirmation.hide()"
type="button" />
</p:confirmDialog>
<p:confirmDialog message="Hai" closable="false"
header="Bezoek verwijderen" severity="alert" widgetVar="dialog">
<p:commandButton value="Yes" oncomplete="dialog.hide()"
action="#{controller.method()}" ajax="false" />
<p:commandButton value="No" onclick="dialog.hide()" type="button" />
</p:confirmDialog>
</h:form>
The first dialog appears. But on clicking the yes button of the first dialog, the second dialog never appears.
However the logic requires both the dialogs to appear one after the other.
Am I missing something?
Remove ajax="false" from the command Button and it will works

"prime faces undefined, Object expected : when accordion panel has data table command buttons and confirm dailogues insides each tab

Message: 'PrimeFaces' is undefined,
Message: Object expected:
This error appears on IE8 especially when there is Accordion panel.After refreshing the page there is no error. Accordion panel basically does not work on IE on initial load when accordion panel has data table command buttons and confirm dailogues insides each tab.Can any body have a work around on this. I am using using prime faces 3.4, jsf2 with myfaces
<p:accordionPanel value="#{testBean.systems}" var="system" dynamic="true">
<p:tab title="#{system.name}" id="systemId">
<p:commandButton process="#this" value="edit" icon="ui-icon-pencil" styleClass="btn-primary" style="margin-left:734px;" action="#{testBean.edit}">
<f:setPropertyActionListener target="#{testBean.formBean}" value="#{system}"></f:setPropertyActionListener>
</p:commandButton>
<p:commandButton value="delete" icon="ui-icon-trash" styleClass="btn-primary" style="width:70px;" oncomplete="confirmDeleteDialog.show()"/>
<p:confirmDialog message="message" width="200"
showEffect="explode" hideEffect="explode"
header="Confirm" severity="alert" widgetVar="confirmDeleteDialog">
<p:commandButton process="#this" value="#{msg.EditSystem_confirmAnswer1}" action="#{testBean.deleteSystem}" oncomplete="confirmDeleteDialog.hide()">
<f:setPropertyActionListener target="#{testBean.formBean}" value="#{system}"></f:setPropertyActionListener>
</p:commandButton>
<p:commandButton value="#{msg.EditSystem_confirmAnswer2}" onclick="confirmDeleteDialog.hide()" type="button" />
</p:confirmDialog>
<p:dataTable id="dataTable" var="tester" value="#{system.studs}" rowKey="#{tester.id}">
<p:column id="serName" sortBy="#{tester.name}" headerText="#{msg.AddService_serName}">
<p:commandLink value="#{tester.name}" immediate="true" process="#this" action="#{testBean1.edit}">
<f:setPropertyActionListener target="#{testBean1.testId}" value="#{tester.id}"/>
<f:setPropertyActionListener target="#{testBean1.testId2}" value="#{tester.desc}"/>
<f:setPropertyActionListener target="#{testBean1.testId3}" value="#{tester.name}"/>
</p:commandLink>
</p:column>

f:param to composite components

In JSF2.1 composite component if we try to pass f:param to a composite component (command button) and recieve in the component as editableValueHolder ,It doesn't seems to be working,
Any ideas?
<mycomp id="button" outcome="newpage" >
<f:param name="foo" outcome="bar" for="button"/>
</mycomp>
compositeComponent....
<cc:interface>
<cc:attribute name="action" targets="commandLink" required="true" />
</cc:interface>
<cc:implementation>
<h:commandLink id="commandLink" action="#{cc.attrs.action}">
</h:commandLink>
</cc:implementation>
Use <cc:insertChildren>.
<h:commandLink ...>
<cc:insertChildren />
</h:commandLink>

Resources