JSF----------基础知识初解

初次学习JSF,对其基础进行了一些学习与整理。

JSF(JavaServer Faces)它是一个基于服务器端组件的用户界面框架。 它用于开发Web应用程序。 它提供了一个定义良好的编程模型,由丰富的API和标签库组成。最新版本JSF 2使用Facelets作为其默认模板系统。 它是用Java编写的。

JSF API提供组件(inputText,commandButton等)并帮助管理其状态。 它还提供服务器端验证,数据转换,定义页面导航,提供可扩展性,国际化支持,可访问性等。

JSF标签库用于在Web页面上添加组件,并将组件与服务器上的对象进行连接。 它还包含实现组件标签的标签处理程序。

借助这些功能和工具,您可以轻松轻松地创建服务器端用户界面。

1.JSF的特点

特点 解释
基于组件的框架 JSF是一个基于服务器端组件的框架,它提供内置组件来构建Web应用程序。您可以使用HTML5,Facelets标签来创建网页
实现Facelets技术 Facelets是一个开源Web模板系统。它是JavaServer Faces(JSF)的默认视图处理程序技术。 该语言需要有效的输入XML文档才能正常工作。 Facelets支持所有的JSF UI组件,并且完全侧重于构建JSF应用程序的视图
与表达语言的集成 表达式语言提供了创建用户界面(网页)与应用程序逻辑(被管理的bean)通信的重要机制。 EL表示由JavaServer Faces技术提供的表达式语言的并集
支持HTML5 HTML5是编写网页的新标准。 JavaServer Faces版本2.2提供了一种简单的方法,将新的HTML 5属性包含在JSF组件中,并提供了HTML5友好的标记
轻松快捷的网页开发 JSF提供丰富的内置工具和库,以便您可以轻松快速地开发应用程序
支持国际化 JSF支持国际化创建世界一流Web应用程序,您可以使用不同的语言创建应用程序。 在JSF的帮助下,您可以使应用程序适应各种语言和区域
Bean注释 JSF提供注释工具,您可以在其中执行被管理的Bean中的验证相关任务。这是很好的,因为你可以验证数据,而不是HTML验证
默认异常处理 JSF提供默认的异常处理,以便您可以开发异常和无bug的Web应用程序
模板 在新版本的JSF中引入模板提供了组件的可重用性。在JSF应用程序中,您可以创建新模板,重用模板并将其视为应用程序的组件
内置AJAX支持 JSF提供内置的AJAX支持。 因此,您可以将应用程序请求提交到服务器端,而无需刷新网页。 JSF还支持使用AJAX进行部分渲染
安全 当状态保存在服务器上并且不使用无状态视图时,JSF提供了隐含的保护,因为Post-back必须包含一个有效的javax.faces.ViewState隐藏参数。 与早期版本相反,在现代JSF实现中,这个值似乎是非常随机的。请注意,客户端上的无状态视图和保存状态没有这种隐含的保护

2.JSF的生命周期

通常将JSF的生命周期分为两个阶段:

  • 执行阶段
  • 渲染阶段

下面一个个来分析一下:

1.执行阶段

在执行阶段,当第一次请求时,构建或恢复应用程序视图。 对于其他后续请求,执行其他操作,如应用请求参数值,对组件值执行转换和验证,受托管的bean将使用组件值进行更新,并调用应用程序逻辑。

执行阶段被进一步分成以下子阶段。

  • 恢复视图阶段
  • 应用请求值阶段
  • 流程验证阶段
  • 更新模型值阶段
  • 调用应用阶段
  • 渲染响应阶段
  • 恢复视图阶段
1.1恢复视图阶段

当客户端请求一个JavaServer Faces页面时,JavaServer Faces实现开始恢复视图阶段。 在此阶段,JSF将视图中的组件构建为请求页面,线性事件处理程序和验证器的视图,并将视图保存在FacesContext实例中。

如果对该页面的请求是回发,那么与该页面相对应的视图已经存在于FacesContext实例中。 在此阶段,JavaServer Faces实现通过使用保存在客户端或服务器上的状态信息来还原视图。

1.2应用请求值阶段

在此阶段,在回发请求期间恢复组件树。 组件树是表单元素的集合。树中的每个组件通过使用其decode(processDecodes())方法从请求参数中提取其新值。 之后,该值将本地存储在每个组件上。

