jsf - h:commandButton 带有 twitter 引导程序或其他图标

Question

我正在使用 twitter bootstrap css 来设置样式。要在其中制作图标按钮，标准方法是使用“i”标签。 <button type="submit"><i class="icon-search"></i></button>.

但我不能在 <h:commandButton id="myid"><i class="icon-search"></i></h:commandButton> 如何在渲染中添加 HTML 中 输入它<h:commandButton>？

Answer 1

你可以在<i class="icon-search"></i>里面添加h:commandLink

命令链接可以设置为按钮

<h:commandLink id="btnsearch"
    action="search.xhtml"
    styleClass="btn btn-default">
    <i class="icon-search"></i> Search
</h:commandLink>

Answer 2

我现在只是使用了一个hack。就像这样（我隐藏了 h:commandButton 并添加了一个新的提交按钮）。

<h:form id="myFrm" >
   <h:inputText id="search" value="#{user.name}"></h:inputText>
   <h:commandButton id="btnsearch" action="search.xhtml" style="display: none"></h:commandButton>
   <button  type="submit" id="myFrm:btnsearch" name="myFrm:btnsearch"><i class="icon-search"></i></button>
</h:form>