I am using JSF2,primefaces2.1 (using netbeans 7.0.1 and glassfish3.1)
the problem that i am facing from a while is after using the the button below it dont appear(if I add component below the fileupload it's ok but not after!)
after a lot of observing I have remarked that the problem is when I remove the table(which I have use it to organize my components) the button (adduser) appear !
this is the code page.xhtml
<table border="1" align="center" style='width:1004px;height:100px;' cellpadding="0" cellspacing="0" >
<h:form>
<tr><td>
<h:outputLabel value="Nom" /><h:inputText value="#{AddPerson.nom}" />
<br /></td></tr>
<tr><td> <h:outputLabel value="Prenom"/> <h:inputText value="#{AddPerson.prenom}" />
<br /></td></tr>
<tr><td> <h:outputLabel value="Etat Civil"/>
<h:selectOneMenu id="etatcivil" value="#{AddPerson.etatCivil}">
<f:selectItem itemValue="Monsieur" itemLabel="M"/>
<f:selectItem itemValue="Madam" itemLabel="Mme"/>
<f:selectItem itemValue="Madmoiselle" itemLabel="Mlle"/>
</h:selectOneMenu>
<br /></td></tr>
<tr><td> <h:outputLabel value="Date de naissance "/>
<h:selectOneMenu id="jour" value="#{AddPerson.jour}">
<f:selectItem itemValue="00" itemLabel=""/>
<f:selectItem itemValue="01" itemLabel="01"/> <f:selectItem itemValue="02" itemLabel="02"/><f:selectItem itemValue="03" itemLabel="03"/>
<f:selectItem itemValue="04" itemLabel="04"/><f:selectItem itemValue="05" itemLabel="05"/><f:selectItem itemValue="06" itemLabel="06"/>
<f:selectItem itemValue="07" itemLabel="07"/><f:selectItem itemValue="08" itemLabel="08"/><f:selectItem itemValue="09" itemLabel="09"/>
<f:selectItem itemValue="10" itemLabel="10"/><f:selectItem itemValue="11" itemLabel="11"/><f:selectItem itemValue="12" itemLabel="12"/>
<f:selectItem itemValue="13" itemLabel="13"/><f:selectItem itemValue="14" itemLabel="14"/><f:selectItem itemValue="15" itemLabel="15"/>
<f:selectItem itemValue="16" itemLabel="16"/><f:selectItem itemValue="17" itemLabel="17"/><f:selectItem itemValue="18" itemLabel="18"/>
<f:selectItem itemValue="19" itemLabel="19"/><f:selectItem itemValue="20" itemLabel="20"/><f:selectItem itemValue="21" itemLabel="21"/>
<f:selectItem itemValue="22" itemLabel="22"/><f:selectItem itemValue="23" itemLabel="23"/><f:selectItem itemValue="24" itemLabel="24"/>
<f:selectItem itemValue="25" itemLabel="25"/><f:selectItem itemValue="26" itemLabel="26"/><f:selectItem itemValue="27" itemLabel="27"/>
<f:selectItem itemValue="28" itemLabel="28"/><f:selectItem itemValue="29" itemLabel="29"/><f:selectItem itemValue="30" itemLabel="30"/>
<f:selectItem itemValue="31" itemLabel="31"/>
</h:selectOneMenu>
<h:selectOneMenu id="mois" value="#{AddPerson.mois}">
<f:selectItem itemValue="00" itemLabel=""/>
<f:selectItem itemValue="01" itemLabel="Janvier"/> <f:selectItem itemValue="02" itemLabel="Fevrier"/><f:selectItem itemValue="03" itemLabel="Mars"/>
<f:selectItem itemValue="04" itemLabel="Avril"/><f:selectItem itemValue="05" itemLabel="May"/><f:selectItem itemValue="06" itemLabel="Juin"/>
<f:selectItem itemValue="07" itemLabel="Juillet"/><f:selectItem itemValue="08" itemLabel="Aout"/><f:selectItem itemValue="09" itemLabel="Septembre"/>
<f:selectItem itemValue="10" itemLabel="Octobre"/><f:selectItem itemValue="11" itemLabel="Novembre"/><f:selectItem itemValue="12" itemLabel="Decembre"/>
</h:selectOneMenu>
<h:selectOneMenu id="annee" value="#{AddPerson.annee}" >
<f:selectItem itemValue="1940" itemLabel="1940"/> <f:selectItem itemValue="1941" itemLabel="1941"/><f:selectItem itemValue="1942" itemLabel="1942"/><f:selectItem itemValue="1943" itemLabel="1943"/><f:selectItem itemValue="1944" itemLabel="1944"/><f:selectItem itemValue="1945" itemLabel="1945"/><f:selectItem itemValue="1946" itemLabel="1946"/><f:selectItem itemValue="1947" itemLabel="1947"/><f:selectItem itemValue="1948" itemLabel="1948"/><f:selectItem itemValue="1949" itemLabel="1949"/>
<f:selectItem itemValue="1950" itemLabel="1950"/><f:selectItem itemValue="1951" itemLabel="1951"/><f:selectItem itemValue="1952" itemLabel="1952"/><f:selectItem itemValue="1953" itemLabel="1953"/><f:selectItem itemValue="1954" itemLabel="1954"/><f:selectItem itemValue="1955" itemLabel="1955"/><f:selectItem itemValue="1956" itemLabel="1956"/><f:selectItem itemValue="1957" itemLabel="1957"/><f:selectItem itemValue="1958" itemLabel="1958"/><f:selectItem itemValue="1959" itemLabel="1959"/>
<f:selectItem itemValue="1960" itemLabel="1960"/><f:selectItem itemValue="1961" itemLabel="1961"/><f:selectItem itemValue="1962" itemLabel="1962"/><f:selectItem itemValue="1963" itemLabel="1963"/><f:selectItem itemValue="1964" itemLabel="1964"/><f:selectItem itemValue="1965" itemLabel="1965"/><f:selectItem itemValue="1966" itemLabel="1966"/><f:selectItem itemValue="1967" itemLabel="1967"/><f:selectItem itemValue="1968" itemLabel="1968"/><f:selectItem itemValue="1969" itemLabel="1969"/>
<f:selectItem itemValue="1970" itemLabel="1970"/><f:selectItem itemValue="1971" itemLabel="1971"/><f:selectItem itemValue="1972" itemLabel="1972"/><f:selectItem itemValue="1973" itemLabel="1973"/><f:selectItem itemValue="1974" itemLabel="1974"/><f:selectItem itemValue="1975" itemLabel="1975"/><f:selectItem itemValue="1976" itemLabel="1976"/><f:selectItem itemValue="1977" itemLabel="1977"/><f:selectItem itemValue="1978" itemLabel="1978"/><f:selectItem itemValue="1979" itemLabel="1979"/>
<f:selectItem itemValue="1980" itemLabel="1980"/><f:selectItem itemValue="1981" itemLabel="1981"/><f:selectItem itemValue="1982" itemLabel="1982"/><f:selectItem itemValue="1983" itemLabel="1983"/><f:selectItem itemValue="1984" itemLabel="1984"/><f:selectItem itemValue="1985" itemLabel="1985"/><f:selectItem itemValue="1986" itemLabel="1986"/><f:selectItem itemValue="1987" itemLabel="1987"/><f:selectItem itemValue="1988" itemLabel="1988"/><f:selectItem itemValue="1989" itemLabel="1989"/>
<f:selectItem itemValue="1990" itemLabel="1990"/><f:selectItem itemValue="1991" itemLabel="1991"/><f:selectItem itemValue="1992" itemLabel="1992"/><f:selectItem itemValue="1993" itemLabel="1993"/><f:selectItem itemValue="1994" itemLabel="1994"/><f:selectItem itemValue="1995" itemLabel="1995"/><f:selectItem itemValue="1996" itemLabel="1996"/><f:selectItem itemValue="1997" itemLabel="1997"/><f:selectItem itemValue="1998" itemLabel="1998"/><f:selectItem itemValue="1999" itemLabel="1999"/>
<f:selectItem itemValue="2000" itemLabel="2000"/><f:selectItem itemValue="2001" itemLabel="2001"/><f:selectItem itemValue="2002" itemLabel="2002"/><f:selectItem itemValue="2003" itemLabel="2003"/><f:selectItem itemValue="2004" itemLabel="2004"/><f:selectItem itemValue="2005" itemLabel="2005"/><f:selectItem itemValue="2006" itemLabel="2006"/><f:selectItem itemValue="2007" itemLabel="2007"/><f:selectItem itemValue="2008" itemLabel="2008"/><f:selectItem itemValue="2009" itemLabel="2009"/>
<f:selectItem itemValue="2010" itemLabel="2010"/><f:selectItem itemValue="2011" itemLabel="2011"/><f:selectItem itemValue="2012" itemLabel="2012"/>
</h:selectOneMenu>
</td></tr>
<tr><td> <br /> <h:outputLabel value="fax"/><h:inputText value="#{AddPerson.fax}" /></td></tr>
<tr><td> <br /> <h:outputLabel value="profession"/><h:inputText value="#{AddPerson.profession}" /></td></tr>
<tr><td> <br /> <h:outputLabel value="adresse"/><h:inputText value="#{AddPerson.adresse}" /></td></tr>
<tr><td> <br /> <h:outputLabel value="code Postal"/><h:inputText value="#{AddPerson.codePostal}" /></td></tr>
<tr><td> <br /> <h:outputLabel value="Domaine de Competence"/>
<h:selectOneMenu value="#{AddPerson.domain}" id="domaine" >
<f:selectItem itemLabel="-- Select Domaine de Competence-- " itemValue="0"/>
<f:selectItems value="#{AddPerson.listDomaine}" />
</h:selectOneMenu></td></tr>
<tr style="width:800px"><td style="width:500px"> <br /> <h:outputLabel value="Files"/>
<h:panelGroup style="display:inline;color:yellow;">
<p:fileUpload style="display:inline" fileUploadListener="#{AddPerson.fileUpload}"
sizeLimit="500000"
allowTypes="/(\.|\/)(gif|jpe?g|png)$/"/>
</h:panelGroup></td></tr>
<tr><td> <br /> <h:outputLabel value="butt"/> <h:commandButton style="color:red;" value="Add User" action="#{AddPerson.addUserDB}" /></td></tr>
</h:form></table>
Have you tried replacing table with <h:panelGrid ? Or with ul and li (different styling approaches than plain table ?
In my case check the Chrome element inspector and saw the default css Primefaces and I appeared so:
.ui-fileupload {
display: none;
}
What I did is overwrite the style in my css file like this:
.ui-fileupload {
display: inline;
}
Info:
http://www.mkyong.com/jsf2/primefaces/how-to-override-primefaces-css/
Related
I want to create a JSF application. In the application the user will have two drop downs.
If a user selects the country Mexico / value 3 from the first drop down then he is required to choose the option Cancun / value 6 from the multiselect
How this can be implemented?
<h:form>
<p:growl id="msgs" showDetail="true" skipDetailIfEqualsSummary="true" />
<p:panel header="Tranfer Destination" style="margin-bottom:10px;">
<h:panelGrid columns="2" cellpadding="5">
<p:outputLabel for="country" value="Country: " />
<p:selectOneMenu id="country" value="#{dropdownView.country}" style="width:150px">
<f:selectItem itemLabel="Select Country" itemValue="" noSelectionOption="true" />
<f:selectItems value="#{dropdownView.countries}" />
</p:selectOneMenu>
<p:outputLabel for="city" value="City: " />
<p:multiSelectListbox id="city" value="#{dropdownView.city}" style="width:150px">
<f:selectItem itemLabel="Select City" itemValue="" noSelectionOption="true" />
<f:selectItem itemLabel="New York" itemValue="1"> </f:selectItem>
<f:selectItem itemLabel="Chicago" itemValue="2"> </f:selectItem>
<f:selectItem itemLabel="Seattle" itemValue="3"> </f:selectItem>
<f:selectItem itemLabel="Toronto" itemValue="4"> </f:selectItem>
<f:selectItem itemLabel="Ontario" itemValue="5"> </f:selectItem>
<f:selectItem itemLabel="Cancun" itemValue="6"> </f:selectItem>
<f:selectItem itemLabel="Tijuana" itemValue="7"> </f:selectItem>
</p:multiSelectListbox>
</h:panelGrid>
<p:separator />
<p:commandButton value="Submit" update="msgs" action="#{dropdownView.displayLocation}" icon="pi pi-check" />
</p:panel>
</h:form>
List of Countries are populated from the database
ID NAME
USA-C
Canada-N
Mexico-C
List of cities
New york (optional)
Chicago (optional)
Seattle (optional)
Toronto (optional)
Ontario (optional)
Cancun [required]
Tijuana (optional)
Here in the second drop down we are making sure that the option is selected/required item for selection
Update
I have made necessary changes as suggested but it does not work.
<h:form>
<p:growl id="msgs" showDetail="true" skipDetailIfEqualsSummary="true" />
<p:panel header="Tranfer Destination" style="margin-bottom:10px;">
<h:panelGrid columns="2" cellpadding="5">
<p:outputLabel for="country" value="Country: " />
<p:selectOneMenu id="country" value="#{dropdownView.country}" style="width:150px" required="true" binding="#{country}">
<f:selectItem itemLabel="Select Country" itemValue="" noSelectionOption="true" />
<f:selectItems value="#{dropdownView.countries}" />
</p:selectOneMenu>
<p:outputLabel for="city" value="City: " />
<p:multiSelectListbox id="city" value="#{dropdownView.city}" style="width:150px" required="#{not empty param[country.6]}">
<f:selectItem itemLabel="Select City" itemValue="" noSelectionOption="true" />
<f:selectItem itemLabel="New York" itemValue="1"> </f:selectItem>
<f:selectItem itemLabel="Chicago" itemValue="2"> </f:selectItem>
<f:selectItem itemLabel="Seattle" itemValue="3">
</f:selectItem>
<f:selectItem itemLabel="Toronto" itemValue="4"> </f:selectItem>
<f:selectItem itemLabel="Ontario" itemValue="5"> </f:selectItem>
<f:selectItem itemLabel="Cancun" itemValue="6"> </f:selectItem>
<f:selectItem itemLabel="Tijuana" itemValue="7"> </f:selectItem>
</p:multiSelectListbox>
</h:panelGrid>
<p:separator />
<p:commandButton value="Submit" update="msgs" action="#{dropdownView.displayLocation}" icon="pi pi-check" />
</p:panel>
</h:form>
The the option Cancun / value 6 is required from the second drop down only If the user selects the country Mexico / value 3 from the first drop down
I want to create a JSF application. In the application the user will have two drop downs.
If a user selects the country Mexico / value 3 from the first drop down then he is required to choose the option Cancun / value 6 from the multiselect
I have added the binding , required attribute for multiSelectListbox but they are not triggered when the drop down is selected
<h:form>
<p:growl id="msgs" showDetail="true" skipDetailIfEqualsSummary="true" />
<p:panel header="Tranfer Destination" style="margin-bottom:10px;">
<h:panelGrid columns="2" cellpadding="5">
<p:outputLabel for="country" value="Country: " />
<p:selectOneMenu id="country" value="#{dropdownView.country}" style="width:150px" required="true" binding="#{country}">
<f:selectItem itemLabel="Select Country" itemValue="" noSelectionOption="true" />
<f:selectItems value="#{dropdownView.countries}" />
</p:selectOneMenu>
<p:outputLabel for="city" value="City: " />
<p:multiSelectListbox id="city" value="#{dropdownView.city}" style="width:150px" required="#{not empty param[country.6]}">
<f:selectItem itemLabel="Select City" itemValue="" noSelectionOption="true" />
<f:selectItem itemLabel="New York" itemValue="1"> </f:selectItem>
<f:selectItem itemLabel="Chicago" itemValue="2"> </f:selectItem>
<f:selectItem itemLabel="Seattle" itemValue="3"> </f:selectItem>
<f:selectItem itemLabel="Toronto" itemValue="4"> </f:selectItem>
<f:selectItem itemLabel="Ontario" itemValue="5"> </f:selectItem>
<f:selectItem itemLabel="Cancun" itemValue="6"> </f:selectItem>
<f:selectItem itemLabel="Tijuana" itemValue="7"> </f:selectItem>
</p:multiSelectListbox>
</h:panelGrid>
<p:separator />
<p:commandButton value="Submit" update="msgs" action="#{dropdownView.displayLocation}" icon="pi pi-check" />
</p:panel>
</h:form>
The option Cancun / value 6 is required from the second drop down only If the user selects the country Mexico / value 3 from the first drop down
After selecting first drop-down, you need to update <p:multiSelectListbox id="city"/>.
<p:selectOneMenu id="country"
value="#{dropdownView.country}"
style="width:150px"
required="true"
binding="#{country}">
<f:selectItem itemLabel="Select Country" itemValue="" noSelectionOption="true" />
<f:selectItems value="#{dropdownView.countries}" />
<p:ajax update="city"/>
</p:selectOneMenu>
I'm trying to associate a label tag with my dropdown menu to make it accessible to screen readers. I've noticed that when using p:selectOneMenu primefaces generates an input element that should not be there. When applying p:outputLabel, it appears to work fine (ie you click on the label text and focus moves to the dropdown menu). However it turns out that the focus is in fact moving to the input element and the select element is not keyboard accessible (tabindex="-1"). Here's an example taken from the primefaces website:
http://www.primefaces.org/showcase/ui/input/oneMenu.xhtml
<h:form>
<p:messages autoUpdate="true" />
<h:panelGrid columns="2" style="margin-bottom:10px" cellpadding="5">
<p:outputLabel for="console" value="Basic:" />
<p:selectOneMenu id="console" value="#{selectOneMenuView.console}" style="width:125px">
<f:selectItem itemLabel="Select One" itemValue="" />
<f:selectItem itemLabel="Xbox One" itemValue="Xbox One" />
<f:selectItem itemLabel="PS4" itemValue="PS4" />
<f:selectItem itemLabel="Wii U" itemValue="Wii U" />
</p:selectOneMenu>
<p:outputLabel for="car" value="Grouping: " />
<p:selectOneMenu id="car" value="#{selectOneMenuView.car}">
<f:selectItem itemLabel="Select One" itemValue="" />
<f:selectItems value="#{selectOneMenuView.cars}" />
</p:selectOneMenu>
<p:outputLabel for="city" value="Editable: " />
<p:selectOneMenu id="city" value="#{selectOneMenuView.city}" effect="fold" editable="true">
<f:selectItem itemLabel="Select One" itemValue="" />
<f:selectItems value="#{selectOneMenuView.cities}" />
</p:selectOneMenu>
<p:outputLabel for="advanced" value="Advanced:" />
<p:selectOneMenu id="advanced" value="#{selectOneMenuView.theme}" converter="themeConverter" panelStyle="width:180px"
effect="fade" var="t" style="width:160px" filter="true" filterMatchMode="startsWith">
<f:selectItems value="#{selectOneMenuView.themes}" var="theme" itemLabel="#{theme.displayName}" itemValue="#{theme}" />
<p:column style="width:10%">
<h:outputText styleClass="ui-theme ui-theme-#{t.name}" />
</p:column>
<p:column>
<h:outputText value="#{t.displayName}" />
</p:column>
</p:selectOneMenu>
</h:panelGrid>
<p:commandButton value="Submit" update="display" oncomplete="PF('dlg').show()" icon="ui-icon-check" />
<p:dialog header="Values" modal="true" showEffect="bounce" widgetVar="dlg" resizable="false">
<p:panelGrid columns="2" id="display" columnClasses="label,value">
<h:outputText value="Basic:" />
<h:outputText value="#{selectOneMenuView.console}" />
<h:outputText value="Grouping:" />
<h:outputText value="#{selectOneMenuView.car}" />
<h:outputText value="Editable" />
<h:outputText value="#{selectOneMenuView.city}" />
<h:outputText value="Advanced:" />
<h:outputText value="#{selectOneMenuView.theme.displayName}" />
</p:panelGrid>
</p:dialog>
When you look at the page with just the html loaded, you can see each p:selectOneMenu generates an input as well as a select.
<td>
<label id="j_idt88:j_idt91" class="ui-outputlabel ui-widget" for="j_idt88:console_focus">Basic:</label>
</td>
<div id="j_idt88:console" class="ui-selectonemenu ui-widget ui-state-default ui-corner-all" style="width:125px">
<div class="ui-helper-hidden-accessible">
<input id="j_idt88:console_focus" name="j_idt88:console_focus" type="text" autocomplete="off">
</div>
<div class="ui-helper-hidden-accessible">
<select id="j_idt88:console_input" name="j_idt88:console_input" tabindex="-1" data-p-label="Basic" data-p-hl="onemenu">
<option value="">Select One</option><option value="Xbox One">Xbox One</option>
<option value="PS4">PS4</option>
<option value="Wii U">Wii U</option>
</select>
</div>
<label id="j_idt88:console_label" class="ui-selectonemenu-label ui-inputfield ui-corner-all">Select One</label>
<div class="ui-selectonemenu-trigger ui-state-default ui-corner-right">
<span class="ui-icon ui-icon-triangle-1-s ui-c"></span>
</div>
</div>
I'm looking to have the dropdown menu to behave like the JSF one h:selectOneMenu (when it comes to accessibility). Specific to the example, I want the "Basic:" label associated with it's dropdown menu so that when you click "Basic" focus moves to the dropdown menu. I also want a screen reader to actually treat it as a select element rather than an input element. So far I can't find a way to do this because of that input element that's generated. I'm currently using Primefaces 5.2. Does anyone know a way to prevent this input element from being generated?
I gave up on the p:selectOneMenu for two reasons : it is not accessible and it is a pain to use on a mobile device because it doesn't bring the native control picker (the "spinning wheel" on the iPad for instance).
Instead I use the h:selectOneMenu customized with something like :
<h:selectOneMenu
styleClass="ui-inputfield ui-widget ui-state-default ui-corner-all #{component.valid ? '' : 'ui-state-error'}"
onmouseover="$(this).addClass('ui-state-active')"
onmouseout="$(this).removeClass('ui-state-active')"
onfocus="$(this).addClass('ui-state-active ui-state-focus')"
onblur="$(this).removeClass('ui-state-active ui-state-focus')"/>
It doesn't look that bad, it is accessible and it works well with mobile device.
I want to display and hide a <h:panelGrid> on the basis of the value selected in <h:selectOneMenu>.
The code is:
<p:dialog id="logClassDlg" header="Log Class Teached" widgetVar="logClass" modal="true" >
<h:form>
<p:growl id="growl" showDetail="true" />
<h:panelGrid id="logClassPanelGrd1" columns="2">
<h:outputLabel for="class" value="Class: " />
<h:selectOneMenu id="class" value="#{logClassBean.classLog.classTitle}">
<f:selectItem itemValue="Reading" itemLabel="Reading" />
<f:selectItem itemValue="Memorization" itemLabel="Memorization" />
<f:selectItem itemValue="Translation" itemLabel="Translation" />
<f:selectItem itemValue="Language" itemLabel="Language" />
<f:selectItem itemValue="Grammer" itemLabel="Grammer" />
<f:ajax render="logClassPanelGrdBook" />
</h:selectOneMenu>
</h:panelGrid>
<h:panelGrid id="logClassPanelGrdBook" columns="2" rendered="#{(logClassBean.classLog.classTitle ne 'Language') and (logClassBean.classLog.classTitle ne 'Grammar')}">
<p:outputLabel value="Book" />
<h:selectOneMenu id="book" value="#{logClassBean.classLog.classStatus}">
<f:selectItem itemValue="first" itemLabel="first" />
<f:selectItem itemValue="second" itemLabel="second" />
<f:selectItem itemValue="third" itemLabel="third" />
<f:selectItem itemValue="fourth" itemLabel="fourth" />
<f:selectItem itemValue="fifth" itemLabel="fifth" />
</h:selectOneMenu>
</h:panelGrid>
As you can see I want to display the panel grid logClassPanelGrdBook only on when the selected values are not Language and Grammar i.e
rendered="#{(logClassBean.classLog.classTitle ne 'Language') and (logClassBean.classLog.classTitle ne 'Grammar')}"
But the panel grid is displayed irrespective of the values selected, it should hide when the other values (Reading, Memorization and Translation) are selected.
Any help/pointers would be appreciated. Thank you.
The part <f:ajax render="logClassPanelGrdBook" /> won't update and recheck the rendered function of the panelGrid this way. You will need to update its parent element instead.
For example, you can wrap it with <h:panelGroup>:
<h:panelGrid id="logClassPanelGrd1" columns="2">
<h:outputLabel for="class" value="Class: " />
<h:selectOneMenu id="class" value="#{logClassBean.classLog.classTitle}">
<f:selectItem itemValue="Reading" itemLabel="Reading" />
<f:selectItem itemValue="Memorization" itemLabel="Memorization" />
<f:selectItem itemValue="Translation" itemLabel="Translation" />
<f:selectItem itemValue="Language" itemLabel="Language" />
<f:selectItem itemValue="Grammar" itemLabel="Grammar" />
<f:ajax render="logClassPanelGrdBook" />
</h:selectOneMenu>
</h:panelGrid>
<h:panelGroup id="logClassPanelGrdBook">
<h:panelGrid columns="2" rendered="#{(logClassBean.classLog.classTitle ne 'Language') and (logClassBean.classLog.classTitle ne 'Grammar')}">
<p:outputLabel value="Book" />
<h:selectOneMenu id="book" value="#{logClassBean.classLog.classStatus}">
<f:selectItem itemValue="first" itemLabel="first" />
<f:selectItem itemValue="second" itemLabel="second" />
<f:selectItem itemValue="third" itemLabel="third" />
<f:selectItem itemValue="fourth" itemLabel="fourth" />
<f:selectItem itemValue="fifth" itemLabel="fifth" />
</h:selectOneMenu>
</h:panelGrid>
<h:panelGroup>
I also changed select item value from Grammer to Grammar because it didn't match the value in rendered attribute.
If this doesn't work, you should also check if bean value is properly set when you click <h:selectOneMenu>.
hi im trying to save a formular in an Oracle database but when i tried to invoke the method in the action= "#{uniformesBackendBean.refrescarCandidatos()}" but it does not work.. Here is the code. Javascript is able in my browser. Thanks for your help.
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.prime.com.tr/ui"
xmlns:f="http://java.sun.com/jsf/core"
template="/plantillas/defaultTemplate.xhtml"
xmlns:i="http://java.sun.com/jsf/composite/components/presentacion"
xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:d="http://java.sun.com/jsf/composite/components/dialogo">
<!-- =================================== -->
<ui:define name="titulo">
<h:outputText value="Registro de Uniformes"/>
</ui:define>
<!-- =================================== -->
<ui:define name="acciones">
<p:tab title="Otras acciones">
<h:panelGrid columns="1" style="height: 100px;">
<!-- NUEVO -->
<p:commandLink styleClass="opcionMenu" ajax="true" action="#{reportes$indicador.inicio$action}" >
<p:graphicImage value="/resources/iconos/edit.png"/>
<h:outputText value="Editar" styleClass="espacioTexto"/>
</p:commandLink>
<p:commandLink styleClass="opcionMenu" ajax="true" action="#{uniformesBackendBean.doGuardar()}" rendered="true">
<p:graphicImage value="/resources/iconos/document-save.png"/>
<h:outputText value="Guardar" styleClass="espacioTexto"/>
</p:commandLink>
<p:commandLink styleClass="opcionMenu" ajax="true" action="#{reportes$indicador.inicio$action}">
<p:graphicImage value="/resources/iconos/application-exit.png"/>
<h:outputText value="Cancelar" styleClass="espacioTexto"/>
</p:commandLink>
</h:panelGrid>
</p:tab>
</ui:define>
<ui:define name="contenido">
<p:spacer height="10" />
<h:panelGrid columns="2" > <!--NUEVOS campos para el requerimeinto de cotrol de uniformes -->
<h:inputHidden value="1235" id="inputHidden_1" />
<h:panelGroup >
<h:outputLabel id="nombreEmpleado" value="#{uniformesBackendBean.empleadoSeleccionado.nombreCompleto}" rendered="true" style=" font-weight: bold"/>
<p:commandLink styleClass="opcionMenu"
style="color:blue"
ajax="true"
update="principalForm:tabla"
oncomplete="dialogoEditar.show();"
rendered="true"
action="#{uniformesBackendBean.refrescarCandidatos()}" >
<p:graphicImage value="/resources/iconos/personal.png"/>
<h:outputText value="Seleccionar empleado" styleClass="espacioTexto"/>
</p:commandLink>
</h:panelGroup>
<h:inputHidden value="123" id="inputHidden_23" />
<i:etiquetaRequerido value="Fecha de entrega" />
<p:calendar showOn="button" value="#{reportes$indicador.fechaFinal}" label="Fecha Entrega" title="Fecha Entrega" required="true" requiredMessage="Fecha Entrega es un campo requerido" navigator="true"/>
<i:etiquetaRequerido value="Cantidad de camisas" />
<p:inputText id="cantidadCamisas" value="" size="5"/>
<i:etiquetaRequerido value="Marca de camisa" />
<h:selectOneMenu id="marca" value="" style="width: 175px; height: 24px; padding-top: 3px;" required="true" requiredMessage="Cantidad de camisas es un campo requerido" styleClass="ui-widget ui-inputfield ui-state-default ui-corner-all">
<f:selectItem itemValue="0" itemLabel="-- Seleccione --"/>
<f:selectItem itemValue="1" itemLabel="Monge"/>
<f:selectItem itemValue="2" itemLabel="Prado"/>
<f:selectItem itemValue="3" itemLabel="Remate"/>
<f:selectItem itemValue="4" itemLabel="Otro"/>
</h:selectOneMenu>
<i:etiquetaRequerido value="Tipo de camisa" />
<h:selectOneMenu id="tipo" value="" style="width: 175px; height: 24px; padding-top: 3px;" required="true" requiredMessage="Tipo de camisa es un campo requerido" styleClass="ui-widget ui-inputfield ui-state-default ui-corner-all">
<f:selectItem itemValue="0" itemLabel="-- Seleccione --"/>
<f:selectItem itemValue="1" itemLabel="Polo"/>
<f:selectItem itemValue="2" itemLabel="Oxford"/>
<!-- <f:selectItem itemValue="3" itemLabel="Remate"/>
<f:selectItem itemValue="4" itemLabel="Otro"/> -->
</h:selectOneMenu>
<i:etiquetaRequerido value="Talla de camisa" />
<h:selectOneMenu id="talla" value="" style="width: 175px; height: 24px; padding-top: 3px;" required="true" requiredMessage="Talla de camisa es un campo requerido" styleClass="ui-widget ui-inputfield ui-state-default ui-corner-all">
<f:selectItem itemValue="0" itemLabel="-- Seleccione --"/>
<f:selectItem itemValue="1" itemLabel="S"/>
<f:selectItem itemValue="2" itemLabel="M"/>
<f:selectItem itemValue="3" itemLabel="L"/>
<f:selectItem itemValue="4" itemLabel="XL"/>
<f:selectItem itemValue="5" itemLabel="XXL"/>
</h:selectOneMenu>
<i:etiquetaRequerido id="valorUniforme" value="Valor"/>
<p:inputText id="valor" value="" required="true" requiredMessage="Valor es un campo requerido" />
<i:etiquetaRequerido id="aplicaDes" value="Aplica Descuento"/>
<h:selectOneMenu id="aplicaDescuento" value="" style="width: 120px; height: 24px; padding-top: 3px;" required="true" requiredMessage="Aplica descuento es un campo requerido" styleClass="ui-widget ui-inputfield ui-state-default ui-corner-all">
<f:selectItem itemValue="0" itemLabel="-- Seleccione --"/>
<f:selectItem itemValue="1" itemLabel="Si"/>
<f:selectItem itemValue="2" itemLabel="No"/>
<!--<f:selectItem itemValue="3" itemLabel="L"/>
<f:selectItem itemValue="4" itemLabel="XL"/>
<f:selectItem itemValue="5" itemLabel="XXL"/> -->
</h:selectOneMenu>
<h:outputText id="observaciones" value="Observaciones"/>
<p:inputTextarea cols="20" rows="2" value=""/>
<i:etiquetaRequerido value="Tipo de planilla" />
<h:selectOneMenu id="LstTipoPlanilla" style="height: 25px;padding-top: 3px;width: 200px;" required="true" requiredMessage="Tipo de planilla es un campo requerido" label="Tipo Planilla" value="#{reportePlanilla.tipoPlanilla}" >
<f:selectItem itemValue="-1" itemLabel="[ SELECCIONE TIPO PLANILLA ]" />
<f:selectItems value="#{reportePlanilla.listaTipos}" var="tipo" itemValue="#{tipo.tiposPlanillaPK.codTipopla}" itemLabel="#{tipo.nomTipopla}"/>
</h:selectOneMenu>
<i:etiquetaRequerido value="ProgramaciĆ³n planilla" />
<p:inputText id="planilla" required="true" requiredMessage="Planilla es un campo requerido" />
</h:panelGrid> <!-- ES EL MAS EXTERNO -->
<p:spacer height="10" />
</ui:define>
<ui:define name="dialogos">
<p:dialog widgetVar="dialogoEditar" header="Editar candidato" modal="true" draggable="true" resizable="false" closable="true" width="650">
<p:dataTable id="tablaEmpleados" value="#{uniformesBackendBean.empleadosListModel}" var="empleado" rows="5" paginator="true" paginatorAlwaysVisible="true" pageLinks="5" onRowSelectUpdate="principalForm:editarAceptarCommandButton" onRowUnselectUpdate="principalForm:editarAceptarCommandButton" emptyMessage="No se han encontrado Empleados.">
<f:facet name="header">
<h:outputText value="Empleados"/>
</f:facet>
<p:column headerText="ID " filterBy="#{empleado.empleadosPK.codEmp}" filterMatchMode="contains" style="width: 10%;" >
<h:outputText value="#{empleado.empleadosPK.codEmp}"/>
</p:column>
<p:column headerText="Nombre del empleado" filterBy="#{empleado.nombreCompleto}" filterMatchMode="contains">
<h:outputText value="#{empleado.nombreCompleto}"/>
</p:column>
<p:column headerText="Seleccionar" style="width: 8%;" >
<p:commandButton id="editarAceptarCommandButton" image="ui-icon ui-icon-circle-check" onclick="dialogoEditar.hide();"
action="#{planilla$empleado.editar$action}" update="principalForm:mensajes principalForm:panelAcciones principalForm:panelContenido principalForm:nombreEmpleado" title="Seleccionar empleado" >
<f:setPropertyActionListener value="#{empleado}" target="#{uniformesBackendBean.empleadoSeleccionado}" />
</p:commandButton>
</p:column>
</p:dataTable>
<h:panelGrid columns="2">
<p:commandButton id="editarCancelarCommandButton" value="Cancelar" image="ui-icon ui-icon-circle-close" onclick="dialogoEditar.hide();"
action="#{planilla$empleado.cancelar$action}" update="principalForm:mensajes principalForm:panelAcciones principalForm:panelContenido"/>
</h:panelGrid>
</p:dialog>
</ui:define>
</ui:composition>
Did you tried like action= "#{uniformesBackendBean.refrescarCandidatos}".
Without using () small braces?
And your button or link should be inside <h:form>...</h:form> tag.
Example:
<h:form>
<p:commandLink styleClass="opcionMenu"
style="color:blue"
ajax="true"
update="principalForm:tabla"
oncomplete="dialogoEditar.show();"
rendered="true"
action="#{uniformesBackendBean.refrescarCandidatos}" >
<p:graphicImage value="/resources/iconos/personal.png"/>
<h:outputText value="Seleccionar empleado" styleClass="espacioTexto"/>
</p:commandLink>
</h:form>