如果任何解码方法或事件侦听器在当前FacesContext实例上调用了renderResponse方法,则JavaServer Faces实现将跳过“渲染响应”阶段。
如果任何事件在此阶段已排队,则JavaServer Faces实现将事件广播到有兴趣的监听器。
如果应用程序需要重定向到其他Web应用程序资源或生成不包含任何JavaServer Faces组件的响应,则可以调用FacesContext.responseComplete()方法。
如果当前请求被识别为部分请求,则从FacesContext检索部分上下文,并应用部分处理方法。

1.3流程验证阶段

在此阶段,JavaServer Faces通过使用其validate()方法来处理在组件上注册的所有验证器。 它检查指定验证规则的组件属性,并将这些规则与为组件存储的本地值进行比较。 JavaServer Faces还完成了没有将immediate属性设置为true的输入组件的转换。

如果任何验证方法或事件侦听器在当前FacesContext上调用了renderResponse方法,则JavaServer Faces实现将跳过“渲染响应”阶段。
如果应用程序需要重定向到不同的Web应用程序资源或生成不包含任何JavaServer Faces组件的响应,则可以调用FacesContext.responseComplete方法。
如果事件在此阶段已排队,则JavaServer Faces实现将它们广播给有兴趣的监听器。
如果当前请求被识别为部分请求,则从FacesContext检索部分上下文,并应用部分处理方法。

1.4更新模型值阶段

确保数据有效后,它遍历组件树,并将相应的服务器端对象属性设置为组件的本地值。 JavaServer Faces实现只更新输入组件的value属性指向bean属性。 如果本地数据无法转换为bean属性指定的类型,生命周期将直接前进到“渲染响应”阶段,以便重新呈现页面并显示错误。

如果任何updateModels方法或任何监听器在当前FacesContext实例上调用了renderResponse()方法,则JavaServer Faces实现将跳过“渲染响应”阶段。
如果应用程序需要重定向到其他Web应用程序资源或生成不包含任何JavaServer Faces组件的响应,则可以调用FacesContext.responseComplete()方法。
如果任何事件在此阶段已排队,JavaServer Faces实现将它们广播到有兴趣的监听器。
如果当前请求被识别为部分请求,则从FacesContext检索部分上下文,并应用部分处理方法。

1.5调用应用阶段

在此阶段,JSF处理应用程序级事件,例如提交表单或链接到另一个页面。
现在,如果应用程序需要重定向到其他Web应用程序资源或生成不包含任何JSF组件的响应,则可以调用FacesContext.responseComplete()方法。

之后,JavaServer Faces实现将控制转移到“渲染响应”阶段。

1.6渲染响应阶段

这是JSF生命周期的最后阶段。 在此阶段,JSF将构建视图并将权限委托给相应的资源来呈现页面。

如果这是初始请求,则页面上表示的组件将被添加到组件树中。
如果这不是初始请求,组件已经添加到树中,不需要再添加。
如果请求是回应,并且在应用请求值阶段,过程验证阶段或更新模型值阶段期间遇到错误,则在此阶段将再次呈现原始页面。
如果页面包含h:message或h:messages标签,页面上会显示任何排队的错误消息。
在渲染视图的内容之后,保存响应的状态,以便后续请求可以访问它。 恢复视图阶段可以使用保存的状态。

2.渲染阶段

在此阶段,请求的视图作为对客户端浏览器的响应。 视图渲染是以HTML或XHTML生成输出的过程。 所以,用户可以在浏览器看到它。

在渲染过程中采取以下步骤。

  • 当客户端对index.xhtml网页进行初始请求时,编译应用程序。
  • 应用程序在编译后执行,并为应用程序构建一个新的组件树,并放置在FacesContext中。
  • 使用由EL表达式表示的组件和与其关联受托管bean属性填充组件树。
  • 基于组件树。 建立了新的视图。
  • 该视图作为响应呈现给请求客户端。
  • 组件树被自动销毁。
  • 在后续请求中,重新构建组件树,并应用已保存的状态。

3.JSF的Bean

JSF中同样存在Bean概念,JSF中的Bean有以下的特点:

  • 验证组件的数据
  • 处理组件触发的事件
  • 执行处理以确定应用程序必须导航的下一页
  • 它也可以作为JFS框架的模型。

