gembin

OSGi, Eclipse Equinox, ECF, Virgo, Gemini, Apache Felix, Karaf, Aires, Camel, Eclipse RCP

HBase, Hadoop, ZooKeeper, Cassandra

Flex4, AS3, Swiz framework, GraniteDS, BlazeDS etc.

There is nothing that software can't fix. Unfortunately, there is also nothing that software can't completely fuck up. That gap is called talent.

About Me

 

学习新Ajax技术--Dynamic Faces

引言: 读此篇文章时,假设您已经具备了JavaServer Faces Technology的基础知识.
本文从Dynamic Faces所提供的一个例子出发.


Backing Bean
FruitInfoBean .java
package simpleDynamicFaces;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.Map;

import javax.faces.context.FacesContext;
import javax.faces.event.ValueChangeEvent;
import javax.faces.model.SelectItem;


public class FruitInfoBean {

    
/** Creates a new instance of FruitInfoBean */
    
private Map<Object, Object> fruitNamesMap = new HashMap<Object, Object>();
    
private String fruit = null;
    
private String variety = null;
    
private String varietyInfo = null;

    
public FruitInfoBean() {
        
this.init();
    }

    
private void init() {
        FacesContext context 
= FacesContext.getCurrentInstance();
        System.out.println(
"Locale:" + context.getViewRoot().getLocale());
        fruit 
= "Pear";
        variety 
= "Aurora";
        fruitNamesMap.put(
"Pear""Aurora,Bartlet,Bosc,Comice,Delicious");
        fruitNamesMap.put(
"Apple""Adanac,Akane,Ballarat,Braeburn,Fuji,Gala");
        fruitNamesMap.put(
"Orange""Berna,Hamlin,Moro,Navel,Valencia");
        fruitNamesMap.put(
"Peach",
                
"Brighton,Clingstone,Contender,Eden,Freestone");
    }

    
/*
     * Handler method called when user selects a variety from the menu. This
     * method updates the variety component model value and sets the varietyInfo
     * model value to the appropriate message.
     
*/
    
public String updateVariety(ValueChangeEvent e) {
        String newVariety 
= (String) e.getNewValue();
        String currentFruit 
= getFruit();
        setVarietyInfo(
"Information updated:" + newVariety + " Old:"
                
+ currentFruit);
        
return null;
    }

    
public String getFruit() {
        
return this.fruit;
    }

    
public void setFruit(String fruit) {
        
this.fruit = fruit;
    }

    
protected ArrayList<SelectItem> fruits = null;

    
public ArrayList<SelectItem> getFruits() {

        fruits 
= new ArrayList<SelectItem>();
        fruits.add(
new SelectItem("Pear""Pear"));
        fruits.add(
new SelectItem("Apple""Apple"));
        fruits.add(
new SelectItem("Orange""Orange"));
        fruits.add(
new SelectItem("Peach""Peach"));

        
return fruits;
    }

    
public String getVariety() {
        
return this.variety;
    }

    
public void setVariety(String variety) {
        
this.variety = variety;
    }

    
protected ArrayList<SelectItem> varieties = null;

    
public ArrayList<SelectItem> getVarieties() {
        varieties 
= new ArrayList<SelectItem>();
        String[] fruitVarieties 
= fruitNamesMap.get(this.fruit).toString()
                .split(
",");
        
for (int i = 0; i < fruitVarieties.length; i++) {
            varieties.add(
new SelectItem(fruitVarieties[i], fruitVarieties[i]));
        }
        
return varieties;
    }

    
/*
     * Handler method for the event of selecting a fruit. This method sets the
     * model value for the variety component and sets the varietyInfo model
     * value to the appropriate message.
     
*/
    
public void changeFruit(ValueChangeEvent e) {
        String fruitValue 
= (String) e.getNewValue();
        String[] varieties 
= fruitNamesMap.get(fruitValue).toString()
                .split(
",");
        setVarietyInfo(
"Information:" + (varieties[0]));
        setVariety(varieties[
0]);
    }

    
public String getVarietyInfo() {
        
return this.varietyInfo;
    }

    
public void setVarietyInfo(String varietyInfo) {
        
this.varietyInfo = varietyInfo;
    }

    
/*
     * The following code is used with the installDeferredAjaxTransaction use
     * case
     
*/
    
private String fruitQuiz = null;

    
public String getFruitQuiz() {
        
return this.fruitQuiz;
    }

    
public void setFruitQuiz(String fruit) {
        
this.fruitQuiz = fruit;
    }

}

