使用带有 jsf 表单的 html 输入答案

【问题标题】：using html input with jsf form使用带有 jsf 表单的 html 输入
【发布时间】：2016-08-17 19:03:06
【问题描述】：

我在一个 jsf 2.2 应用程序上工作，我想使用 Bootstrap。
所以我下载了 Bootstrap 模板并尝试对其进行调整。
但是当我使用 h:inputText 时，它看起来不像我使用 Html 输入时那样好
这就是我使用 Html 输入但在托管 bean 中我必须使用此代码才能获取输入值的原因。

HttpServletRequest req = (HttpServletRequest) FacesContext.getCurrentInstance().getExternalContext().getRequest();
    nom=req.getParameter("name");

我不确定这是否是最佳选择，因为我并没有真正使用 jsf 的好处。

【问题讨论】：

“但是当我使用 h:inputText 时，它看起来不像我使用 Html 输入时那样好” 那么你以错误的方式使用它。您最好退后一步，编辑并重新构建您的问题，以询问如何正确使用它，同时展示您的尝试并告知预期的 HTML 输出。 JSF 的好处之一是您不再需要手动摆弄请求参数（以及对这些参数的转换/验证）。

标签： html twitter-bootstrap jsf jsf-2

【解决方案1】：

您也可以使用 javascript。在提交表单之前，为您的表单提交或按钮单击添加一个侦听器以使用您的 HTML 字段新值更新隐藏字段 (<h:input type="hidden"/>) 值。并将该隐藏字段的值绑定到后台 bean 属性。

但我不建议使用这种方法，因为你的代码库用了一段时间就会变得一团糟，如果你在写 JSF，你必须充分利用 JSF 的特性。

更难但更标准的方法是创建一个自定义 JSF 组件。

为此，您必须在 JSF 中扩展 UIComponentBase 类，然后将您的渲染器注册为一个新组件，如下所示：

<faces-config xmlns="http://java.sun.com/JSF/Configuration">
   <component>
   <component-type>tss.hello.JsfHello</component-type>
   <component-class>tss.hello.HelloUIComp</component-class>
</component>
 ...
</faces-config>

然后你需要像这样将这个组件添加为标签库（WebINF 文件夹中的 TLD 文件）：

    <?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE taglib
  PUBLIC "-//Sun Microsystems, Inc.//DTD JSP Tag Library 1.2//EN" 
  "http://java.sun.com/dtd/web-jsptaglibrary_1_2.dtd">
<taglib>
<tlib-version>0.01</tlib-version>
<jsp-version>1.2</jsp-version>
<short-name>simple</short-name>
<uri>http://theserverside.com/simplefacescomponents</uri>
<description>This tag library contains simple JSF Component examples.</description>


<tag>
<name>jsfhello</name>
<tag-class>tss.hello.FacesHelloTag</tag-class>

<attribute> 
<name>binding</name> 
<description>A value binding that points to a bean property</description>
</attribute> 

<attribute> 
<name>id</name> 
<description>The client id of this component</description>
</attribute> 

<attribute> 
<name>rendered</name>
<description>Is this component rendered?</description>
</attribute>

<attribute> 
<name>hellomsg</name>
<description>a custom message for the Component</description>
</attribute>

</tag>

</taglib>

然后你可以像这样使用你的标签：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ page contentType="text/html;charset=windows-1252"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://theserverside.com/customfacescomponents" prefix="cf"%>
<f:view>
  <html>
    <head>
      <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"></meta>
    </head>
    <body>
     <h:form>

     <p>A simple HelloWorld Custom Component:</p>

     <p>The HelloWorld UI Component:</p>
     <cf:jsfhello hellomsg="Hello world! This is output from a custom JSF Component!"   />


     </h:form>
    </body>
  </html>
</f:view>

查看this link了解完整的自定义组件教程

【讨论】：

OP 使用的是 JSF 2.x 而不是 JSF 1.x。这个答案假设 JSF 1.x。此外，如果设置正确的 Bootstrap 样式只是设置正确的一个属性，那么自定义组件绝对是矫枉过正，这个答案没有涵盖。
是的，这是正确的，我认为他无论如何都想使用他的自定义标签。谢谢。