JSF 2.0中的复合组件

最新推荐文章于 2020-05-27 21:51:28 发布

cyan20115

最新推荐文章于 2020-05-27 21:51:28 发布

阅读量374

点赞数

文章标签： xhtml java

从JSF 2.0开始，创建可重用的组件（称为复合组件）非常容易。在本教程中，我们向您展示如何创建一个简单的复合组件（存储为“ register.xhtml ”），这是一个用户注册表单，包括名称和电子邮件文本字段（ h:inputText ）和一个提交按钮（ h:commandButton ）。此外，我们还将向您展示如何使用它。

创建复合组件

这是创建复合组件的步骤：

1.复合命名空间

创建一个.xhtml文件，并声明复合名称空间。

<html xmlns="http://www.w3.org/1999/xhtml"   
      //...
      xmlns:composite="http://java.sun.com/jsf/composite">
</html>

2.接口与实现

使用复合标签composite:interface ， composite:attribute和composite:implementation定义复合组件的内容。例如，

<html xmlns="http://www.w3.org/1999/xhtml"   
      //...
      xmlns:composite="http://java.sun.com/jsf/composite">
	  
	  <composite:interface>
			<composite:attribute name="anything" />
	  </composite:interface>
	  
	  <composite:implementation>
			#{cc.attrs.anything}
	  </composite:implementation>
</html>

composite:interface标记用于声明可配置的值，这些值可公开给使用它的开发人员。而且composite:implementation标记声明了所有XHTML标记，它们是Composite组件的内容，在composite:implementation标记内，您可以使用表达式#{cc.attrs.attributeName}来访问composite:interface属性。

3.资源文件夹

将复合组件（“ .xhtml”文件）放入JSF的资源文件夹，请参见图1：

图1：此示例的目录结构。

在这种情况下，将“ register.xhtml ”复合组件放入名为“ mkyong”的文件夹中。

4.完整的例子

完成后，让我们看看“ register.xhtml”的完整示例。

档案：register.xhtml

<?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:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:composite="http://java.sun.com/jsf/composite"
      >
    
    <composite:interface>
    
    	<composite:attribute name="nameLable" />
    	<composite:attribute name="nameValue" />
    	<composite:attribute name="emailLable" />
    	<composite:attribute name="emailValue" />
    	
   	<composite:attribute name="registerButtonText" />
    	<composite:attribute name="registerButtonAction" 
    		method-signature="java.lang.String action()" />
    		
    </composite:interface>
	
    <composite:implementation>
	
	<h:form>
			
		<h:message for="textPanel" style="color:red;" />
			
		<h:panelGrid columns="2" id="textPanel">
			
			#{cc.attrs.nameLable} : 
			<h:inputText id="name" value="#{cc.attrs.nameValue}" />
				
			#{cc.attrs.emailLable} : 
			<h:inputText id="email" value="#{cc.attrs.emailValue}" />
				
		</h:panelGrid>
			
		<h:commandButton action="#{cc.attrs.registerButtonAction}" 
			value="#{cc.attrs.registerButtonText}"
		/>
		
	</h:form>
		
    </composite:implementation>
	
</html>

使用复合组件

您刚刚创建了一个复合组件“ register.xhtml”，现在我们向您展示如何使用它。

1.复合组件访问路径

参见上面的图1； “ register.xhtml”文件位于“ mkyong”文件夹下。这是您的访问方式：

<html xmlns="http://www.w3.org/1999/xhtml"   
      ///...
      xmlns:mkyong="http://java.sun.com/jsf/composite/mkyong"
      >
	  <mkyong:register />
</html>

http://java.sun.com/jsf/composite/folder-name-in-resources-folder
复合组件的文件夹名称定义为组件访问路径，例如，如果将“ register.xhtml”文件放在名为“ abc”的文件夹下，则应按以下方式访问它：
<html xmlns="http://www.w3.org/1999/xhtml"   
      ///...
      xmlns:mkyong="http://java.sun.com/jsf/composite/abc"
      >
	  <mkyong:register />
</html>

2.完整的例子

让我们看一个完整的示例，以显示“ register.xhtml”复合组件的用法。

文件：default.xhtml

<?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:h="http://java.sun.com/jsf/html"
      xmlns:mkyong="http://java.sun.com/jsf/composite/mkyong"
      >
 
    <h:body>
 
    	<h1>Composite Components in JSF 2.0</h1>
 
	<mkyong:register 
		nameLable="Name" 
		nameValue="#{user.name}" 
		emailLable="E-mail" 
		emailValue="#{user.email}"

		registerButtonText="Register" 
		registerButtonAction="#{user.registerAction}"
	 />
	
    </h:body>
 
</html>

允许您通过公开的属性将硬编码值或后备方法或属性传递到复合组件中，提交表单时，JSF将自动完成所有后备bean绑定。

PS这是对感兴趣的用户的“用户”托管或支持Bean。

package com.mkyong;
 
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

@ManagedBean(name="user")
@SessionScoped
public class UserBean{
 
	public String name;
	public String email;
	
	//getter and setter methods for name and email

	public String registerAction(){
		return "result";
	}
}

演示版

这是结果。

网址： http：// localhost：8080 / JavaServerFaces / default.xhtml

下载源代码

下载它– JSF-2-Composite-Components-Example.zip （11KB）

参考

标签：组件 jsf2

翻译自: https://mkyong.com/jsf2/composite-components-in-jsf-2-0/

cyan20115

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
JSF 2.0中的复合组件

从JSF 2.0开始，创建可重用的组件（称为复合组件）非常容易。在本教程中，我们向您展示如何创建一个简单的复合组件（存储为“ register.xhtml ”），这是一个用户注册表单，包括名称和电子邮件文本字段（ h:inputText ）和一个提交按钮（ h:commandButton ）。此外，我们还将向您展示如何使用它。创建复合组件这是创建复合组件的步骤： 1.复合命...
复制链接

扫一扫