I've a form, and i want it to show some inputs only if the user mark yes on a selectOneRadio.
Here is the code:
<p:selectOneRadio id="someSelectRadio" value="#{someBean.someClass.someSelectRadio}" >
<f:selectItem itemLabel="Sim" itemValue="Sim" />
<f:selectItem itemLabel="Não" itemValue="Não" />
//Here i use event=change to reconize if the user mark a option on selectOneRadio
<p:ajax event="change" process="someSelectRadio" update="panelGeral" />
</p:selectOneRadio>
//Here is the panel that i want to appear if the user mark selectOneRadio
<p:outputPanel id="panelGeral">
<p:panel id="panel" autoUpdate="true" rendered="#{someBean.someClass.someMethod}" />
</p:outputPanel>
I already have tryied to change event do click, on click, both doesn't work for me.
This may be due to the problem with event .
Change to
<p:ajax event="valueChange" process="someSelectRadio" update="panelGeral" />
More info
Related
I have the following component on the xhtml:
<p:outputLabel for="concept" value="Concept" />
<p:selectOneMenu id="concept" value="#{dIGRCController.digrc.qconce}"
requiredMessage="Debe de seleccionar un concepto."
required="#{request.getParameter('validate')}">
<f:selectItem itemLabel="Concept" itemValue="" />
<f:selectItems value="#{cCRX1Controller.ccrx1.concepts.entrySet()}"
var="concepts" itemValue="#{concepts.key}"
itemLabel="#{concepts.value}" />
<p:ajax event="change" execute="#this" listener="#{dIGRCController.testing()}" />
</p:selectOneMenu>
The values are coming correctly from the cCRX1Controller class. However, when I select an option, I am trying to display the value. the #{dIGRCController.testing()} looks like this:
public void testing()
{
System.out.println("sdfsd");
}
What am I doing wrong? I checked this question but could't figure out what the problem is.
Try with this
<p:ajax process="#this" listener="#{dIGRCController.testing()}" />
I think the default of ajax event of Primefaces select one menu is valueChange event. So, try with using also
<p:ajax event="valueChange" process="#this" listener="#{dIGRCController.testing()}" />
I have to disable two controls on the page using one pair of radio buttons
I have the following code:
<p:selectOneRadio id="console" binding="#{yesOrNo}" required="true">}">
<f:selectItem itemValue="Yes" itemLabel="UPLOAD CLR" />
<f:selectItem itemValue="No" itemLabel="ORDER NUMBER" />
<p:ajax update="yesdata" />
</p:selectOneRadio>
<p:fileUpload id="yesdata" fileUploadListener="#cBean.handleFileUpload}"
label="Upload NC CLR" mode="advanced" multiple="false"
update="createConfigPanel" auto="true" sizeLimit="100000" allowTypes="/(\.|\/)(xls|xlsx)$/" disabled="#yesOrNo.value != 'Yes'}" />
The problem with the above code is I cannot use the same ID for another control. Code continued:
<h:panelGrid columns="2" cellpadding="8">
<p:outputLabel for="serviceType" value="Service Type" />
<p:inputText id="serviceType"
value="#{cBean.serviceType}" required="true"></p:inputText>
...
I want to disable this input box when UPLOAD CLR is clicked in the above case.
Please suggest
You can define multiple components to update in update attribute. Just add another id like:
update="id1 id2"
I need to save values on Focus out in Inplace JSF. Currently the editor tag can be used but it will display a save/cancel button.
My requirement is to save the data on focus out.
This is the Inplace tag that i am using.
<p:inplace id="basic">
<p:inputText value="Edit Me" />
</p:inplace>
Is there any ajax event like.
<p:ajax event="Something like focusOut" listener="#{bean.myFunction()}"/>
My Code sample when i use Blur as ajax event
<p:inplace label="#{serviceCalendarViewManagedBean.selectedService.statusStr}" id="ajaxInplaceStatusEdit" >
<p:ajax event="blur" listener="#{serviceCalendarViewManagedBean.inplaceEdit('StatusEdit')}" update="view" oncomplete="scheduleWidget.update();"/>
<p:selectOneMenu id="statusEditImplace" required="true"
value="#{serviceCalendarViewManagedBean.selectedService.status}"
label="text">
<f:selectItems value="#{serviceCalendarViewManagedBean.serviceStatusList}"
var="status" itemLabel="#{status.title}" itemValue="#{status.id}" />
</p:selectOneMenu>
</p:inplace>
The error message That i get when using this event
/WEB-INF/views/service/servicecalendarview.xhtml #886,153 <p:ajax>
Event:blur is not supported.
You're looking for the onblur event:
Execute a JavaScript when a user leaves an input field:
JSF code:
<p:ajax event="blur" listener="#{bean.myFunction()}"/>
EDIT: from your posted code, the <p:ajax> affects the <p:inplace> where it should affect the <p:selectOneMenu>. Move the <p:ajax> inside the <p:selectOneMenu>:
<p:inplace label="#{serviceCalendarViewManagedBean.selectedService.statusStr}"
id="ajaxInplaceStatusEdit" >
<p:selectOneMenu id="statusEditImplace" required="true"
value="#{serviceCalendarViewManagedBean.selectedService.status}"
label="text">
<f:selectItems value="#{serviceCalendarViewManagedBean.serviceStatusList}"
var="status" itemLabel="#{status.title}" itemValue="#{status.id}" />
<p:ajax event="blur" listener="#{serviceCalendarViewManagedBean.inplaceEdit('StatusEdit')}"
update="view" oncomplete="scheduleWidget.update();"/>
</p:selectOneMenu>
</p:inplace>
when i click on the command button. validate method is getting called but the error message is not getting displayed..
here is my code..
<h:form id="form">
<h:body>
<p:panel style="width:500px">
<h:outputLabel for="year" value="Select Year: *" style="font-weight:bold" />
<p:selectOneMenu id="year" value="#{leaveBean.year}">
<f:selectItem itemLabel="Select One" itemValue="null" />
<f:selectItems value="#{leaveBean.yearDTO}" var="currentUser" itemValue="#{currentUser.name}" itemLabel="#{currentUser.name}" />
<f:validator validatorId="LeaveCardValidator" />
</p:selectOneMenu>
</p:panel>
<p:commandButton value="Submit" action="#{leaveController.leaveCard}" update="updateList,updateDetails" id="button"/>
<h:message for="year" style="color:red"/>
You seem to expect that JSF auto-updates the <h:message> on every ajax request. This is untrue. Perhaps you're confusing with PrimeFaces <p:messages> or <p:growl> which have each an autoUpdate attribute which enables you to tell them to auto-update themselves on every ajax request.
You really need to make sure that the <h:message> is covered by the ajax update. Just give it an ID
<h:message id="yearMessage" ... />
and include it in the client ID collection of the ajax update
<p:commandButton ... update="updateList updateDetails yearMessage" />
An alternative would be to replace <h:message> by <p:messages autoUpdate="true">.
Not sure where are the updateList and updateDetails are located but in the example give above you should use update="#form" instead or in addtion like this:
update="updateList updateDetails #form"
so that the form will be rendered again...
just use one of these :
update the whole form in order to update the content of
<h:message />
<p:commandButton value="Submit" action="#{leaveController.leaveCard}" update="#form" id="button"/>
or give the <h:message /> an id and id this id to the <p:commandButton/>
<h:message id="msg" for="year" style="color:red"/>
<p:commandButton value="Submit" action="#{leaveController.leaveCard}" update="updateList,updateDetails,msg" id="button"/>
I have a popup panel (id=PanelAddQueryCriteria) define on top of jsf page but it only enable it after user select a menu item (id=entityKind) and re-render take pace for that popupPanel. However because of that re-render, select item (id=queryCriteriaAttr) inside that popup panel don't trigger change listener (#{ceaDBBean.queryCriteriaAttrChanged}) in first value change, and only trigger when select again... Any help? Here the code:
<rich:popupPanel id="PanelAddQueryCriteria">
<h:form id="formAddQueryCriteria">
<h:selectOneMenu id="queryCriteriaAttr"
value="#{ceaDBBean.queryCriteriaAttr}" required="true"
valueChangeListener="#{ceaDBBean.queryCriteriaAttrChanged}">
<f:selectItems value="#{ceaDBBean.ceaEntityKindAttrs}"/>
</h:selectOneMenu>
</h:form>
</rich:popupPanel>
<h:panelGrid id="searchPanel">
<h:selectOneMenu id="entityKind"
value="#{ceaDBBean.entityKind}" required="true"
valueChangeListener="#{ceaDBBean.entityKindChanged}">
<a4j:ajax event="valueChange" render="addQueryCriteria" execute="#this" />
<f:selectItems value="#{ceaDBBean.ceaEntityKinds}" />
</h:selectOneMenu>
<a4j:commandLink styleClass="no-decor" id="addQueryCriteria"
render="PanelAddQueryCriteria"
disabled="#{empty ceaDBBean.entityKind}"
execute="#this" action="#{ceaDBBean.initAddQuryCriteria}"
oncomplete="#{rich:component('PanelAddQueryCriteria')}.show()">
<h:graphicImage id="addQueryCriteriaImg"
value="/images/icons/common/new.gif" width="16" height="16"
alt="#{adminMsg.addQueryCriteria}" />
<rich:tooltip value="#{adminMsg.addQueryCriteria}" for="addQueryCriteria" />
</a4j:commandLink>
</h:panelGrid>
Short answer: this problem is caused by JSF issue 790. Change
render="PanelAddQueryCriteria"
by
render="formAddQueryCriteria"
or maybe, if you have actually more into the panel which needs to be updated than the form itself,
render="PanelAddQueryCriteria formAddQueryCriteria"
Long answer: read following related questions:
<a4j:commandbutton> action is only invoked on second click
h:commandButton/h:commandLink does not work on first click, works only on second click