h:commandButton avec twitter bootstrap ou une autre icône

Je suis en utilisant twitter bootstrap css pour le style. Pour faire des boutons d'icône, la norme est d'utiliser le "je" balises.
<button type="submit"><i class="icon-search"></i></button>.

Mais je ne peux pas entrer dans
<h:commandButton id="myid"><i class="icon-search"></i></h:commandButton>
Comment puis-je ajouter du code HTML dans le rendu de la <h:commandButton> ?

OriginalL'auteur Sasinda Rukshan | 2013-07-27

  1. 7

    Vous pouvez ajouter <i class="icon-search"></i> à l'intérieur de h:commandLink

    Commande lien pourrait être considéré comme bouton

    <h:commandLink id="btnsearch"
    action="search.xhtml"
    styleClass="btn btn-default">
    <i class="icon-search"></i> Search
</h:commandLink>
    J'ai trouvé que l'utilisation de cette solution, car il rend une ancre-tag, la forme ne se soumet pas à entrer. D'autres que c'est une bonne solution.
    Si vous utilisez cette solution combinée avec balusC de réponse dans ce stackoverflow.com/questions/5485851/... La touche entrée sera trop de travail.

    OriginalL'auteur n1k1ch

  2. 1

    J'ai juste utilisé un hack pour le moment. C'est comme ça (j'ai caché la h:commandButton et a ajouté un nouveau bouton envoyer).

    <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>

    OriginalL'auteur Sasinda Rukshan