这一点很类似于Spring,JSF也有对Bean的使用,通常注册Bean也有两种方式:

  • XML注册
  • 注解注册

2.1注册Bean

1.XML注册
<managed-bean>  
    <managed-bean-name>user</managed-bean-name>  
    <managed-bean-class>User</managed-bean-class>  
    <managed-bean-scope>session</managed-bean-scope>  
</managed-bean>

其中由managed-bean指定Bean。
由name:名称;class:对应的类;scope:作用域 组成。

2.注解
@ManagedBean    // Using ManagedBean annotation  
@RequestScoped  // Using Scope annotation  
public class User {  
    private String name;  
    public String getName() {  
        return name;  
    }  
    public void setName(String name) {  
         this.name = name;  
    }  
}

类中的@ManagedBean注解自动将该类注册为JavaServer Faces的资源。 这种注册的托管bean在应用程序配置资源文件中不需要托管bean配置项。

这是应用程序配置资源文件方法的替代方法,并减少配置托管bean的任务。
@RequestScoped注释用于提供托管的范围。 您可以使用注解来定义bean将被存储的范围。

您可以对bean类使用以下范围:

作用域注解 解释
应用程序(@ApplicationScoped) 应用程序范围在所有用户中保持不变,与Web应用程序的交互。
会话(@SessionScoped) 会话范围在Web应用程序中的多个HTTP请求中保持不变。
视图(@ViewScoped) 在用户与Web应用程序的单个页面(视图)进行交互时,视图范围仍然存在。
请求(@RequestScoped) 在Web应用程序中的单个HTTP请求期间,请求范围仍然存在。
无(@NoneScoped) 表示未为应用程序定义作用域。
自定义(@CustomScoped) 用户定义的非标准作用域。 其值必须配置为java.util.Map,自定义范围很少使用。

概念插入:懒惰式托管:
懒惰式托管意味着只有当应用程序发出请求的时候才会去实例化bean,如果想自动提前强制将bean实例化,那么可在应用程序启动时,可以强制将bean实例化并放置在应用程序(@ApplicationScoped)范围内。您需要将托管 bean 的eager属性设置为true

@ManagedBean(eager=true)

4.JSF标签

JSF有自己的标签,这里总结一下:
JavaServer Faces提供丰富的组件库来定义应用程序的体系结构。

它包括以下内容:

丰富的用于指定用户界面组件的状态和行为的类:

  • 一种渲染模型,定义如何以各种方式呈现组件。
  • 一种定义如何将数据转换器注册到组件上的转换模型。
  • 一个定义如何处理组件事件的事件和监听器模型。
  • 一种验证模型,用于定义如何将验证器注册到组件上。

在详细的解释JSF组件之前,我们来看一下JSF标签是怎么用的,如果你学过一定的JSP标签的使用,那么应该是很好理解这些东西的。

在jsp页面中,EL标签和jsp本身自带的标签帮助我们将数据呈现在页面之上,JSF同理,只不过JSP利用的是servlet,而JSF利用的是JSF框架。

以一个完整的案例说明一下。
这是我的项目目录树:
JSF----------基础知识初解_第1张图片

下面说一下项目的配置:

  1. JavaEE 7
  2. Maven项目管理
  3. MyEclipse

整个项目就几个部分:

  1. 欢迎页面
  2. 反馈页面
  3. bean类
index.xhtml

  
  
<html 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">  
<h:head>  
    <title>Hello.xhtmltitle>  
    <meta name="keywords" content="enter,your,keywords,here" />  
    <meta name="description" content="A short description of this page." />  
    <meta name="content-type" content="text/html; charset=UTF-8" />  

      
h:head>  
<h:body>  
    <p>This is my XHTML page.p>  
    <h:form id="form">  
        <div style="padding: 100px 0 0 100px; font-size: 22px; font-weight: bold">  
           
            <h:outputLabel>User Name:h:outputLabel>
            <h:inputText id="username" value="#{user.name}" required="true" requiredMessage="User Name is required">h:inputText>
            <h:commandButton id="submit-button" value="Submit" action="response.xhtml"/>
        div>  
    h:form>  
h:body>  
html>  
response.xhtml
  
  
<html xmlns="http://www.w3.org/1999/xhtml"  
      xmlns:h="http://xmlns.jcp.org/jsf/html">  
    <h:head>  
        <title>Welcome Pagetitle>  
    h:head>  
    <h:body>  

        <h2>Hello, <h:outputText value="#{user.name}">h:outputText>h2>  
    h:body>  
