如何制作JSF复合组件的网格?

2024-07-03

我在 panelGrids 中有很多 outputLabel 和 inputText 对

<h:panelGrid columns="2">
  <h:outputLabel value="label1" for="inputId1"/>
  <h:inputText id="inputId1/>

  <h:outputLabel value="label2" for="inputId2"/>
  <h:inputText id="inputId2/>

  ...
</h:panelGrid>

我希望对所有这些都具有一些行为:例如每个输入文本具有相同的验证或相同的大小。所以我创建了一个复合组件,其中只包含一个outputLabel和一个inputText

<my:editField value="field1"/>
<my:editField value="field2"/>

但现在,当我将它们放入 gridPanel 中时,它们不会根据标签文本的长度进行对齐。我明白为什么,但我不知道如何解决。


复合组件确实被渲染为单个组件。您想改用 Facelet 标记文件。它的渲染与输出的渲染完全一样。下面是一个启动示例,假设您需要一个 3 列表单,并在第三列中包含消息字段。

在中创建标签文件/WEB-INF/tags/input.xhtml (or in /META-INF当你想在 JAR 文件中提供标签并将其包含在/WEB-INF/lib).

<ui:composition
    xmlns:c="http://java.sun.com/jsp/jstl/core"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:ui="http://java.sun.com/jsf/facelets">

    <c:set var="id" value="#{not empty id ? id : (not empty property ? property : action)}" />
    <c:set var="required" value="#{not empty required and required}" />

    <c:choose>
        <c:when test="#{type != 'submit'}">
            <h:outputLabel for="#{id}" value="#{label}&#160;#{required ? '*&#160;' : ''}" />
        </c:when>
        <c:otherwise>
            <h:panelGroup />
        </c:otherwise>
    </c:choose>

    <c:choose>
        <c:when test="#{type == 'text'}">
            <h:inputText id="#{id}" value="#{bean[property]}" label="#{label}" required="#{required}">
                <f:ajax event="blur" render="#{id}-message" />
            </h:inputText>
            <h:message id="#{id}-message" for="#{id}" />
        </c:when>
        <c:when test="#{type == 'password'}">
            <h:inputSecret id="#{id}" value="#{bean[property]}" label="#{label}" required="#{required}">
                <f:ajax event="blur" render="#{id}-message" />
            </h:inputSecret>
            <h:message id="#{id}-message" for="#{id}" />
        </c:when>
        <c:when test="#{type == 'select'}">
            <h:selectOneMenu id="#{id}" value="#{bean[property]}" label="#{label}" required="#{required}">
                <f:selectItems value="#{options.entrySet()}" var="entry" itemValue="#{entry.key}" itemLabel="#{entry.value}" />
                <f:ajax event="change" render="#{id}-message" />
            </h:selectOneMenu>
            <h:message id="#{id}-message" for="#{id}" />
        </c:when>
        <c:when test="#{type == 'submit'}">
            <h:commandButton id="#{id}" value="#{label}" action="#{bean[action]}" />
            <h:message id="#{id}-message" for="#{id}" />
        </c:when>
        <c:otherwise>
            <h:panelGroup />
            <h:panelGroup />
        </c:otherwise>            
    </c:choose>
</ui:composition>

定义它在/WEB-INF/example.taglib.xml (or in /META-INF当你想在 JAR 文件中提供标签并将其包含在/WEB-INF/lib):

<?xml version="1.0" encoding="UTF-8"?>
<facelet-taglib 
    xmlns="http://java.sun.com/xml/ns/javaee"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facelettaglibrary_2_0.xsd"
    version="2.0">
    <namespace>http://example.com/jsf/facelets</namespace>
    <tag>
        <tag-name>input</tag-name>
        <source>tags/input.xhtml</source>
    </tag>
</facelet-taglib>

声明 taglib 的用法/WEB-INF/web.xml(当标签由 JAR 文件提供时不需要,该文件包含在/WEB-INF/lib! JSF 将自动加载所有*.taglib.xml文件来自/META-INF).

<context-param>
    <param-name>javax.faces.FACELETS_LIBRARIES</param-name>
    <param-value>/WEB-INF/example.taglib.xml</param-value>
</context-param>

(多个taglib文件可以用分号分隔;)

最后只需在主页模板中声明它即可。

<!DOCTYPE html>
<html lang="en"
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:my="http://example.com/jsf/facelets"
>
    <h:head>
        <title>Facelet tag file demo</title>
    </h:head>
    <h:body>
        <h:form>
            <h:panelGrid columns="3">
                <my:input type="text" label="Username" bean="#{bean}" property="username" required="true" />
                <my:input type="password" label="Password" bean="#{bean}" property="password" required="true" />
                <my:input type="select" label="Country" bean="#{bean}" property="country" options="#{bean.countries}" />
                <my:input type="submit" label="Submit" bean="#{bean}" action="submit" />
            </h:panelGrid>
        </h:form>
    </h:body>
</html>

