JSF <h:commandButton>带有twitter bootstrap图标

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>