disable two controls using one radio box in JSF Primefaces - jsf

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"

Related

Ajax event change doesn't work

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

Reset DropDown,check box in primefaces not working?

DropDown Box code:
<p:selectOneMenu id="user" value="#{daywise_Count.selectuserId}" style="width:120px">
<f:selectItem itemLabel="All" itemValue="0" />
<f:selectItems value="#{daywise_Count.getAllLoginIds()}" var="uif" itemLabel="#{uif.loginId}" itemValue="#{uif.userId} " />
</p:selectOneMenu>
CheckBox code:
<p:selectBooleanCheckbox id="checkbox" value="#{deptBean.checkboxvalue}" /> With All Details
reset function:
function resetter()
{
document.getElementById('myForm:myMenu_label').innerHTML = 'All';
}
Calling Reset Function
<h:commandButton id="btnReset" value="Reset" update="myForm" onclick="resetter();"
styleClass="button" type="submit">
</h:commandButton>
I am using reset button in myForm that functionality is not working properly in primefaces.please suggest any solution...
you should try this <p:commandButton id="btnReset" value="Reset" update="myForm" process="#this" /> this is working for me, I hope it will help you too. and no need to java script.
update="myForm" attribute means it will update your panel because here you will use panel id and process="#this" means it will execute same content after click on reset button for further details you can search on google or refer this link What is the function of #this exactly?

JSF Inplace - Save Value in focusOut

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>

Validator is called but error message is not displayed

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"/>

JSF - unhandled faces messages prevent rerendering of view

I work with JSF, RichCalendar and a4j. My problem: I want to rerender components of my website but if someone edits the date of one rich-calendar input field to '12.aa.2012' a FacesMessage is thrown, which is correct and good. Anyway my a4j-rerender-event did not get triggered due to unhandeld facesMessages. On my Tomcat-Console I get this errorMessage:
WARNUNG: There are some unhandled FacesMessages, this means not every FacesMessage had a chance to be rendered.
These unhandled FacesMessages are:
- Bitte ein gültiges Datum eingeben!
How can I handle this problem, I tried several ways to show the errorMessage and I can figure out how to show it, but there is still the warning and still the not triggered-rerender-event?
Thanks in advance.
UPDATE: here is the code to my question. As you can see after you select one of the radio buttons, one dateContainer will show up, for example 'admissionDateContainer'. If you change the value to 'asd', and select another choice, no rerendering of the related box happens, the choice will change but the wrong dateContainer will stay there ?!
<h:panelGroup layout="block" id="caseTypeContainer" rendered="#{CaseController.isFallContainer}" styleClass="fieldContainer">
<t:outputLabel for="caseType" styleClass="generalInputLabel" style="width:200px; float:left;" value="#{resources.labels['caseType']}:" title="#{resources.labels['caseType']}" />
<h:selectOneRadio id="caseType" style="font-size:13px;" value="#{CaseController.caseType}" styleClass="radioButtonTableMasterdata inlineBlock">
<f:selectItem itemValue="#{resources.labels['caseTypeDocAttrStationaer']}" itemLabel="#{resources.labels['caseTypeDocAttrStationaerLabel']}" />
<f:selectItem itemValue="#{resources.labels['caseTypeDocAttrAmbulant']}" itemLabel="#{resources.labels['caseTypeDocAttrAmbulant']}"/>
<f:selectItem itemValue="#{resources.labels['caseTypeDocAttrUnbekannt']}" itemLabel="#{resources.labels['caseTypeDocAttrUnbekannt']}"/>
<a4j:support oncomplete="initializeFocusBlurEvents(); " event="onchange" reRender="captureDateContainerDiv, admissionDateContainerDiv, dischargeDateContainerDiv, messagesContainer, warnings"/>
</h:selectOneRadio>
</h:panelGroup>
<t:div id="admissionDateContainerDiv">
<h:panelGroup layout="block" id="admissionDateContainer" rendered="#{CaseController.isCaseTypeStationaerOrAmbulant}" styleClass="fieldContainer showDateInputWithTime">
<t:outputLabel for="admissionDate" rendered="#{CaseController.isCaseTypeStationaer}" styleClass="generalInputLabel" style="width:200px;" value="#{resources.labels['caseAdmissionDateStationaer']}:" title="#{resources.labels['caseAdmissionDateStationaer']}" />
<t:outputLabel for="admissionDate" rendered="#{CaseController.isCaseTypeAmbulant}" styleClass="generalInputLabel" style="width:200px;" value="#{resources.labels['caseAdmissionDateAmbulant']}:" title="#{resources.labels['caseAdmissionDateAmbulant']}" />
<rich:calendar id="admissionDate" value="#{CaseController.caseContainerAdmissionDate}" datePattern="dd.MM.yyyy HH:mm" enableManualInput="true" direction="auto">
<f:facet name="footer">
<h:panelGrid columns="3" width="100%" columnClasses="fake, width100 talign">
<h:outputText value="{selectedDateControl}" style="font-weight:bold;" />
<h:outputText value="{timeControl}" style="font-weight:bold;" />
<h:outputText value="{todayControl}" style="font-weight:bold;" />
</h:panelGrid>
</f:facet>
</rich:calendar>
<rich:message for="admissionDate" />
</h:panelGroup>
</t:div>
<t:div id="messagesContainer" rendered="true">
<p>Messages global</p>
<rich:messages global="true" />
</t:div>
Add <rich:messages or <rich:message to your page
Take a look at rich:messages and rich:message
Also make sure that they are being rendered after your button is being clicked... add their ids or their wrapper (#form for example) ids to the reRender of your calendar

Resources