I have a page with a dialog like below. I want to show the user an error message in case the info already exists on the same dialog. This part works fine.
However, if all goes well the dialog should close AND the "success" message should show on the calling page (e.g. in the JSF template p:messages).
I can't get this to work, the message disappears. I tried several options including the remote command.
<p:dialog id="dialogNewMailingList" header="New Mailing List"
modal="true" resizable="false" widgetVar="dialogList">
<h:form id="newMailingListForm">
<p:messages id="listMessages" />
<h:panelGrid columns="2">
<h:outputLabel value="Name :" for="listName"
style="font-weight: bold;" />
<p:inputText id="listName"
value="#{mailingListsEditController.newMailingList.name}"
required="true" requiredMessage="Please fill in a Name" size="50" />
<h:outputLabel value="Description :" for="description"
style="font-weight: bold;" />
<p:inputText id="description"
value="#{mailingListsEditController.newMailingList.description}"
required="true" requiredMessage="Please fill in a Description"
size="50" maxlength="100" />
</h:panelGrid>
<br />
<p:remoteCommand name="updateMessages" update=":messages" />
<p:commandButton
action="#{mailingListsEditController.saveMailingList}"
update="#form,:mailinglists:selectMailingList"
oncomplete="listSaveRequest(xhr, status, args); updateMessages()"
value="Save" icon="ui-icon-disk" />
<p:commandButton onclick="dialogList.hide()" value="Cancel"
immediate="true" icon="ui-icon-cancel" />
</h:form>
</p:dialog>
<script type="text/javascript">
function listSaveRequest(xhr, status, args) {
if(args.validationFailed) {
jQuery('#dialogNewMailingList').effect("shake", { times:3 }, 100);
} else {
//alert('List created successfully.')
dialogList.hide();
}
}
</script>
The bean method save()
public void saveMailingList() {
log.debug("Saving new MailingList :" + newMailingList.getName());
emailService.save(newMailingList);
// show message to the user
FacesContext.getCurrentInstance().addMessage("Save Mailing List",
new FacesMessage("Mailing List successfully created."));
}
I feel I am close to the solution :)
Thanks for any help,
Coen
The p:messages element should be placed outside of the p:dialog. By closing the dialog all child elements get hidden, including the messages.
Related
I have the following jsf login page:
<h:form id="frmAdmLogin" styleClass="form-horizontal">
<div class="ui-layout-center" style="margin-left: 15px;">
<p:messages id="messagesLogin" autoUpdate="true" closable="true" />
<h:panelGrid cellpadding="5">
<p:inputText id="txtUsuario" required="true" value="#{loginDataManager.usuario}" />
<p:password id="pssClave" required="true" value="#{loginDataManager.password}" />
<h:selectOneMenu id="lstSucursales" required="true" value="# {loginDataManager.idSucursal}">
<f:selectItem itemLabel="" itemValue="" />
<f:selectItems value="#{loginController.listadoCatalogos()}" var="sucursal" itemLabel="#{sucursal.nomCatalogo}" itemValue="#{sucursal.id}" />
</h:selectOneMenu>
<p:commandButton id="loginButton" value="Ingresar" action="#{loginController.login()}" />
</h:panelGrid>
</div>
<div id="barras">
<ui:include src="/templates/main/barras.xhtml" />
</div>
</h:form>
After user logs in the application, it should redirect to the main page. But It doesn't work.
For navigate I use the following navigation rules:
<navigation-rule>
<from-view-id>/login/login.xhtml</from-view-id>
<navigation-case>
<from-action>#{loginController.login()}</from-action>
<from-outcome>login</from-outcome>
<to-view-id>/login/login.xhtml</to-view-id>
<redirect/>
</navigation-case>
<navigation-case>
<from-action>#{loginController.login()}</from-action>
<from-outcome>exito</from-outcome>
<to-view-id>/login/main.xhtml</to-view-id>
<redirect/>
</navigation-case>
</navigation-rule>
I have a CDI bean which has the login method:
public String login() {
validarUsuario();
try {
obtenerMenu(sessionDataManagerBase.getUserDto());
return "exito";
} catch (Exception e) {
log.error("", e);
MessagesController.addError(null, "Error al consultar las opciones de menú para el usuario");
FacesContext.getCurrentInstance().validationFailed();
return "login";
}
}
Tomee starts with no errors, and when I click the login button nothing happens: no navigation, no errors in the browser and no errors in Tomee log.
There's something I'm missing in my configuration.
Thanks.
I'm not sure if this is a limitation or a coding error on my part. I have a Primefaces DataTable that allows the user to select it (single select radio) and then click on a CommandButton to edit the data in a Dialog.
In the HTML code where I display the selected object, I omitted the ID, Lat, and Long attributes because a human user shouldn't be touching these attributes. The Dialog is showing the selected attributes correctly, however, when I tried to find the existing record using the selected object's ID for update, it thrown a no result error. When I checked the selected object's ID attribute, it has a value of NULL.
I tinker around with the HTML code and found that in order to have the any of the attributes copied to the selected object, the attributes must be shown in the XHTML. When I include the attribute as with Render = False, the attribute will have a value of NULL. Any suggestions on hiding attributes that human users shouldn't modify beside using Disable tag attribute?
Class Property{
Int ID;
String Address;
Long Lat;
Long Long;
String Desc;
}
public void modifyCurrentProject() {
HashMap<String, Object> params = new HashMap();
params.put("id", currentProject.getId());
//fails to find Project by ID as currentProject.getID == null
Project temp = (Project) dbu.findByNamedQuery("project.findID", params);
//Omit statements to overwrite attached object's values before writing back to database
dbu.modifyEntity(); //dbu is another object to control database access
currentProject = null;
}
<h:body>
<p:growl id="projectMsg" showDetail="true"/>
<h:form id="form">
<p:dataTable id="projectTable" var="project" value="#{projectBacking.builder.projects}" selection="#{projectBacking.currentProject}" rowKey="#{project.id}">
<f:facet name="header">My Project List
<p:commandButton value="Add" type="button" onclick="PF('projectAdd').show()"/>
<p:commandButton value="Edit" update=":editForm" oncomplete="PF('projectEdit').show()"/>
</f:facet>
<p:column selectionMode="single"/>
<p:column headerText="ID">
<h:outputText value="#{project.id}"/>
<p:column headerText="Description">
<h:outputText value="#{project.property.description}"/>
</p:column>
<p:column headerText="Street">
<h:outputText value="#{project.street}"/>
</p:column>
<p:column headerText="City">
<h:outputText value="#{project.city}"/>
</p:column>
<p:column headerText="Province">
<h:outputText value="#{project.state}"/>
</p:column>
<p:column headerText="Latitude">
<h:outputText value="#{project.latitude}"/>
</p:column>
<p:column headerText="Longitude">
<h:outputText value="#{project.longitude}"/>
</p:column>
<p:column headerText="Status">
<h:outputText value="#{project.status}"/>
</p:column>
</p:dataTable>
</h:form>
<!-- Omitted the Add Project Dialog box -->
<p:dialog header="Edit Project" modal="true" height="400" width="80%" widgetVar="projectEdit">
<h:form id="editForm">
<p:panel id="editProject" header="Edit Project" toggleable="true" closable="false">
<!--<h:inputText id="id" value="#{projectBacking.currentProject.id}"/>-->
<h:inputText id="country" value="#{projectBacking.currentProject.country}"/>
<h:inputText id="lat" rendered="true" value="#{projectBacking.currentProject.latitude}"/>
<h:inputText id="long" rendered="true" value="#{projectBacking.currentProject.longitude}"/>
<h:outputLabel for="desc" value="Description" />
<h:inputText id="desc" value="#{projectBacking.currentProject.description}"/>
<h:outputLabel for="street" value="Street" />
<h:inputText id="street" value="#{projectBacking.currentProject.street}"/>
<h:message for="street"/>
<h:outputLabel for="city" value="City:" />
<h:inputText id="city" required="false" value="#{projectBacking.currentProject.city}"/>
<h:message for="city" />
<h:outputLabel for="state" value="Province" />
<h:inputText id="state" required="true" value="#{projectBacking.currentProject.state}"/>
<h:commandButton value="Save Project" type="submit" action="#{projectBacking.modifyCurrentProject()}">
</h:commandButton>
</p:panel>
</h:form>
</p:dialog>
</h:body>
After placing some more breakpoints in the code, I discovered that upon saving the changes in the Dialog, it's creating a new backing bean. If the is set to Render=false, Disabled=true, or ReadOnly=true then new backing bean's object's value will not be set and retain the initial value as specified in the object's constructor.
Basically, the cause is incorrect scope. I was using Request scope when the problem occurred. However, changing to Session scope resolved it.
I have a JSF form and the following code
<h:form>
<h:inputText id="name" value="#{denee.name}" />
<h:inputText id="pw" value="#{denee.password}" />
<h:commandButton id="ahmet" value="Submit" action="#{denee.den4()}"/>
</h:form>
Here is my ManagedBean code. It returns success.xhtml and changes value2
public String den4() {
value2="<h:commandButton id=\"buttonsd\" value=\"Submit\" action=\"#{denee.den4()}\"/>" ;
return "success.xhtml";
}
And here is success.xhtml
<h:outputText escape="false" value="#{denee.value2}" />
When I run my program I can see the JSF commandbutton in the code, but not on the actual page.
I have an accordion panel with few tabs with in a form . Each tab has a command button (I use the update and process attributes to process specific inputs with a tab). I have set the multiple attribute to true on the accordion panel. When the page initially loads the first tab is open by default. If i hit the enter key on the key board then the command button in the first tab has the keyboard focus and the fields are processed. now I leave the first tab open and open another tab and i hit the enter key the keyboard focus is still on the command button on the first tab . I tried using the p:focus with for/context attributes but with no help.
<h:form id="calculatorsNTools">
<p:accordionPanel multiple="true">
<p:tab title="Teenage Check">
<h:inputText id="age1" required="true" label="Age"
value="#{calculatorBacking.age}" validatorMessage="Enter a value">
<f:validateDoubleRange minimum="1" />
</h:inputText>
<p:message for="age1" id="msgage1" />
<h:panelGrid columns="3" id="gridTAresult">
<p:commandButton id="calculateTA"
action="#{calculatorBacking.calculateTA}" value="Calculate"
process="#this,age1"
update="gridTAresult">
</p:commandButton>
<b> Teenage (y/n)</b>
<h:outputLabel id="resultTA" value="#{calculatorBacking.resultTeenAge}"></h:outputLabel>
</h:panelGrid>
</p:tab>
<p:tab title="Retirement Check">
<h:inputText id="age2" required="true" label="Age"
value="#{calculatorBacking.age}" validatorMessage="Enter a value">
<f:validateDoubleRange minimum="1" />
</h:inputText>
<p:message for="age2" id="msgage2" />
<h:panelGrid columns="3" id="gridREresult">
<p:commandButton id="calculateRE"
action="#{calculatorBacking.calculateRE}" value="Calculate"
process="#this,age2"
update="gridREresult">
</p:commandButton>
<b> Retirement (y/n)</b>
<h:outputLabel id="resultRE" value="#{calculatorBacking.resultRetirement}"></h:outputLabel>
</h:panelGrid>
</p:tab>
</p:accordionPanel>
<h:form>
You can use javascript to accomplish what you want. I am not completely sure how to do it on an accordion but on a tabView it would be:
<p:tabView onTabChange="handleTabChange(event, index)">
Then create a javascript function to set the focus:
function handleTabChange(event, index){
if(index == 1){
var opControl = document.getElementById("calculatorsNTools:calculateTA");
opControl.focus();
}
}
You should be able to modify that to what you need for the accordionPanel.
I am trying to add a command link into PrimeFaces message tag. How can I do that?
MessagesView bean class
#ManagedBean
public class MessagesView {
public void info() {
FacesContext.getCurrentInstance().addMessage(null,
new FacesMessage(FacesMessage.SEVERITY_INFO, "Info","PrimeFaces Rocks."));
}
}
xhtml
<h:form>
<p:messages id="messages" showDetail="true" autoUpdate="true"
closable="true" />
<p:commandButton value="Info" actionListener="#{messagesView.info}" />
</h:form>
I want to add this command link to the message.
<p:commandLink id="ajax" actionListener="#{buttonView.buttonAction}">
<h:outputText value="Submit" />
</p:commandLink>