commandLink not work primefaces mobile - primefaces-mobile

primefaces mobile commandLink action does not work, it's not loading the page with id="station1". f:setPropertyActionListener is work and call setSelectedStation() method .
<pm:page id="fastStationPage">
<pm:header title="Fast Charging Station" swatch="b" ></pm:header>
<pm:content>
<h:form id="stationsDetailsForm">
<p:growl id="messages" showDetail="true" />
<p:dataList value="#{navigationViewImpl.fastStationList}" var="station" type="ordered">
<p:commandLink value="#{station.name}" action="pm:station1?transition=slide" update=":station1:stationDetail">
<f:setPropertyActionListener value="#{station}" target="#{navigationViewImpl.selectedStation}" />
</p:commandLink>
</p:dataList>
</h:form>
</pm:content>
</pm:page>
<pm:page id="station1">
<pm:content>
<h:outputText id="stationDetail" value="#{navigationViewImpl.selectedStation.name}" escape="false"/>
</pm:content>
</pm:page>
public void setSelectedStation(StationDTO selectedStation) {
this.selectedStation = selectedStation;
}

I got answer. I not configure face-config.xml file. I am not add navigation-handler
<application>
<navigation-handler>
org.primefaces.mobile.application.MobileNavigationHandler
</navigation-handler>
</application>

Related

PrimeFaces 8.0 / 10.0.RC1: dialog form validation runs when processing form from other dialog

I'm opening dialog1 from which I open dialog2, each have their own forms which are not nested in each other.
When I show dialog2 from a button inside the dialog1 form, submitting the dialog2 validates the dialog1 form - I do not want this.
When I show dialog2 from a button outside the dialog1 form, submitting the dialog2 doesn't run the dialog1 forms' validation.
I tested it on Primefaces 8.0 and 10.0.RC1, it behaves the same.
Why is this happening? Why does it matter where I show the dialog from?
Thank you.
sample code:
<?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>
<ui:composition
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core"
template="/template.xhtml">
<ui:define name="content">
<p:dialog appendTo="#(body)" widgetVar="dialog1" modal="true" header="dialog1"
showEffect="clip" closeOnEscape="true"
hideEffect="clip" responsive="true" width="700px" focus=":submitButtonForm:submitButton"
height="500">
<p:remoteCommand name="showDialog2" action="PF('dialog2').show();"/>
<h:form id="form1">
<p:outputPanel>
<p:outputLabel for="required1" value="dialog1value"/>
<p:inputText id="required1" required="true" value="#{test.dialog1value}"/>
<p:outputLabel for="dialog2value" value="dialog2value"/>
<p:inputText id="dialog2value" required="true" value="#{test.dialog2value}"/>
</p:outputPanel>
<p:commandButton value="show dialog2 from within form1 of dialog1 (dialog2 Submit then validates form1)"
onclick="PF('dialog2').show();"/>
</h:form>
<p:commandButton value="show dialog 2 from body of dialog1 (dialog2 Submit then DOES NOT validate form1)"
onclick="PF('dialog2').show();"/>
<f:facet name="footer">
<h:form id="submitButtonForm">
<p:commandButton partialSubmit="true"
id="submitButton" value="Submit" actionListener="#{test.dialog1Submit}"
update=":form1" process=":submitButtonForm,:form1"
style="float:right;margin-bottom: 20px;"/>
</h:form>
</f:facet>
</p:dialog>
<p:dialog appendTo="#(body)" widgetVar="dialog2" modal="true" header="dialog2"
showEffect="clip" closeOnEscape="true"
hideEffect="clip" responsive="true" width="700px" focus=":submitButtonForm:submitButton"
height="500">
<h:form id="form2">
<p:outputPanel>
<p:outputLabel for="required2" value="dialog2value"/>
<p:inputText id="required2" required="true" value="#{test.dialog2value}"/>
</p:outputPanel>
</h:form>
<f:facet name="footer">
<h:form id="submitButtonForm2">
<p:commandButton partialSubmit="true"
id="submitButton2" value="Submit" actionListener="#{test.dialog2Submit}"
update=":form2,:form1" process=":submitButtonForm2,:form2"
style="float:right;margin-bottom: 20px;"/>
</h:form>
</f:facet>
</p:dialog>
<p:commandButton value="show dialog 1" oncomplete="PF('dialog1').show();"/>
</ui:define>
</ui:composition>
</html>
import lombok.Getter;
import lombok.Setter;
import org.springframework.stereotype.Component;
import javax.faces.view.ViewScoped;
#Component
#ViewScoped
public class Test {
#Getter
#Setter
private String dialog1value, dialog2value;
public void dialog1Submit() {
System.out.println("dialog1 submitted");
}
public void dialog2Submit() {
System.out.println("dialog2 submitted");
}
}
Change your commandButton to return false to stop it from Submitting the AJAX form...
<p:commandButton
value="show dialog 2 from body of dialog1 (dialog2 Submit then DOES NOT validate form1)"
onclick="PF('dialog2').show();return false;"/>

