AJAX Forms
Hola !
I am trying to make a web application completely based on AJAX requests, suported by Ricachfaces Framework
I am form for "creating an item" , in my database , I when I press submit button it is created , but it should navigate to another page , which it does not...and I dont know why..... It is configured correctly in my faces-config.xml file.
This is the index.jsp file, where my form is included, please see red coloured code
<%--
Document : template
Created on : 2/01/2008, 07:43:57 AM
Author : Deibys
--%>
<%@ taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
<%@ taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j" %>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
<style type="text/css">
body,
html {
margin:20;
padding:0;
}
body {
min-width:800px;
}
#wrap {
margin:0 auto;
width:1024px;
}
#main {
float:right;
width:750px;
}
#sidebar {
float:left;
width:250px;
}
#footer {
background:#cc9;
clear:both;
}
#footer p {
padding:5px;
margin:0;
}
</style>
</head>
<body>
<f:view>
<div id="header">
<rich:toolBar>
<rich:toolBarGroup>
<h:outputText value="Bienvenido #{UserBean.userName} !" />
</rich:toolBarGroup>
<rich:toolBarGroup location="right">
<h:form id="logoutForm" >
<h:commandLink id="logout" action="#{LoginManager.logout}" >
<h:outputText value="Salir" />
</h:commandLink>
</h:form>
</rich:toolBarGroup>
</rich:toolBar>
</div>
<rich:spacer width="1" height="10" />
<div id="main">
<a4j:outputPanel id="main2" >
<div><h2><h:outputText value="#{MenuBean.nodeSelectedTitle}" /></h2></div>
<a4j:include viewId="#{MenuBean.optionSelectedUrl}" />
</a4j:outputPanel>
</div>
<div id="sidebar">
<rich:panel>
<h:form>
<rich:tree switchType="client" value="#{MenuBean.treeNode}" var="item" id="navigationMenu"
iconLeaf="/images/gear.gif" iconCollapsed="/images/tree_folder_close.gif"
iconExpanded="/images/tree_folder_open.gif" icon="false"
preserveModel="state" ajaxSubmitSelection="true" reRender="main2"
nodeSelectListener="#{MenuBean.processSelection}" >
<rich:treeNode >
<h:outputText value="#{item.title}" />
</rich:treeNode>
</rich:tree>
</h:form>
</rich:panel>
</div>
<rich:spacer width="1" height="10" />
<div id="footer">
<p>@Copyright 2008</p>
</div>
</f:view>
</body>
</html>
My form is createArea.jsp
<%--
Document : createArea
Created on : 8/01/2008, 03:35:09 PM
Author : Deibys
--%>
<%@ taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
<%@ taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j" %>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich" %>
<h:form id="createAreaForm" >
<rich:messages />
<h:panelGrid columns="2" cellspacing="5" >
<h:outputLabel value="Area" for="area" />
<h:inputText id="area" required="true" value="#{AreaBean.areaName}" />
<h:outputLabel value="Estado" for="status" />
<h:selectOneMenu value="#{AreaBean.status}" id="status">
<f:selectItem itemLabel="Activo" itemValue="A" />
<f:selectItem itemLabel="Inactivo" itemValue="I" />
</h:selectOneMenu>
<a4j:commandButton value="Crear >>" action="#{AreaBean.create}" />
</h:panelGrid>
</h:form>
And the page it should navigate to, when clicked on " Crear >>" button is (editArea.jsp)
<%--
Document : editArea
Created on : 10/01/2008, 02:27:31 PM
Author : Deibys
--%>
<%@ taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
<%@ taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j" %>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich" %>
<h:form id="editAreaForm" >
<rich:messages />
<h:panelGrid columns="2" cellspacing="5" >
<h:inputHidden id="id" value="#{AreaBean.areaId}" />
<h:outputLabel value="Area" for="area" />
<h:inputText id="area" required="true" value="#{AreaBean.areaName}" disabled="true" />
<h:outputLabel value="Estado" for="status" />
<h:selectOneMenu value="#{AreaBean.status}" id="status">
<f:selectItem itemLabel="Activo" itemValue="A" />
<f:selectItem itemLabel="Inactivo" itemValue="I" />
</h:selectOneMenu>
<a4j:commandButton value="Editar >>" action="#{AreaBean.edit}" />
</h:panelGrid>
</h:form>
my AreaBean code is :
/*
* To change this template, choose Tools | Templates
* and open the template in the editor.
*/
package com.coorserpark.backing;
import com.coorserpark.model.Area;
import javax.faces.application.FacesMessage;
import javax.faces.context.FacesContext;
/**
*
* @author Deibys
*/
public class CreateAreaBean {
private long areaId;
private String areaName;
private String status;
private boolean editMode;
public long getAreaId() {
return areaId;
}
public void setAreaId(long areaId) {
this.areaId = areaId;
}
public String getAreaName() {
return areaName;
}
public void setAreaName(String areaName) {
this.areaName = areaName;
}
public String getStatus() {
return status;
}
public void setStatus(String status) {
this.status = status;
}
public String create() throws Exception {
try {
FacesContext fc = FacesContext.getCurrentInstance();
long areaId = Area.createArea(areaName, status);
if (areaId > 0) {
// add
fc.addMessage(null, new FacesMessage("Area Creada Exitosamente",null));
this.areaId = areaId;
return "success";
} else {
return "failure";
}
} catch (Exception e) {
throw new Exception(e);
}
//return null;
}
public String edit() {
try {
FacesContext fc = FacesContext.getCurrentInstance();
Area area = new Area();
area.setAreaId(areaId);
area.setAreaName(areaName);
area.setStatus(status);
if (area.editArea()) {
// add
fc.addMessage(null, new FacesMessage("Area Modificada Exitosamente",null));
return "success";
} else {
return "failure";
}
} catch (Exception e) {
// Throw CreateUser Exception or Custom Gambatte Exception
}
return null;
}
}
My faces-config.xml: is
<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE faces-config PUBLIC
"-//Sun Microsystems, Inc.//DTD JavaServer Faces Config 1.1//EN"
"http://java.sun.com/dtd/web-facesconfig_1_1.dtd">
<!-- =========== FULL CONFIGURATION FILE ================================== -->
<faces-config>
<managed-bean>
<managed-bean-name>AreaBean</managed-bean-name>
<managed-bean-class>com.coorserpark.backing.CreateAreaBean</managed-bean-class>
<managed-bean-scope>request</managed-bean-scope>
</managed-bean>
<navigation-rule>
<from-view-id>/Administracion/createArea.jsp</from-view-id>
<navigation-case>
<from-outcome>success</from-outcome>
<to-view-id>/Administracion/editArea.jsp</to-view-id>
</navigation-case>
</navigation-rule>
</faces-config>
What's wrong ? When I click submit , page does not navigate....Message is display, in the same page I click on submit