ADF_General JSF系列1_创建一个简单的JSF Application

2015-02-17 Creatd By BaoXinjian

一、摘要


本文介绍如何创建一个简单的Application

Step 1: Create a New Application and Project

Step 2: Create a JSF Page

Step 3: Design the UI

Step 4: Modify the Behavior Through Code

 

1: Create a New Application and Project


Step1. 创建Custom Application

Step2.  查看错所创建的Application

 

2: Create a JSF Page


Step1. 创建测试页面

Step2. 简单测试页面如下

 

3: Design the UI


Step1. 导入HTML和JSF控件

Step2.  最后组成如下控件

 

4: Modify the Behavior Through Code


Step1.  建立Managed Bean

Step2.  添加Button方法

Step3.  查看所创建的Java Managed Bean

Step4. Managed Bean中的代码

package project.backing;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;
import javax.faces.component.html.HtmlCommandButton;
import javax.faces.component.html.HtmlForm;
import javax.faces.component.html.HtmlInputText;
import javax.faces.component.html.HtmlOutputText;

@ManagedBean(name="backing_start")
@RequestScoped
public class StartInfo {
    private HtmlOutputText outputText1;
    private HtmlCommandButton commandButton1;
    private HtmlInputText inputText1;
    private HtmlForm form1;

    public StartInfo() {
    }

    public void setOutputText1(HtmlOutputText outputText1) {
        this.outputText1 = outputText1;
    }

    public HtmlOutputText getOutputText1() {
        return outputText1;
    }

    public void setCommandButton1(HtmlCommandButton commandButton1) {
        this.commandButton1 = commandButton1;
    }

    public HtmlCommandButton getCommandButton1() {
        return commandButton1;
    }

    public void setInputText1(HtmlInputText inputText1) {
        this.inputText1 = inputText1;
    }

    public HtmlInputText getInputText1() {
        return inputText1;
    }

    public void setForm1(HtmlForm form1) {
        this.form1 = form1;
    }

    public HtmlForm getForm1() {
        return form1;
    }

    public Object commandButton1_action() {
        // Add event code here...
        outputText1.setValue("Hello "+inputText1.getValue());
        return null;
    }
}

Step5.  页面测试结果,当点击按钮式,将Input的值数据到显示栏位

 

Thanks and Regards

posted on 2015-01-27 16:40  东方瀚海  阅读(353)  评论(0编辑  收藏  举报