Hi,
I am sort of new and I am getting mixed output with PrimeFaces when attempting to display different output based on clicking different command buttons:
I have tried a mix of ajax="false" and update="some other component Id" with PrimeFaces and this is what I get:
1 - When I use ajax=false and update=north to update the north panel for a page after clicking a Login button, it works and the north panel gets updated correctly.
2 - When I use ajax=false and update=center on another button within the north toolbar, it doesn't update the center panel, instead if updates the north panel again.
Why am I seeing this behavior? Is it a bug? Is there anyone out there that may have tried using PrimeFaces and run into the same thing?
Here is the content of the page that displays both issues:
<!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">
<h:head>
<title>Dashboard</title>
<style type="text/css">
.ui-widget, .ui-widget .ui-widget {
font-size:12px;
}
.noWrapClass {
word-wrap: normal;
}
.ui-tabs .ui-tabs-nav li{float:right!important;}
</style>
</h:head>
<h:body>
<f:view>
<p:layout id="context" fullPage="true" rendered="true">
<p:layoutUnit id="north" position="north" closable="false" collapsible="false">
<p:toolbar>
<p:toolbarGroup id="group1" rendered="#{loginBean.loggedIn}" align="left">
<h:form id="navF">
<p:commandButton type="push" value="search" action="#{contextBean.toggleViewMode(1)}" ajax="false" update=":center"/>
<p:commandButton type="push" value="map" action="#{contextBean.toggleViewMode(2)}"/>
<p:commandButton type="push" value="configure" action="#{contextBean.toggleViewMode(3)}"/>
<p:commandButton type="push" value="alarms" action="#{contextBean.toggleViewMode(4)}"/>
<p:commandButton type="push" value="notifications" action="#{contextBean.toggleViewMode(5)}"/>
</h:form>
</p:toolbarGroup>
<p:toolbarGroup id="group2" rendered="#{loginBean.loggedIn}" align="right" >
<h:form id="logoutF">
<p:commandButton type="push" value="Logout" ajax="false" action="#{loginBean.logout}" update=":north"/>
</h:form>
</p:toolbarGroup>
<p:toolbarGroup id="group3" rendered="#{!loginBean.loggedIn}" align="right">
<h:form id="loginF">
<p:commandButton type="push" value="Login" onclick="dlg.show();"/>
</h:form>
</p:toolbarGroup>
</p:toolbar>
</p:layoutUnit>
<p:layoutUnit id="center" position="center">
<p:panel id="searchPanel" rendered="#{contextBean.isRendered(1)}">
<h:form>
<p:panelGrid columns="2">
<h:outputText value="Device: "/>
<p:inputText id="device" value="#{searchBean.device}"/>
<h:outputText value="Group: " />
<p:inputText id="group" value="#{searchBean.group}"/>
<p:commandButton type="push" value="Search" action="contextBean.search"/>
</p:panelGrid>
</h:form>
</p:panel>
</p:layoutUnit>
</p:layout>
<p:growl id="growl" life="3000" />
<p:dialog id="dialog" header="Login" widgetVar="dlg">
<h:form>
<h:panelGrid columns="2" cellpadding="5">
<h:outputLabel for="user" value="User:" />
<p:inputText value="#{loginBean.user}"
id="user" required="true" label="user" />
<h:outputLabel for="password" value="Password:" />
<h:inputSecret value="#{loginBean.password}"
id="password" required="true" label="password" />
<f:facet name="footer">
<p:commandButton id="loginButton" value="Login" update=":north,:growl" ajax="false"
action="#{loginBean.login}"/>
</f:facet>
</h:panelGrid>
</h:form>
</p:dialog>
</f:view>
</h:body>
</html>
Here is the LoginBean code:
/*
* To change this template, choose Tools | Templates
* and open the template in the editor.
*/
import com.ge.de.cnms.util.Data;
import java.awt.event.ActionEvent;
import java.io.Serializable;
import javax.enterprise.context.SessionScoped;
import javax.faces.application.FacesMessage;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;
import javax.faces.context.FacesContext;
import org.primefaces.context.RequestContext;
/**
*
* @author joe
*/
@ManagedBean
@SessionScoped
public class LoginBean implements Serializable{
private boolean loggedIn;
private
String user;
private String password;
/**
* Creates a new instance of LoginBean
*/
public LoginBean() {
System.out.println(this);
loggedIn=false;
}
public String getUser() {
return user;
}
public void setUser(String user) {
this.user = user;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
public void login() {
//The commented out code is only used with dasboard.xhtml and not
//dashboard2.xhtml
//RequestContext context = RequestContext.getCurrentInstance();
if(user != null && user.equals("sce") &&
password != null && password.equals("marks99")) {
loggedIn = true;
} else {
loggedIn = false;
}
// context.addCallbackParam("loggedIn", loggedIn);
System.out.println("user=<" + this.user + ">");
System.out.println("password=<" + this.password + ">");
System.out.println("loggedIn=<" + this.loggedIn + ">");
}
public void logout(){
loggedIn = !loggedIn;
}
public boolean isLoggedIn() {
return loggedIn;
}
public void setLoggedIn(boolean loggedIn) {
this.loggedIn = loggedIn;
}
}
Here is the searchBean code:
/*
* To change this template, choose Tools | Templates
* and open the template in the editor.
*/
import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;
/**
*
* @author joe
*/
@ManagedBean
@RequestScoped
public class SearchBean {
private String device;
private String group;
/**
* Creates a new instance of SearchBean
*/
public SearchBean() {
}
public String getDevice() {
return device;
}
public void setDevice(String device) {
this.device = device;
}
public String getGroup() {
return group;
}
public void setGroup(String group) {
this.group = group;
}
public void search(){
//do nothing for now
}
}
And here is the context bean code:
/*
* To change this template, choose Tools | Templates
* and open the template in the editor.
*/
import java.io.Serializable;
import javax.enterprise.context.SessionScoped;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;
/**
*
* @author joe
*/
@ManagedBean
@RequestScoped
public class ContextBean implements Serializable
{
private int mode;
private boolean rendered;
public int getMode() {
return mode;
}
public void setMode(int mode) {
this.mode = mode;
}
public boolean isRendered(int mode) {
System.out.println("mode=<" + mode + ">, rendered=<" + this.mode==mode + ">");
return this.mode == mode;
}
public void setRendered(boolean rendered) {
this.rendered = rendered;
}
public enum SearchMode{
DEFAULT,
SEARCH,
MAP,
CONFIG,
ALARMS,
NOTIFICATIONS
}
/**
* Creates a new instance of ContextBean
*/
public ContextBean() {
System.out.println(this);
}
public void toggleViewMode(int value){
System.out.println("toggleViewMode <" + value + ">");
switch(SearchMode.values()[value]){
case DEFAULT: {//DEFAULT
System.out.println("Mode=<" + SearchMode.DEFAULT + ">");
mode = SearchMode.DEFAULT.ordinal();
break;
}case SEARCH:{//SEARCH
System.out.println("Mode=<" + SearchMode.SEARCH + ">");
mode = SearchMode.SEARCH.ordinal();
break;
}case MAP:{//MAP
System.out.println("Mode=<" + SearchMode.MAP + ">");
mode = SearchMode.MAP.ordinal();
break;
}case CONFIG:{//CONFIG
System.out.println("Mode=<" + SearchMode.CONFIG + ">");
mode = SearchMode.CONFIG.ordinal();
break;
}case ALARMS:{//ALARMS
System.out.println("Mode=<" + SearchMode.ALARMS + ">");
mode = SearchMode.ALARMS.ordinal();
break;
}case NOTIFICATIONS:{//NOTIFICATIONS
System.out.println("Mode=<" + SearchMode.NOTIFICATIONS + ">");
mode = SearchMode.NOTIFICATIONS.ordinal();
break;
}default:{
System.out.println("Mode=<" + SearchMode.DEFAULT + ">");
mode = SearchMode.DEFAULT.ordinal();
break;
}
}
}
}
Is it not possible to update / replace a component from a click on a button when using the PrimeFaces framework? It seems it works in #1 but not #2 as stated above. Why?
Thanks,
Joe
