How to set <aui:button> icon in Liferay without using Javascript?

Question

I'm trying to set icon to <aui:button> like on this tutorial. But solution described there doesn't work well in my case, because I have a table and on each row I have a button with different resourceUrl. Like this:

<portlet:resourceURL id="saveReport" var="saveReportURL">
   <portlet:param name="reportId" value="${report.reportId}" />
</portlet:resourceURL>

<aui:button onclick="location.href = '${saveReportURL}'"> 

Is it possible to set icon in <aui:button> without using JavaScript as described in tutorial?

Thanks

Answer 1

You should be able to add an icon to a button without using JavaScript by adding one of these Icon CSS classes to your button. For example, if you wanted to create a button with a calendar icon, your code should look something like this:

<aui:button class="icon-calendar" ... />

Answer 2

You can write this below code for setting icon in liferay alloy button

<aui:button type="cancel" cssClass="btn-info" icon="icon-upload-alt" iconAlign="right" value="upload" />

you need to use the icon attribute for this setting "Icon glyphs"
you need to use cssClass for adding extra design button class for the designing
you need to set iconAlign attribute for left or right side of the button text value