Clearing forms and components in JSF 2.2 [duplicate]

This question already has answers here:
Clear JSF form input values after submitting
(5 answers)
Closed 5 years ago.
After you have made a registration, it clears the form normally, but when I turn the page and come back to the registration page, the fields are filled with the values ​​I have registered before. The scoped I'm using is #ViewScoped.
Registration page..
Realizar Emprestimos
<h:form id="form" prependId="false">
<p:messages id="msgs"/>
<p:toolbar>
<f:facet name="left">
<p:toolbarGroup>
<p:commandButton value="Confirmar" action="#{empMB.inserir}" process="#this"
update="form:list_publicacao" ajax="false">
<f:ajax render="form:list_publicacao" resetValues="true"/>
</p:commandButton>
</p:toolbarGroup>
</f:facet>
<f:facet name="right">
<p:toolbarGroup>
<p:commandButton value="Cancelar" action="#{empMB.limparCampos()}"
immediate="true">
<f:ajax render="#form" resetValues="true"/>
</p:commandButton>
</p:toolbarGroup>
</f:facet>
</p:toolbar>
<f:ajax event="blur">
<h:panelGrid id="p1" columns="4" layout="grid">
<p:outputLabel value="Usuário: " for="usuario" />
<p:selectOneMenu id="usuario" effect="fade" filter="true"
filterMatchMode="contains"
value="#{empMB.emprestimo.usuario.idUsuario}" required="true"
requiredMessage="Selecione um usuário">
<f:selectItem itemLabel="selecione um usuario"
noSelectionOption="true" />
<f:selectItems value="#{usuarioMB.todosUsuarios}" var="usu"
itemValue="#{usu.idUsuario}" itemLabel="#{usu.nomeUsuario}" />
</p:selectOneMenu>
<p:outputLabel value="Data Emprestimo: " for="dataEmprestimo" />
<p:calendar id="dataEmprestimo"
value="#{empMB.emprestimo.dataEmprestimo}" effect="fold"
navigator="true" required="true"
requiredMessage="Inserir uma data do emprestimo"
pattern="dd/MM/yyyy" title="Data do Emprestimo">
<f:convertDateTime pattern="dd/MM/yyyy" locale="pt_BR"
timeZone="America/Sao_Paulo" />
</p:calendar>
</h:panelGrid>
<h:panelGrid id="p2" columns="2" layout="grid">
<p:outputLabel value="Publicacao: " for="publicacao" />
<p:selectOneMenu label="Publicação:" id="publicacao" effect="fade"
filter="true" filterMatchMode="contains"
value="#{empMB.emprestimo.publicacao.publicacaoId}">
<f:selectItem itemLabel="Selecione uma publicação"
noSelectionOption="true" />
<f:selectItems value="#{pubMB.publicacoesDisponiveis}" var="pub"
itemValue="#{pub.publicacaoId}" itemLabel="#{pub.titulo}" />
<f:ajax listener="#{empMB.setlistPublicacao()}"
render="list_publicacao msgs publicacao" />
</p:selectOneMenu>
</h:panelGrid>
<h2 style="font-size: 1.9em; margin-top: 3%;">Publicações
selecionadas</h2>
<p:dataTable reflow="true" id="list_publicacao"
value="#{empMB.listPublicacaoDesejada}" var="pub"
emptyMessage="Suas publicações aparecerão aqui.">
<ui:include src="/colunasPublicacoes.xhtml" />
</p:dataTable>
</f:ajax>
</h:form>
</ui:define>
Method..
public Emprestimo inserir() {
System.out.println(getListPublicacaoDesejada().size());
try {
for (int i = 0; i < getListPublicacaoDesejada().size(); i++) {
Calendar dataPrevista = Calendar.getInstance();
dataPrevista.setTime(emprestimo.getDataEmprestimo());
dataPrevista.add(Calendar.DAY_OF_MONTH,
Integer.parseInt(JSFHelper.getExternalContext().getInitParameter("previsaoDevolucao")));
emprestimo.setFuncionarioEmprestimo("usuarioteste08");
emprestimo.setDataPrevistaDevolucao(dataPrevista.getTime());
emprestimo.getPublicacao().setPublicacaoId(emprestimo.getListPublicacao().get(i).getPublicacaoId());
emprestimoFacade.inserir(emprestimo);
}
FacesMessage message = new FacesMessage(FacesMessage.SEVERITY_INFO, "Emprestimo(s)", "realizado(s) com sucesso!");
RequestContext.getCurrentInstance().showMessageInDialog(message);
emprestimo = new Emprestimo();
return emprestimo;
} catch (DAOException e) {
e.printStackTrace();
FacesMessage message = new FacesMessage(FacesMessage.SEVERITY_INFO, "Atenção", "Erro ao realizada emprestimo");
RequestContext.getCurrentInstance().showMessageInDialog(message);
return null;
}
}
Thank you very much in advance.
Solved, I added the PostConstruct method at the beginning of MB.
#PostConstruct
public void init() {
emprestimo = new Emprestimo();
}

