RichFaces发送Ajax请求详细图解

本文概述

  • < a4j:commandButton> 标记
  • < a4j:ajax> 天
【RichFaces发送Ajax请求详细图解】RichFaces提供了标记库, 这些标记库能够从JavaServer Faces页面发送Ajax请求。以下是Web应用程序中使用的重要标记。
  • < a4j:commandButton> 和< a4j:commandLink> 标记用于在click JavaScript事件上发送Ajax请求。
  • < a4j:poll> 标记用于使用计时器定期发送Ajax请求。
  • < a4j:ajax> 标记允许用于将Ajax功能添加到标准JSF组件, 并在选定的JavaScript事件(例如, 键盘输入或鼠标悬停)上发送Ajax请求。
  • r标签库中的大多数组件都具有内置的Ajax支持。
< a4j:commandButton> 标记 要实现此标记, 我们需要创建以下文件。
// index.xhtml
< !DOCTYPE html> < ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:a4j="http://richfaces.org/a4j" xmlns:rich="http://richfaces.org/rich"> < h:form id="form"> < h:outputText value="http://www.srcmini.com/User Name" /> < h:inputText value="http://www.srcmini.com/#{user.name}" /> < a4j:commandButton value="http://www.srcmini.com/Enter Your Name" render="out" execute="@form" /> < /h:form> < br/> < a4j:outputPanel> < h:outputText value="http://www.srcmini.com/Hello #{user.name} !" rendered="#{not empty user.name}" /> < /a4j:outputPanel> < /ui:composition>

// User.java
import javax.faces.bean.ManagedBean; import javax.faces.bean.RequestScoped; @ManagedBean @RequestScoped public class User { String name; public String getName() { return name; } public void setName(String name) { this.name = name; } }

// web.xml
< ?xml version="1.0" encoding="UTF-8"?> < web-app version="3.1" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"> < context-param> < param-name> javax.faces.PROJECT_STAGE< /param-name> < param-value> Development< /param-value> < /context-param> < servlet> < servlet-name> Faces Servlet< /servlet-name> < servlet-class> javax.faces.webapp.FacesServlet< /servlet-class> < load-on-startup> 1< /load-on-startup> < /servlet> < servlet-mapping> < servlet-name> Faces Servlet< /servlet-name> < url-pattern> /faces/*< /url-pattern> < /servlet-mapping> < session-config> < session-timeout> 30 < /session-timeout> < /session-config> < welcome-file-list> < welcome-file> faces/index.xhtml< /welcome-file> < /welcome-file-list> < /web-app>

运行index.xhtml文件后, 将产生以下输出。
RichFaces发送Ajax请求详细图解

文章图片
CommandLink标签
// commandLink.xhtml
< ui:composition xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:a4j="http://richfaces.org/a4j" xmlns:rich="http://richfaces.org/rich"> < h:head> < /h:head> < h:form id="form"> < h:outputText value="http://www.srcmini.com/Name:" /> < h:inputText value="http://www.srcmini.com/#{user.name}" /> < a4j:commandLink value="http://www.srcmini.com/Click here" render="out" execute="@form" /> < /h:form> < br /> < a4j:outputPanel id="out"> < h:outputText value="http://www.srcmini.com/Hello #{user.name} !" /> < /a4j:outputPanel> < /ui:composition>

// User.java
import javax.faces.bean.ManagedBean; import javax.faces.bean.RequestScoped; @ManagedBean @RequestScoped public class User { String name; public String getName() { return name; } public void setName(String name) { this.name = name; } }

// web.xml
< ?xml version="1.0" encoding="UTF-8"?> < web-app version="3.1" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"> < context-param> < param-name> javax.faces.PROJECT_STAGE< /param-name> < param-value> Development< /param-value> < /context-param> < servlet> < servlet-name> Faces Servlet< /servlet-name> < servlet-class> javax.faces.webapp.FacesServlet< /servlet-class> < load-on-startup> 1< /load-on-startup> < /servlet> < servlet-mapping> < servlet-name> Faces Servlet< /servlet-name> < url-pattern> /faces/*< /url-pattern> < /servlet-mapping> < session-config> < session-timeout> 30 < /session-timeout> < /session-config> < welcome-file-list> < welcome-file> faces/index.xhtml< /welcome-file> < /welcome-file-list> < /web-app>

输出
RichFaces发送Ajax请求详细图解

文章图片
< a4j:ajax> 天 //ajax-event.xhtml
< html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://xmlns.jcp.org/jsf/html" xmlns:a4j="http://richfaces.org/a4j"> < h:head> < title> a4j:ajax Tag< /title> < /h:head> < h:body> < h:form> < h:outputText value="http://www.srcmini.com/Enter Text"> < /h:outputText> < h:inputText value="http://www.srcmini.com/#{user.name}"> < a4j:ajax event="keyup" render="user-name"> < /a4j:ajax> < /h:inputText> < br/> < br/> < h:outputText id="user-name" value="http://www.srcmini.com/#{user.name}"> < /h:outputText> < /h:form> < /h:body> < /html>

// web.xml
< ?xml version="1.0" encoding="UTF-8"?> < web-app version="3.1" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"> < context-param> < param-name> javax.faces.PROJECT_STAGE< /param-name> < param-value> Development< /param-value> < /context-param> < servlet> < servlet-name> Faces Servlet< /servlet-name> < servlet-class> javax.faces.webapp.FacesServlet< /servlet-class> < load-on-startup> 1< /load-on-startup> < /servlet> < servlet-mapping> < servlet-name> Faces Servlet< /servlet-name> < url-pattern> /faces/*< /url-pattern> < /servlet-mapping> < session-config> < session-timeout> 30 < /session-timeout> < /session-config> < welcome-file-list> < welcome-file> faces/index.xhtml< /welcome-file> < /welcome-file-list> < /web-app>

// User.java
import javax.faces.bean.ManagedBean; import javax.faces.bean.RequestScoped; @ManagedBean @RequestScoped public class User { String name; public String getName() { return name; } public void setName(String name) { this.name = name; } }

输出
RichFaces发送Ajax请求详细图解

文章图片

    推荐阅读