fireAjaxTx.jsp
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd"
>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib prefix="jsfExt"  uri="http://java.sun.com/jsf/extensions/dynafaces"%>

<f:view>
    
<html>
    
<head>
    
<title>Fruit Varieties</title>
    
<jsfExt:scripts />
    
</head>
    
<body bgcolor="white">

    
<h:form prependId="false" id="form">

        
<h1>Fruit Varieties</h1>
        
<h:panelGrid columns="2" cellpadding="4">
            
<h:outputText value="Select a fruit:" />
            
<h:outputText value="Select a variety:" />
            
<h:selectOneRadio id="fruit" value="#{fruitInfoBean.fruit}"
                onclick
="DynaFaces.fireAjaxTransaction(this, { execute: 'fruit'});"
                valueChangeListener
="#{fruitInfoBean.changeFruit}">
                
<f:selectItems value="#{fruitInfoBean.fruits}" />
            
</h:selectOneRadio>

            
<h:selectOneMenu id="variety" value="#{fruitInfoBean.variety}"
                onchange
="DynaFaces.fireAjaxTransaction(this, { execute: 'variety' });"
                valueChangeListener
="#{fruitInfoBean.updateVariety}">
                
<f:selectItems value="#{fruitInfoBean.varieties}" />
            
</h:selectOneMenu>

        
</h:panelGrid>
        
<h:outputText id="varietyInfo" value="#{fruitInfoBean.varietyInfo}" />

    
</h:form>

    
</body>
    
</html>
</f:view>

其中的DynaFaces.fireAjaxTransaction方法由jsf-extensions-dynamic-faces.jar里的com_sun_faces_ajax.js定义,这个方法可以在JSF组件级别上执行AJAX异步更新.

使用fireAjaxTransaction:
1.在JSF组件的标签里加JavaScript 事件属性,如:onClick="DynaFaces.fireAjaxTransaction(paras)"
2. 在DynaFaces.fireAjaxTransaction加上paras,以便可以传递一些参数到Server.


execute: 'fruit'的意思是:Id为fruit的JSF组件(包括这个组件的所有Children),将Go Through JSF Life Circle的execute部分. 在这部分生命周期后,当前页面所有JSF组件将会通过Ajaxre-render(这里是默认行为,因为没有指定render属性), 其中execute生命周期部分所做的工作如下:转换和验证数据,更新数据模型和处理Action事件. value-change事件属于fruit组件,所以当发出AJAX请求时,该事件也会被处理,从而达到更新模型数据的目的.

常用的属性:
1. execute: A JavaScript String specifying which JSF component id's to process.  

2. immediate: Not really needed, but if there was validation on the field in "execute" immediate would skip the validation. 

3. inputs: The values sent to the server.  This may be different than the components processed.  

4. render: This specifies which area(s) of the screen should be updated with the response.  In this case the 
<div> around our message text.


所需的Lib如下:


有关Dynamic Faces的包可以从这里下载:https://jsf-extensions.dev.java.net/servlets/ProjectDocumentList

posted on 2008-03-11 17:32 gembin 阅读(693) 评论(0)  编辑  收藏 所属分类: JSFAjax


只有注册用户登录后才能发表评论。


网站导航:
 

导航

统计

常用链接

留言簿(6)

随笔分类(440)

随笔档案(378)

文章档案(6)

新闻档案(1)

相册

收藏夹(9)

Adobe

Android

AS3

Blog-Links

Build

Design Pattern

Eclipse

Favorite Links

Flickr

Game Dev

HBase

Identity Management

IT resources

JEE

Language

OpenID

OSGi

SOA

Version Control

最新随笔

搜索

积分与排名

最新评论

阅读排行榜

评论排行榜

free counters