Primefaces v.5.3.5 confirm dialog render issue outside main h:form and inside main form is rendered but it is not working properly

I am using PF v.5.3.5 and JSF v.2.2.8. It is a frequent topic in SO. I noticed that there is a bug in PF v.5.3.5 documentation related to the appendTo attribute.
1st approach
The p:confirmDialog is rendered and commandbuttons are rendered but actions does not work and message is not rendered if it is placed inside of nested h:form.
2st approach
If I place this dialog outside of main h:form it is not rendered at all also if I add the global="true" attribute.
3st approach
The p:confirmDialog is rendered and commandbuttons are rendered but actions does not work and message is rendered if the nested h:form is removed.
<h:form>
...
<p:confirmDialog id="askSessionDialog1" widgetVar="askSessionDialog1" severity="alert"
appendTo="#(body)" rendered="#{treeData.askSessionDialogRendered}" visible="#{treeData.askSessionDialogRendered}">
<h:form>
<f:facet name="message">
<h:outputText value="#{msg.WEB_ADMIN_PAGES_TREESEGMENT_NOSESSION}" escape="false"/>
</f:facet>
<p:commandButton value="#{msg.WEB_BUTTONS_OK}" action="#{treeData.save(false, true)}" icon="fa fa-check"
update="#(form)" type="button" />
<p:commandButton value="#{msg.WEB_BUTTONS_CANCEL}" action="#{treeData.setAskSessionDialogRendered(false)}"
icon="fa fa-close" onclick="PF('askSessionDialog1.hide()')" update="#(form)" type="reset" />
</h:form>
</p:confirmDialog>
...
</h:form>
BECKEND PART
setAskSessionDialogRendered(true);
RequestContext.getCurrentInstance().update("treeSegmentForm askSessionDialog askTurnOffDialog askSessionDialog1 askTurnOffDialog1");
Thanks in advance for constructive posts and comments.
SOLVED
This is the best approach that works for me now.
<h:form>
...
<p:confirmDialog id="askSessionDialog" widgetVar="askSessionDialog" severity="alert"
appendTo="#(body)" rendered="#{treeData.askSessionDialogRendered}" visible="#{treeData.askSessionDialogRendered}">
<f:facet name="message">
<h:outputText value="#{msg.WEB_ADMIN_PAGES_TREESEGMENT_NOSESSION}" escape="false"/>
</f:facet>
<h:form>
<p:commandButton value="#{msg.WEB_BUTTONS_OK}" icon="fa fa-check" type="button" accesskey="o">
<p:ajax event="click" listener="#{treeData.save(false, true)}" oncomplete="PF('askSessionDialog').hide()"
update="#(form)" />
</p:commandButton>
<p:commandButton value="#{msg.WEB_BUTTONS_CANCEL}" icon="fa fa-close" type="reset" accesskey="c">
<p:ajax event="click" listener="#{treeData.setAskSessionDialogRendered(false)}"
onsuccess="PF('askSessionDialog').hide()" update="#(form)" />
</p:commandButton>
</h:form>
</p:confirmDialog>
...
</h:form>
BACKEND
setAskSessionDialogRendered(true);
RequestContext.getCurrentInstance().update("treeSegmentForm");
SPACIAL THANKS TO: #YagamiLight
He helped me to kick off my solution.