html>
user.bean
package entity;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.RequestScoped;

/**
*@author:gang
*@version:
**/

@ManagedBean
@RequestScoped
public class User {

    String name;

    public String getName() {
        return name;
    }

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


}

其余的所有都是配置的时候自动生成导入的:web.xml以及faces-config.xml(因为没有用xml配置bean,所以为空)


<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" version="3.0">
  <display-name>MyJSFTestdisplay-name>
  <servlet>
    <servlet-name>Faces Servletservlet-name>
    <servlet-class>javax.faces.webapp.FacesServletservlet-class>
    <load-on-startup>1load-on-startup>
  servlet>
  <servlet-mapping>
    <servlet-name>Faces Servletservlet-name>
    <url-pattern>*.facesurl-pattern>
    <url-pattern>*.xhtmlurl-pattern>
  servlet-mapping>
  <context-param>
    <param-name>javax.faces.PROJECT_STAGEparam-name>
    <param-value>Developmentparam-value>
  context-param>

  <welcome-file-list>
    <welcome-file>
        index.xhtml
    welcome-file>
  welcome-file-list>
web-app>

以及效果:
JSF----------基础知识初解_第2张图片
JSF----------基础知识初解_第3张图片

很简单的就实现了一个数据的传递,当然,后面我们还可以使用持久化工具实现数据库的交互等更复杂的操作。

JSF HTML标签库表示HTML表单组件和其他基本HTML元素,用于显示或接受来自用户的数据。 JSF表单在提交表单后将此数据发送到服务器。

下表中列出了包含用户界面组件。

标签 功能 呈现为 外观
h:inputText 显示用户输入字符串的输入框 HTML的< input type=”text”>元素 一个输入字段域
h:outputText 显示一行文本 纯文本 纯文本
h:form 代表一个输入表单 HTML < form>元素标签 无外观
h:commandButton 它向应用程序提交表单 HTML < input type = “value”>元素,类型值可以为“submit”,“reset”或“image”
h:inputSecret 它允许用户输入字符串,但不会在字段中显示实际的字符串 HTML < input type=”password”>元素 显示一行字符而不是输入的实际字符串的字段
h:inputTextarea 它允许用户输入多行字符串 HTML < textarea>元素标签 多行字段
h:commandLink 它链接到页面上的另一页或位置 HTML < a href=”“>元素标签 一个链拉
h:inputHidden 它允许页面写入包含一个隐藏的变量和值 HTML < input type=”hidden”>元素 无外观
h:inputFile 它允许用户上传文件 HTML < input type=”file”>元素标签 具有浏览按钮的字段
h:graphicImage 它显示一个图像 HTML < img>元素标签 一个图像
h:dataTable 它代示数据包装器 HTML < table>元素标签 可以动态更新的表
h:message 它显示本地化的消息 HTML < span>标签,如果使用样式 一个文本字符串
h:messages 它显示本地化的消息 一组HTML < span>标签,如果使用样式 一个文本字符串
h:outputFormat 它显示格式化的消息 纯文本 纯文本
h:outputLabel 它将嵌套组件显示为指定输入字段的标签 HTML < label>元素 纯文本
h:outputLink 它链接到页面上的另一个页面或位置,但不生成操作事件。 HTML < a>元素 一个链接
h:panelGrid 它在一个父项下分组一组组件 HTML < div> 或 < span> 元素 在一个表中的一行
h:selectBooleanCheckbox 它允许用户更改布尔值的值 HTML < input type=”checkbox”> 元素 一个复选框
h:selectManyCheckbox 它显示一组复选框,用户可以从中选择多个值。 一组HTML < input>类型复选框的元素 一组复选框
h:selectManyListbox 它允许用户从一组全部显示的项目中选择多个项目。 HTML < select>元素 选择框
h:selectManyMenu 它允许用户从一组项目中选择多个项目 HTML < select>元素 菜单
h:selectOneListbox 它允许用户从一组全部显示的项目中选择一个项目 HTML < select>元素 选择框
h:selectOneMenu 它允许用户从一组项目中选择一个项目 HTML < select>元素 菜单
h:selectOneRadio 它允许用户从一组项目中选择一个项目 HTML < input type=”radio”>元素 一组选项
h:column 它表示数据组件中的一列数据 HTML表中的一列数据 表中的列

