I want to validate required fields on diferent forms when i push on save (Toolbar.xhtml). How can i do this? Thanks in advance
I have the following code:
Father.xhtml
..
<ui:include src="/jsf/Toolbar.xhtml"/>
<ui:include src="/jsf/Adquisicion.xhtml"/>
..
Toolbar.xhtml
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich"
>
<ui:insert name="toolbarComponent">
<h:form name="ToolbarForm" >
<a4j:commandLink id="save" action="#{backingBean1.save}"/>
</h:form>
</ui:insert>
</ui:composition>
Adquisicion.xhtml
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:a4j="http://richfaces.org/a4j"
xmlns:rich="http://richfaces.org/rich">
<ui:insert name="component">
<a4j:form id="Adquisicion">
<rich:panel>
<f:facet name="header">
<h:outputText value="Header" />
</f:facet>
<h:panelGrid columns="3">
<h:outputText value="Name" />
<h:inputText id="nameId" value="#{adquisicion.name}" style="width:500px;" required="true" requiredMessage="Required" >
<a4j:support event="onblur"/>
</h:inputText>
<rich:message for="nameId" style="color: red;"/>
</rich:panel>
<a4j:form>
</ui:insert>
<ui:composition>
The input fields have to go in the same <h:form> (or <a4j:form>, whatever you like) as the command link/button.
Related
I have a xhtml page which has a page included through a value of a bean which is updated through ajax.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:body>
<div class="ui-fluid">
<p:messages id="messages" showDetail="false" closable="true" />
<h:form id="form">
<p:panel id="panelInfo" header="Dados Local Instalação">
<h:outputLabel for="tipoFornecimento" value="Tipo de Fornecimento"/>
<p:selectOneMenu id="tipoFornecimento" value="#{cadastroController.localInstalacao.tipoFornecimento}">
<f:selectItems value="#{cadastroController.tiposFornecimento}"/>
</p:selectOneMenu>
<h:outputLabel for="familiaEquipamento" value="Família"/>
<p:selectOneMenu id="familiaEquipamento" value="#{cadastroController.familia}" required="true">
<f:selectItem itemLabel="Selecione"/>
<f:selectItems value="#{cadastroController.familias}"/>
<f:ajax listener="#{cadastroController.setarEquipamentoPelaFamilia}" render=":form:panelEquipamento"/>
</p:selectOneMenu>
</p:panel>
<p:panel id="panelEndereco" header="Endereço">
<ui:include src="/logradouro.xhtml"/>
</p:panel>
<p:panel id="equipamentoNa" header="Equipamento NA">
<ui:include src="/equipamentoNa.xhtml"/>
</p:panel>
<p:panel id="panelEquipamento" header="Equipamento">
<ui:include src="#{cadastroController.panelEquipamento}"/>
</p:panel>
<p:commandButton value="Salvar" actionListener="#{cadastroController.salvarLocalInstalacao}" ajax="false"/>
</h:form>
</div>
</h:body>
</html>
When I change the value of the selectOneMenu familiaEquipamento it triggers a method in the bean which instatiate a bean and adds the correspondent xhtml to the page
public void setarEquipamentoPelaFamilia() {
switch(familia) {
case AL:
localInstalacao.setEquipamento(new Alimentador());
setPanelEquipamento("alimentador.xhtml");
break;
case BF:
case CD:
case CDA:
case CDP:
case CO:
case CR:
case CT:
localInstalacao.setEquipamento(new ChaveFaca());
setPanelEquipamento("chaveFaca.xhtml");
break;
case FF:
case FP:
case FR:
case FT:
case FU:
localInstalacao.setEquipamento(new ChaveFusivel());
setPanelEquipamento("chaveFusivel.xhtml");
break;
case RG:
localInstalacao.setEquipamento(new BancoRegulador());
setPanelEquipamento("reguladorTensao.xhtml");
break;
case RL:
localInstalacao.setEquipamento(new Religador());
setPanelEquipamento("religador.xhtml");
break;
case BC:
localInstalacao.setEquipamento(new BancoCapacitor());
setPanelEquipamento("bancoCapacitor.xhtml");
break;
case TD:
case TDP:
localInstalacao.setEquipamento(new Trafo());
setPanelEquipamento("transformador.xhtml");
break;
case SL:
localInstalacao.setEquipamento(new Seccionalizador());
setPanelEquipamento("seccionalizador.xhtml");
break;
}
localInstalacao.getEquipamento().setFamilia(familia);
}
I.E. I choose the familia 'AL', so it sets the equipamento to new Alimentador() and returns the page 'alimentador.xhtml'.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets">
<p:outputLabel for="fasesEquipamento" value="Qtd Fases: " />
<p:selectOneMenu id="fasesEquipamento" value="#{cadastroController.localInstalacao.equipamento.fases}">
<f:selectItems value="#{cadastroController.fases}"/>
</p:selectOneMenu>
<p:outputLabel for="nrAlimentador" value="Número Alimentador: " />
<p:inputMask mask="9?9" id="nrAlimentador" value="#{cadastroController.localInstalacao.equipamento.nrAlimentador}"/>
<p:outputLabel for="nrEquipamento" value="Número Equipamento: " />
<p:inputMask mask="9?9999" id="nrEquipamento" value="#{cadastroController.localInstalacao.equipamento.nrEquipamento}"/>
<p:outputLabel for="nrEquipamentoAnterior" value="Número Equipamento Anterior: " />
<p:inputMask mask="9?9999" id="nrEquipamentoAnterior" value="#{cadastroController.localInstalacao.equipamento.nrEquipamentoAnterior}"/>
<p:outputLabel for="nrSubestacao" value="Número Subestação: " />
<p:inputMask mask="9?99" id="nrSubestacao" value="#{cadastroController.localInstalacao.equipamento.nrSubestacao}"/>
<p:outputLabel for="potencia" value="Potencia: " />
<p:inputMask mask="9?99.9" id="potencia" value="#{cadastroController.localInstalacao.equipamento.potencia}"/>
<p:outputLabel for="regionalEquipamento" value="Regional: " />
<p:selectOneMenu id="regionalEquipamento" value="#{cadastroController.localInstalacao.equipamento.regional}">
<f:selectItems value="#{cadastroController.regionais}"/>
</p:selectOneMenu>
</ui:composition>
I'm using a ViewScoped ManagedBean, but after submitting the form, the values which were added through ajax in the 'alimentador.xhtml' are not binded to the bean localInstalacao
Any ideas?
Never mind, I managed to fix it by upgrading to Mojarra 2.2
It seems like a known bug described on JAVASERVERFACES - 1492
To upgrade the version of Mojarra in JBOSS AS 7.1 follow these steps Upgrading Mojarra
I have a problem with selection primefaces datatable. When I choose any record my setter doesn't invoke. I found couple solution like change template or change to ViewSCope I'm changing everything but still does't work
template.xhtml
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:c="http://java.sun.com/jsf/composite/custom"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
<title><ui:insert name="title">Default title</ui:insert></title>
<f:facet name="first">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Social Test</title>
</f:facet>
<f:facet name="middle">
<h:outputStylesheet name="bootstrap/css/bootstrap.css" />
<h:outputStylesheet name="css/style.css" />
<h:outputStylesheet name="bootstrap/css/bootstrap-social.css" />
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" />
<h:outputScript name="bootstrap/js/bootstrap.js" />
<!-- h:outputScript name="js/script.js" /-->
</f:facet>
<f:facet name="last">
</f:facet>
</h:head>
<h:body>
<div id="header"></div>
<div id="menu"></div>
<div id="content">
<ui:insert name="content"></ui:insert>
</div>
<div id="footer"></div>
</h:body>
</html>
ticketEdit.xhtml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition template="/template/template.xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:c="http://java.sun.com/jsf/composite/custom"
xmlns:p="http://primefaces.org/ui">
<ui:define name="content">
<h2 class="form-signin-heading">#{labRes.add_ticket}</h2>
<h:form id="form">
<p:accordionPanel>
<p:tab title="#{labRes.train_details}">
<h:panelGrid columns="2" cellpadding="10">
<c:autoComplete
completeMethod="#{ticketBean.trainAutoCompleteBean.complete}"
minQueryLength="2"
converter="#{ticketBean.trainAutoCompleteBean.converter}"
nameLable="#{labRes.train_number}"
autoValue="#{ticketBean.selectedTrain}" forceSelection="true"
queryDelay="500" effect="fade" cid="ticketAuto" listener="null"
labelStyleClass="labelPaddingParameter" ajax="true"
update="#form" />
<c:inputText id="nr" cid="cnr"
nameLable="#{labRes.train_number}" disabled="true"
inputValue="#{ticketBean.selectedTrain.name}"
labelStyleClass="labelPaddingParameter" />
</h:panelGrid>
</p:tab>
<p:tab title="#{labRes.train_details}">
<h:panelGrid columns="1" cellpadding="10" id="pgTrainDetails">
<c:calendar pattern="MM-dd-yyyy" value="#{ticketBean.day}"
isListener="true" update=":form" ajax="true"
nameLable="#{labRes.departure_date}" cid="depDat"
listener="#{ticketBean.onDateSelect}" />
<p:dataTable var="schedule" value="#{ticketBean.tripSchedules}"
selectionMode="single"
selection="#{ticketBean.selectedSchedule}"
rowKey="#{schedule.id}" styleClass="pickListWidth"
paginator="true" rows="10"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
rowsPerPageTemplate="5" id="scheduleTable">
<f:facet name="header">
<c:calendar pattern="MM-dd-yyyy" value="#{ticketBean.day}"
isListener="true" update=":form" ajax="true"
nameLable="#{labRes.departure_date}" cid="depDat"
listener="#{ticketBean.onDateSelect}" />
</f:facet>
<p:column headerText="#{menRes.id}" sortBy="#{schedule.id}"
style=" text-align:center">
<h:outputText value="#{schedule.id}" />
</p:column>
<p:column headerText="#{labRes.departure_time}"
sortBy="#{schedule.departure}" style="text-align:center">
<h:outputText value="#{schedule.departure}" />
</p:column>
</p:dataTable>
</h:panelGrid>
</p:tab>
<p:tab title="#{labRes.ticket_details}">
<h:panelGrid columns="2" cellpadding="10">
</h:panelGrid>
</p:tab>
</p:accordionPanel>
</h:form>
</ui:define>
My bean (I'm using Spring) but I have to use #ViewScope because spring does't contain #Scope('view')
// the same annotations in AbstractBean
#Component
#ViewScope //faces bean package
public class TicketBean extends AbstractBean {
... code ...
public TripSchedule getSelectedSchedule() {
return selectedSchedule;
}
public void setSelectedSchedule(TripSchedule selectedSchedule) {
this.selectedSchedule = selectedSchedule;
}
Thanks for help !
I think you need to add some ajax to the datatable:
<p:ajax event="rowSelect"/>
<p:ajax event="rowUnselect"/>
I am new to PrimeFaces and I am having trouble getting simple validation messages to display. Below is my simple JSF page. Can someone point me in the right direction as what I am doing wrong?
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<f:view contentType="text/html">
<h:head>
<meta content='text/html; charset=UTF-8' http-equiv="Content-Type" />
<title>Add Tournament</title>
</h:head>
<h:body>
<h:form>
<p:layout fullPage="true" >
<p:layoutUnit position="center">
<f:view>
<div align="center">
<h1><h:outputText value="Create/Edit Tournament"/></h1>
<p:panel>
<p:messages globalOnly="false" id="msgs" autoUpdate="true"/>
<p:panelGrid columns="2">
<p:outputLabel value="TournamentName:" for="tournamentName" />
<p:inputText required="true" id="tournamentName" value="#{tournamentProfile.tournament.tournamentName}" title="TournamentName" requiredMessage="Tournament name is required." />
<p:outputLabel value="" for="addTournament" />
<p:commandButton validateClient="true" update="msgs" id="addTournament" value="Add Tournament" />
</p:panelGrid>
</p:panel>
</div>
</f:view>
</p:layoutUnit>
</p:layout>
</h:form>
</h:body>
</f:view>
</html>
I have problems after click on submit button. Primafaces validation is executed and the calendars buttons dissapears.
The structure of the application view is a principal page that contains other. In the principal page which name is "welcomePrimefaces" I call to the other page wich name is left_layoutUnit using a ui:include
I am using primefaces 3.5, Mojarra 2.1.6
Somebody could help me???
welcomePrimefaces.xhtml
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<f:view contentType="text/html">
<h:head>
<link type="text/css" rel="stylesheet" href="css/styles.css"/>
<f:facet name="first">
<meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
<title>PrimeFaces</title>
</f:facet>
<script type="text/javascript">
function handleLoginRequest(xhr, status, args) {
if(args.validationFailed || !args.loggedIn) {
jQuery('#dialog').effect("shake", { times:3 }, 100);
} else {
dlg.hide();
jQuery('#loginLink').fadeOut();
}
}
</script>
</h:head>
<h:body>
<p:layout fullPage="true">
<p:layoutUnit position="north" size="100" styleClass="ui-layout-header">
<ui:include src="header_layoutUnit.xhtml" />
</p:layoutUnit>
<p:layoutUnit id="footer" position="south" size="100" closable="false" collapsible="false">
<ui:include src="footer_layoutUnit.xhtml" />
</p:layoutUnit>
<p:layoutUnit position="west" size="500" closable="false" collapsible="false">
<ui:include src="left_layoutUnit.xhtml" />
</p:layoutUnit>
<p:layoutUnit position="center" styleClass="ui-layout-center">
<ui:include src="right_layoutUnit.xhtml" />
</p:layoutUnit>
</p:layout>
</h:body>
</f:view>
left_layoutUnit.xhtml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<h:head>
<h:form id="form">
<p:panel id="panel" header="Panel Title">
<p:messages id="msgs"/>
<p:panelGrid id="theGrid" columns="1">
<p:row>
<p:column>
<p:calendar value="#{formBean.date1}" id="popupButtonCal1" showOn="button" maxlength="8" size="15"
required="true" requiredMessage="Fecha ida is required"/>
</p:column>
</p:row>
<p:row>
<p:column>
<p:calendar value="#{formBean.date2}" id="popupButtonCal2" showOn="button" maxlength="8" size="15"
required="true" requiredMessage="Fecha vuelta is required"/>
</p:column>
</p:row>
<p:dialog header="Selected Dates" widgetVar="dialog" showEffect="fade" hideEffect="fade">
<h:panelGrid id="display" columns="1">
<h:outputText value="Popup Button Date: " />
<h:outputText id="popupButtonDate">
<f:convertDateTime pattern="d/M/yyyy"/>
</h:outputText>
</h:panelGrid>
</p:dialog>
<p:row>
<p:column>
<p:commandButton value="Submit" update="panel" actionListener="#{formBean.buscarVuelos}"/>
</p:column>
</p:row>
</p:panelGrid>
</p:panel>
</h:form>
</h:head>
Running Netbeans 7.1.1 with latest JRE/JDK and Glassfish 3.1 on Windows 7.0.
Despite what sort of application I build, for some reason I have to click any commandLink or commandButton twice to get event to fire.
How is this caused and how can I solve it?
Here's an example of such a view where this problem occurs:
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:c="http://java.sun.com/jsp/jstl/core">
<h:head>
<title>Time Manager - New Employee</title>
</h:head>
<h:body>
<h:form id="form"">
<p:panel id="panel" header="New Employee">
<p:messages id="msgs"/>
<h:panelGrid columns="3">
<h:outputLabel for="fname" value="Firstname: *" />
<p:inputText id="fname" value="#{employee.name}"
required="true" label="FullName">
<f:validateLength minimum="2" maximum="20" />
</p:inputText>
<p:message for="fname" display="icon"/>
<h:outputLabel for="eml" value="Email: *" />
<p:inputText id="eml" value="#{employee.email}"
label="Email" required="true">
<f:validateLength minimum="9" maximum="100" />
<p:ajax update="msgEml" event="keyup" />
</p:inputText>
<p:message for="eml" id="msgEml" display="icon"/>
</h:panelGrid>
<p:button id="btn" value="Cancel" update="panel"
type="button" outcome="/index"/>
<p:commandButton id="addEmp" value="Save" update="panel"
actionListener="#{employee.saveEmployee}"
styleClass="ui-priority-primary"/>
</p:panel>
</h:form>
</h:body>
</html>