how to edit single row in rich:dataTable

i have to edit a row in a table using rich faces 4 and modal panel. I am new one so please tell me in details and i know to make a table in rich faces. i already searched so many things but not getting any fruitful
See answer for question "Richfaces: show details in popup [commandbutton, action and popupPanel]". It works in RichFaces 4.x with rowClick.
Or here is example with commandLink:
<a4j:commandLink action="#{actionBean.setupTransactionDetails}"
event="onclick" render="transactionDetails"
oncomplete="#{rich:component('transactionDetails')}.show()"
styleClass="rich-link">
<h:outputText value="#{res.transactionType}" />
<f:setPropertyActionListener value="#{res.transactionId}"
target="#{profile.transactionId}" />
</a4j:commandLink>
But I prefer updated version like this:
<a4j:jsFunction name="showDetail" action="#{actionBean.setupTransactionDetails}"
oncomplete="#{rich:component('transactionDetails')}.show();"
render="transactionDetails">
<a4j:param name="id" assignTo="#{profile.transactionId}"
converter="javax.faces.Long" />
</a4j:jsFunction>
<rich:dataTable id="txnTable" rows="#{referenceData.recordsPerPage}"
style="width: 100%" rowClasses="oddrow, evenrow"
value="#{profile.transactions}" var="res" sortMode="single">
<h:column width="110">
<f:facet name="header">
<h:outputText value="#{msg.transactionType}" />
</f:facet>
<a4j:commandLink onclick="showDetail('#{res.transactionId}');"
value="#{res.transactionType}" />
</h:column>
</rich:dataTable>
<rich:popupPanel id="transactionDetails" autosized="true"
style="max-height:600px;">
<!-- f:facet name="header" and f:facet name="controls" here -->
<h:form id="transactionDetailsForm">
<!-- some details here -->
</h:form>
</rich:popupPanel>
Profile backing bean
private Long transactionId; // + getter and setter
Action backing bean
public void setupTransactionDetails() {
Transaction txn = DAO.getInstance().get(Transaction.class, getProfile().getTransactionId());
transactionForm.setup(txn);
}
In case if you use EL 2.2 (or higher) you can call action bean method with parameter.

synchronization validation and display of dialog in a PrimeFaces JSF2.0 form