对于jsf标签的使用有点类似WCM平台的置标,这里将每个语句和对应的输出罗列出来。

4.1 表单

//form表单生成
<h:form id="user-form">  
    <h:outputLabel for="username">User Nameh:outputLabel>  
    <h:inputText id="username" value="#{user.name}" required="true" requiredMessage="Username is required"/><br/>  
    <h:commandButton id="submit-button" value="Submit" action="response.xhtml"/>  
h:form>



//selectBooleanCheckBox:单选框
<h:outputLabel>单选框h:outputLabel>
<h:selectBooleanCheckbox value="Remember Me" id="chkRememberMe" />
<input id="jsfForm1:chkRememberMe" type="checkbox" name="jsfForm1:chkRememberMe" checked="checked" />



//复选框,并且用table直接格式化
<h:outputLabel>复选框/h:outputLabel>
<h:selectManyCheckbox value="#{userData.data}">
   <f:selectItem itemValue="1" itemLabel="Item 1" />
   <f:selectItem itemValue="2" itemLabel="Item 2" />
h:selectManyCheckbox>

//注意,这里的table是直接格式化的,但是,现在一般table的灵活度没有div块好使,所以还是存在一定约束性
//上面的item value被自动翻译成input中的value
<table>
   <tr>
      <td><input name="j_idt6:j_idt8" id="j_idt6:j_idt8:0" value="1" 
            type="checkbox" checked="checked" />
         <label for="j_idt6:j_idt8:0" class=""> Item 1label>
      td>
      <td><input name="j_idt6:j_idt8" id="j_idt6:j_idt8:1" value="2" 
            type="checkbox" checked="checked" />
         <label for="j_idt6:j_idt8:1" class=""> Item 2label>
      td>     
   tr>
table>

//提交按钮
 <h:commandButton id="submit-button" value="Submit" action="response.xhtml"/>


//多行文本输入
   <h:inputTextarea id="text-area-id" value="#{user.address}" required="true" requiredMessage="Address is required" cols="50" rows="10">h:inputTextarea>

//a标签
<h:commandLink id="image-link-id" action="response.xhtml">  
<h:outputText value="Click here">h:outputText>  
h:commandLink>


//密码输入
<h:inputSecret value="#{user.password}" maxlength="10" size="15" required="true" requiredMessage="Password is required">h:inputSecret>

属性:

< h:form> 标签属性
属性 描述
accept 服务器处理此表单的内容类型列表将正确处理
class 组件的CSS类名称。
enctype 它用于向服务器提交内容。 如果未指定,则默认值为:”application/x-www-form-urlencoded“。
id 它是此组件的标识符,此ID值必须是唯一的。 您可以使用它来访问CSS和JS文件中的HTML元素。
lang 它描述了该组件生成的标记中使用的语言。
rendered 它用于渲染组件。 该属性的默认值为true。
onclick 当单击指针按钮时,它将执行Javascript代码。
onsubmit 当表单提交时,它会执行Javascript代码。
< h:outputText>标签属性
属性 描述
value 它保存此组件的当前值。
id 它是此组件的标识符,此ID必须是唯一的。您可以使用它来访问CSS和JS文件中的HTML元素。
style 它用于为组件应用CSS。
class 它给组件的类名,它用于从CSS和JS文件访问组件。
lang 它用于指定语言,它有助于使网页本地化。
< h:inputText> 标签的属性
属性名称 描述
id 它是此组件的标识符,ID必须是唯一的。您可以使用它来访问CSS和JS文件中的HTML元素。
value 它用于收集输入文本的当前值。
class 它给组件的类名,它用于从CSS和JS文件访问组件。
maxlength 在此字段中可能输入的最大字符数。
alt 由该组件呈现的元素的替代文本描述。
accesskey 按键的访问键将焦点转移到该元素。它将根据浏览器的不同而不同。
size 用于确定此字段宽度的字符数。
required 它表示用户需要为此输入组件提供提交的值。
requiredMessage 如果将required属性设置为true,则在“RequiredMessage”中提供的消息描述将显示到网页。
style 它用于为组件应用CSS。
rendered 它用于渲染组件。该属性的默认值为true。
convertor 它用于注册此组件的转换器实例。
readonly 它表示该组件禁止用户进行更改,通过将readonly作为此属性的值传递,可以使组件只读。 例如。 readonly =“readonly”
< h:commandButton>标签的属性