(the #{bean.countries}应该返回一个Map<String, String>以国家/地区代码作为键,以国家/地区名称作为值)

截屏:

希望这可以帮助。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何制作JSF复合组件的网格? 的相关文章

  • JSF 支持 bean 应该是可序列化的?

    我收到这些消息 2010 07 30T11 28 32 723 0000 警告 glassfish3 0 1 javax faces ThreadID 37 ThreadName Thread 1 设置 不可序列化的属性值 ViewMap
  • 如何在 JSF 中使用 cookie

    我有一个基于 JSF 1 2 会话范围 Bean 的 JSF 表单 我有一个 重置 按钮 它会使会话无效 我尝试使用 cookie 来记住会话之间的会话号 不是 JSF 会话 而是我的私人会话号 但失败了 我的问题 初始化 检索和存储 co
  • 使会话 Spring Security 无效

    我的网络应用程序使用 spring security 在登录时对用户进行身份验证 我还具有并发控制 以避免用户在不同的计算机上登录两次 这工作正常 但我的问题是 如果用户登录计算机 则关闭浏览器 然后他重新打开 Web 应用程序 尝试再次登
  • 使用 h:commandButton 通过 POST 打开新窗口

    我需要通过单击 a 的 POST 在新窗口中打开 JSF 页面
  • Fileupload 和 PrettyFaces 以及 JSF 2.2 [重复]

    这个问题在这里已经有答案了 我已经尝试过以下解决方案 Primefaces FileUpload 与 PrettyFaces 和 JSF 2 2 3 https stackoverflow com questions 20492015 pr
  • 当通过 Jquery 将当前页面的 html 传递到托管 bean 时,primefaces RemoteCommand 标记不起作用

    我正在使用 Jquery 的 html 方法获取当前页面的 HTML 如下所示
  • 响应式图像对齐中心 bootstrap 3

    我使用 Bootstrap 3 制作目录 当在平板电脑上显示时 产品图像看起来很难看 因为它们的尺寸较小 500x500 并且在浏览器中的宽度为 767 像素 我想将图像放在屏幕中央 但由于某种原因我不能 谁来帮忙解决问题 有 center
  • NetBeans 采用 JSF 服务器库而不是注册库

    我有一个具有以下规格的企业应用程序 EAR JavaEE 5 JDK 6 JSF 2 运行在Weblogic 11g 10 3 6 上 我里面有一个 WAR weblogic 服务器有 JSF 库 但我想要我已经提供的库 问题是 当我在 项
  • 您可以在会话过期的情况下 POST 到 JSF2 页面吗?

    我一直在使用 JSF1 2 作为登录页面 如果用户在登录页面停留时间过长 超时情况 然后尝试输入 ID 和密码 则会失败并出现 ViewExpired 错误 即使 ID 密码正确 从 JSF 的角度来看 这对我来说都是有意义的 我的解决方案
  • JSF 多个视图限制

    我创建了一个 Web 应用程序 可以在主页上的 iFrame 内打开页面 每个 iFrame 都可以通过页面上的选项卡查看 并使用 JSF2 2 和 Mojarra 视图状态 bean 来填充页面 当我打开 10 个选项卡以下的内容时 效果
  • 正确使用 Facelet 模板和复合组件

    我仍然不确定 JSF 模板和复合组件的正确使用 我需要创建一个企业 Web 应用程序 其中会有很多页面 每个页面都将具有相同的页眉 菜单 页脚 当然还有不同的内容 JSF 模板 每个页面上的内容将由可重用的 盒子 JSF 复合组件 组成 这
  • Ext JS grid 获取最后选定行的 dom

    有没有机会获得DOM网格内最后选定行的值 我只能得到带有值的记录 而不是DOM元素 和DOM元素我的意思是 tr 所选行的元素 var selectedRecord grid getSelectionModel getLastSelecte
  • JSF / 多巴哥 Facets 列表?

    有谁知道所有现有 JSF Tobago 方面的列表的良好链接 其中包含该方面的用途的解释 到目前为止 我知道 布局 和 确认 方面 但我还没有找到一个网站显示所有其他现有方面 提前致谢 通常 各个标签的文档都有其方面的描述 例如 http
  • 如何水平和垂直对齐内联块

    什么是最好 最干净的使用CSS对齐 dates div位于标题的右侧 垂直于中间 I tried float right 但这不允许vertical align 我想避免使用浮动 所以我使用inline block 并使用相对定位 有没有更
  • 组件系列、组件类型和渲染器类型之间有什么关系?

    当我学习 JSF 中的自定义组件开发时 我对组件系列 组件类型和渲染器类型之间的关系感到困惑 例如 我注册了一个渲染器和一个自定义组件 如下所示 faces config xml
  • Bootstrap 3 - 对齐列高

    创建一个用于教育目的的网站 但我遇到了网格 列高度问题 这是我尝试复制的网站图像 Click me https i stack imgur com dge5f jpg 这是我到目前为止所得到的 Click me https i stack
  • JSF 2 - Ajax - 表单未完全呈现

    我使用新选择的语言环境呈现表单的 Ajax 代码是
  • @PostConstruct 中的 CDI 参数

    我认为我的问题类似于this https stackoverflow com questions 4579711 managedpropertyvalue param id in a non request scope bean但还没发现它
  • 子表 ajax 调用内的 SelectOneRadio 不起作用

    我正在使用 primefaces 3 4 1 并且我正在尝试使用 SelectOneRadio 和 ajax 调用subtable http www primefaces org showcase labs ui datatableSubT
  • 导航栏标题视图对齐

    我希望我的导航栏在中间显示两件事 其中之一是列表名称 另一个是用户名称 用户名将放置在列表名称下 到目前为止我所做的是 我以编程方式创建了两个标签和一个超级视图 并设置titleView of navigationItem override

随机推荐