I have a form with jsf2 and primefaces that contains a submit button that managed two things:
First: form validation with the update attribute and second launching a confirmation dialog box when validation succeeded and all of this are managed by:
update="myfieldset display"
so my problem is that when I click into the button validation: if validation don't succeeded : validation messages are displayed in the form : ok
but if the validation succeeded I must click a second time to display dialog box
anyone know how to solve this problem there?
<!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:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core">
<script type="text/javascript">
<!--
function effacer(formulaire){
for (var i=0; i<formulaire.length; i++){
if (formulaire.elements[i].type=="input" || formulaire.elements[i].type=="textarea" ) {formulaire.elements[i].value="";}
}
document.getElementById('contenu_input').value="";
}
//-->
</script>
<body>
<ui:composition template="./template_utilisateur.xhtml">
<ui:define name="content">
<h:form id="form" prependId="false" >
<p:fieldset id="myfieldset" legend="Nouveau message">
<p:messages id="msgs"/>
<h:panelGrid columns="3" style="margin-bottom:10px">
<h:outputLabel for="title" value="Titre : *"/>
<p:inputText id="title" style="width:340px;" value="#{messageController.titre}" required="true" requiredMessage="veuillez saisir un titre" label="Titre">
<f:validateLength minimum="10" />
</p:inputText>
<p:message for="title" display="icon"/>
<h:outputLabel for="city" value="Destinataire : *" />
<p:selectOneMenu id="city" value="#{messageController.destinataire}" label="Destinataire" required="true" requiredMessage="veuillez choisir au moins un destinataire" >
<f:selectItem itemLabel="Séléctionner déstinataire" itemValue="" />
<f:selectItems value="#{messageController.users}" />
</p:selectOneMenu>
<p:message for="city" id="msgSurname3" display="icon"/>
<h:outputLabel for="comm" value="Lié a La commande N° : " />
<p:selectOneMenu id="comm" label="Commande" value="#{messageController.idComm}" >
<f:selectItem itemLabel="Aucune commande" itemValue="" />
<f:selectItems value="#{messageController.id_c}" />
</p:selectOneMenu>
<p:message for="comm" id="msgSurnamse3" display="icon"/>
</h:panelGrid>
<h:outputLabel for="contenu" value="Contenu : *" />
<h:panelGrid columns="2">
<p:editor id="contenu" widgetVar="editer" value="#{messageController.message}" width="600" required="true" requiredMessage="Veuillez saisir le contenu du message" >
<f:validateLength minimum="10" />
</p:editor>
<p:message for="contenu" id="editorm" display="icon"/>
</h:panelGrid>
<h:panelGrid columns="3">
<p:commandButton id="submitButton" value="envoyer" update="myfieldset display" onclick="#{messageController.retournerDialog()}" icon="ui-icon-disk" />
<p:commandButton id="clearButton" type="reset" value="initialiser" onclick="editer.clear()"
icon="ui-icon-close" />
</h:panelGrid>
</p:fieldset>
<p:dialog header="Confirmation" widgetVar="dlg" showEffect="fade" hideEffect="fade" modal="true">
<h:panelGrid id="display" columns="1" cellpadding="4">
<h:outputText value="Titre : " />
<h:outputText value="#{messageController.titre}" id="model"/>
<h:outputText value="Déstinataire :" />
<h:outputText value="#{messageController.destinataire}" id="year"/>
<h:outputText value="Lié à la commande N° : " />
<h:outputText value="#{messageController.idComm}" id="manufacturer"/>
<h:outputText value="Contenu :" />
<h:outputText id="displxcay" value="#{messageController.message}" escape="false" />
</h:panelGrid>
</p:dialog>
</h:form>
</ui:define>
</ui:composition>
</body>
</html>
and here the method to launch the dialog
public String retournerDialog(){
String retour = "";
if( getDestinataire() != "" && getMessage()!= "" && getTitre()!="" && getMessage().length()>9 && getTitre().length()>9){
retour="dlg.show()";
}
return retour;
}
thank you in advance
Update: thank you BalusC for your detailed response, I tested both of your answers but they don't work
here is the code of the button :
<p:commandButton id="submitButton" value="envoyer" update="myfieldset, display" action="#{messageController.showDialog}" icon="ui-icon-disk" />
and the managedBean :
private boolean showDialog;
public void showDialog() {
showDialog = true;
}
public boolean isShowDialog() {
return showDialog;
}
and with this code above the dialog doesn't appear even if validation is succeeded
: I think because action must return outcome string not boolean
and when I make :
<p:commandButton id="submitButton" value="envoyer" update="myfieldset, display" onclick="dlg.show();" icon="ui-icon-disk" />
it appear even if the validation failed
and to remind you
when I put a method above like this :
<p:commandButton id="submitButton" value="envoyer" update="myfieldset, display" onclick="#{messageController.retournerDialog()}" icon="ui-icon-disk" />
I have to click twice (I think one for validation and one for displaying dialog)for the dialog is displayed
also in the official documentation : they use this dialog with onclick attribute
do you have any other idea