See Font Awesome Icons for nice glyphicons.
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://xmlns.jcp.org/jsf/html" xmlns:f="http://xmlns.jcp.org/jsf/core" xmlns:b="http://butterfaces.org/components"> <h:head /> <body> <h:form id="formId"> <b:commandLink id="input" value="click me" glyphicon="glyphicon glyphicon-thumbs-up glyphicon-lg" styleClass="btn btn-primary" ajaxDisableLinkOnRequest="true" ajaxShowWaitingDotsOnRequest="true" ajaxHideGlyphiconOnRequest="false" ajaxDisableRenderRegionsOnRequest="true" ajaxProcessingGlyphicon="fa fa-refresh fa-spin" action="#{myBean.increaseClick}" rendered="true"> <f:ajax render="SECTIONS" /> </b:commandLink> <hr /> <h:panelGroup id="clicks" layout="block"> #{myBean.clicks} clicks </h:panelGroup> </h:form> </body> </html>
package org.butterfaces.command.link.demo; @ViewScoped @Named public class MyBean implements Serializable { private int clicks = 0; public void increaseClick() { try { Thread.sleep(2000); } catch (InterruptedException e) { // this error is not ok... } clicks++ } public int getClicks() { return clicks; } }
<?xml version="1.0" encoding="UTF-8"?> <web-app xmlns="http://xmlns.jcp.org/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-app_3_0.xsd" version="3.0"> <!-- Button text when ajax request is running --> <!-- default is Processing --> <context-param> <param-name>org.butterfaces.ajaxProcessingTextOnRequest</param-name> <param-value>Processing</param-value> </context-param> <!-- Glyphicon when ajax request is running --> <!-- default is empty --> <context-param> <param-name>org.butterfaces.ajaxProcessingTextOnRequest</param-name> <param-value></param-value> </context-param> <!-- Shows waiting panel over regions that will be renderer by ajax request --> <!-- Could be overridden by ajaxDisableRenderRegionsOnRequest component attribute --> <!-- default is true --> <context-param> <param-name>org.butterfaces.ajaxDisableRenderRegionsOnRequest</param-name> <param-value>true</param-value> </context-param> </web-app>