它创建一个提交按钮,用于提交申请表。 您可以使用以下语法创建它。

标签 描述
id 它是此组件的标识符,此ID必须是唯一的。您可以使用它来访问CSS和JS文件中的HTML元素。
value 它保存命令按钮的当前值,并将其显示为提交按钮的名称。
action 它用于指定表单的操作。 commandButton在指定的操作中将表单提交到服务器。 如果您不提供操作的值,在提交后将页面重定向到同一页面。
disabled 它用于禁用命令按钮,应用此属性后,您不能单击按钮。
image 它用于在commandButton上设置图像。 在本示例中,您的图像将作为提交按钮。
label 它用于为commandButton创建本地化的名称。
rendered 它用于渲染组件,该属性的默认值为true。
type 它用于指定按钮的类型,可以设置“reset”,“submit”或“button”。 如果不指定,则默认为“submit”。
style 它用于为组件指定CSS。
onclick 当单击commandButton时,它用于执行JavaScript代码。
accesskey 它用于通过使用指定的键来访问提交按钮。
< h:inputtextarea>标签属性

JSF将< h:inputtextarea>标签作为HTML的“textarea”元素。 它允许用户输入多行字符串。

标签 描述
id 它是此组件的标识符,此ID必须是唯一的。可以使用它来访问CSS和JS文件中的HTML元素。
value 它保存此组件的当前值。
cols 它用于设置文本区域的列数。
rows 它用于设置textarea的行数。
required 它表示用户需要为此输入组件提供提交的值。
requiredMessage 如果将required属性设置为true,则在“RequiredMessage”中提供的消息描述将显示到网页。
disabled 它用于禁用组件。 您可以通过分配真实值来禁用它。
onclick 它是在textarea上onclick事件触发后调用JavaScript代码的方法。
onselect 它是一种在用户选择此组件时调用JavaScript代码的方法。
readonly 它表示该组件禁止用户进行更改。 通过将readonly作为此属性的值传递,可以使组件只读。 例如: readonly =“readonly”
rendered 它用于渲染此组件。您可以将其值设置为true或false。 默认值为true。
label 它用于设置此组件的本地化名称。
lang 它用于设置此组件的语言。
style 它用于设置CSS样式代码,以提供该组件的更好的用户界面。
accesskey 按键的访问键将焦点转移到该元素。 它同浏览器的不同而不同。

SF将< h:commandLink>标签作为一个HTML “a”锚点元素,当单击时,它就像一个表单提交按钮。 因此,您可以使用此标签创建锚标签。 < h:commandLink>标签必须包含一个嵌套的< h:outputText>标记,表示用户单击文本以生成事件。 它还需要放在 < h:form>标签中。

标签 描述
id 它是此组件的标识符,此ID必须是唯一的。可以使用它来访问CSS和JS文件中的HTML元素。
value 它保存此组件的当前值。
type 由此超链接指定的资源的内容类型。
actionListener 它表示一个动作监听器方法,当该组件被用户激活时,该方法将被通知。
charset 由此超链接指定的资源的字符编码。
coords 它用于设置屏幕上热点的位置和形状(用于客户端图像映射)。
disabled 它用于禁用组件。 您可以通过分配真实值来禁用它。
hreflang 它用于设置由此超链接指定的资源的语言代码。
rel 从当前文档到由此超链接指定的锚点的关系。 此属性的值是空格分隔的链接类型列表。
rev 它是从此超链接指定的锚点到当前文档的反向链接,此属性的值是空格分隔的链接类型列表。
rendered 它用于渲染此组件。您可以将其值设置为true或false。 默认值为true。
shape 它代表屏幕上热点的形状。 有效值为:default(整个区域); 直角(矩形区域); 圆(圆形区域); 和聚(多边形区域)。
style 它用于设置CSS样式代码,以提供该组件的更好的用户界面。
< h:inputSecret>

它是一个标准的密码字段,它接受一行没有空格的文本,并在输入时将其显示为一组星号。 换句话说,它用于创建一个HTML密码字段,允许用户输入字符串,而不会在字段中显示实际的字符串。

