鍍金池/ 教程/ HTML/ JSF <f:ajax>標(biāo)簽
JSF數(shù)據(jù)表(h:dataTable)添加刪除
JSF <h:commandLink>標(biāo)簽
JSF應(yīng)用程序入門示例
JSF數(shù)據(jù)表(ui:repeat)創(chuàng)建表
JSF列表框
JSF數(shù)據(jù)表(h:dataTable)DataModel排序數(shù)據(jù)
JSF復(fù)合組件
JSF <h:inputText>標(biāo)簽
JSF表單組合框
JSF <h:messages>標(biāo)簽
JSF <h:message>標(biāo)簽
JSF轉(zhuǎn)換日期時(shí)間
JSF JDBC連接
JSF <h:inputHidden>標(biāo)簽
JSF多選列表框
JSF <h:inputSecret>標(biāo)簽
JSF自定義轉(zhuǎn)換器
JSF <f:ajax>標(biāo)簽
JSF生命周期
JSF可重定位資源
JSFJSF用戶界面組件模型
JSF <h:attribute>標(biāo)簽
JSF驗(yàn)證器標(biāo)簽
JSF驗(yàn)證字符串長度
JSF轉(zhuǎn)換器標(biāo)簽
JSF托管bean(Managed Bean)
JSF值變化的事件
JSF UI組件示例
JSF MySQL CURD實(shí)例
JSF數(shù)據(jù)表(h:dataTable)排序數(shù)據(jù)
JSF <h:graphicImage>標(biāo)簽
JSF <f:convertNumber>標(biāo)簽
JSF教程
JSF托管Bean
JSF輸出腳本
JSF <h:outputText>標(biāo)簽
JSF操作事件
JSF驗(yàn)證正則表達(dá)式
JSF數(shù)據(jù)表(h:dataTable)行號(hào)
JSF <h:setPropertyActionListener>標(biāo)簽
JSF注入托管bean實(shí)例
JSF <h:commandButton>標(biāo)簽
JSF Web資源
JSF <h:inputFile>標(biāo)簽
JSF驗(yàn)證浮點(diǎn)數(shù)值范圍
JSF Facelets視圖
JSF是什么?
JSF Facelets模板
JSF的特性(特點(diǎn))
JSF自定義驗(yàn)證器類
JSF單選按鈕
JSF輸出樣式
JSF數(shù)據(jù)表(h:dataTable)更新數(shù)據(jù)
JSF HTML5友好標(biāo)記
JSF表單復(fù)選框(CheckBox)示例
JSF <h:form>標(biāo)簽
JSF Facelets技術(shù)介紹
JSF輸出格式化
JSF <h:inputtextarea>標(biāo)簽
JSF驗(yàn)證整數(shù)范圍
JSF <h:panelGrid>標(biāo)簽

JSF <f:ajax>標(biāo)簽

AJAX代表異步JavaScript和Xml。 這是一種使用JavaScript的HTTPXMLObject技術(shù)來將數(shù)據(jù)發(fā)送到服務(wù)器并從服務(wù)器異步接收數(shù)據(jù)。

在Ajax中,Javascript代碼與服務(wù)器交換數(shù)據(jù),更新網(wǎng)頁的部分,而無需重新加載整個(gè)頁面。

JSF支持使用f:ajax標(biāo)簽進(jìn)行Ajax調(diào)用。

下面顯示了一個(gè)簡單的JSF標(biāo)簽。

<f:ajax execute="input-component-name" render="output-component-name" />

標(biāo)簽屬性

屬性 說明
disabled 如果為true,則Ajax行為將應(yīng)用于任何父組件或子組件。 如果為false,則Ajax行為將被禁用。
event 將調(diào)用Ajax請(qǐng)求的事件,例如: “click“, “change“, “blur“, “keypress“等。
execute 應(yīng)該包含在Ajax請(qǐng)求中的組件的空格分隔的列表。
immediate 如果為true,則在應(yīng)用請(qǐng)求值階段期間廣播生成的行為事件。 否則,將在調(diào)用應(yīng)用階段廣播事件。
listener 在Ajax請(qǐng)求期間調(diào)用的后備bean中的方法的EL表達(dá)式。
onerror Ajax請(qǐng)求期間發(fā)生錯(cuò)誤的JavaScript回調(diào)函數(shù)的名稱。
onevent 用于處理UI事件的JavaScript回調(diào)函數(shù)的名稱。
render Ajax請(qǐng)求后將更新的組件ID的空格分隔列表。

示例

以下代碼顯示了如何使用<h:outputText>標(biāo)簽來創(chuàng)建一個(gè)Ajax應(yīng)用程序來顯示用戶輸入。

以下是文件:UserBean.java的代碼,如下所示 -

package com.yiibai;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

import java.io.Serializable;

@ManagedBean
@SessionScoped
public class UserBean implements Serializable {

  private static final long serialVersionUID = 1L;

  private String name;

  public String getName() {
    return name;
  }

  public void setName(String name) {
    this.name = name;
  }

  public String getSayWelcome(){
    if("".equals(name) || name ==null){
      return "Null Message";
    }else{
      return "Ajax message : Welcome " + name;
    }
  }

}

以下是文件:index.xhtml 中的代碼 -

<h:inputText>創(chuàng)建一個(gè)輸入字段框。創(chuàng)建一個(gè)輸入字段框。 它使用來調(diào)用。

<?xml version="1.0" encoding="UTF-8"?>
<!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:f="http://java.sun.com/jsf/core"      
      xmlns:h="http://java.sun.com/jsf/html">

    <h:body>
      <h:form>
        <h:inputText id="name" value="#{userBean.name}"></h:inputText>
        <h:commandButton value="Welcome Me">
           <f:ajax execute="name" render="output" />
        </h:commandButton>
        <h2><h:outputText id="output" value="#{userBean.sayWelcome}" /></h2>
      </h:form>
  </h:body>
</html>

運(yùn)行項(xiàng)目

Tomcat啟動(dòng)完成后,在瀏覽器地址欄中輸入以下URL。

http://localhost:8084/AjaxHelloWorld

得到如下結(jié)果 -