标签 描述
id 它是此组件的标识符,此ID必须是唯一的。可以使用它来访问CSS和JS文件中的HTML元素。
value 它保存此组件的当前值。
maxlength 它表示可以在此字段中输入的最大字符数。
readonly 它表示该组件禁止用户进行更改。 通过将readonly作为此属性的值传递,可以使组件只读。 例如:readonly=”readonly”
required 它表示用户需要为此输入组件提供提交的值。
requiredMessage 如果将required属性设置为true,则在“RequiredMessage”中提供的消息描述将显示到网页。
size 用于确定此字段宽度的字符数。
rendered 它用于渲染此组件。您可以将其值设置为true或false。 默认值为true。
class 此组件的CSS类名称。
style 它用于设置CSS样式代码,以提供该组件的更好的用户界面。
label 它用于为inputSecret创建本地化的名称。
lang 它用于指定语言。 它有助于使网页本地化。
accesskey 它用于通过使用指定的键访问组件。

4.2 提示类

< h:message>用于显示特定组件的单个消息。您可以通过将该组件的id传递给for属性来显示您的自定义消息。
举例来说:就是当我们的操作不合格的时候,会有一个提示。

            "username" value="#{user.name}" required="true" requiredMessage="User Name is required">
            //定义了一个长度5-20
            for="username" minimum="5" maximum="20" />
            
            for="output" style="color:red;margin:8px;" />
            "submit-button" value="Submit" action="response.xhtml"/>

JSF----------基础知识初解_第4张图片

我认为这个提示是可以自己设定的,应该可以被重写,只是时间有限,先不关注这个。

4.3 其他

<p>图片标签p>
<h:graphicImage id="image-id" name="user-image" url="#{user.fileLocation()}"   
height="50px" width="50px" alt="Image not found">h:graphicImage>
< h:inputFile>标签的属性

JSF将其呈现为文件类型的HTML元素,它用于获取文件作为输入。 在HTML表单中,它允许用户上传文件。

标签 描述
id 它是此组件的标识符,此ID必须是唯一的。可以使用它来访问CSS和JS文件中的HTML元素。
value 它保存此组件的当前值。
required 它表示用户需要为此输入组件提供提交的值。
requiredMessage 如果将required属性设置为true,则在“RequiredMessage”中提供的消息描述将显示到网页。
class 此组件的CSS类名称。
alt 它用于设置组件的备用名称。
disabled 它用于禁用组件,您可以通过分配真实值来禁用它。
label 它用于设置此组件的本地化名称。
lang 它用于设置此组件的语言。
onclick 当用户单击此组件时,它会调用JavaScript代码。
onselect 它是一种在用户选择此组件时调用JavaScript代码的方法。
rendered 它用于渲染此组件,默认值是:true。
style 它用于设置CSS样式代码,以提供该组件的更好的用户界面。
#< h:graphicImage>标签的属性

JSF呈现一个HTML元素“img”标签。 该标签用于在网页上呈现图像。

标签 描述
id 它是此组件的标识符,此ID必须是唯一的。可以使用它来访问CSS和JS文件中的HTML元素。
value 它保存此组件的当前值。
name 它用于为此资源设置资源名称。
url 它是一个上下文相关URL来检索与此组件关联的资源。 这是“value”属性的别名。
height 它用于设置图像的高度。
width 用于设置此图像的宽度。
alt 它用于设置图像的备用名称。
class 它代表这个组件的CSS类。
dir 这是一种不继承方向性的文本的方向指示。 有效值为“LTR”(从左到右)和“RTL”(从右到左)。
onclick 它是在图像上点击之后调用JavaScript代码的方法。
rendered 它用于渲染此组件。 您可以将其值设置为true或false。 默认值为true。
rendered 它是一个标志,表示该图像将被用作服务器端图像映射。 这样的图像必须被包含在超链接(“a”)中。 值为false导致不呈现属性,而true值会导致属性被渲染为ismap =“ismap”。
style 它用于设置CSS样式代码,以提供该组件的更好的用户界面。
usemap 该元素提供图像的客户端图像映射(HTML “map”元素)的名称。

n.总结

暂时基础就总结这些,后面还有一些慢慢的整理进去。

另外实际应用部分在另外一篇博客中。

参考:
https://www.yiibai.com/jsf/jsf_form_checkbox.html

你可能感兴趣的:(JSF)