How do I put a Bootstrap Glyphicon inside an asp:Button in ASP.Net?
I'm using Bootstrap 3 in my project, and I want to use Bootstrap Glyphicons in ASP.net buttons.
Here is the code I used, though it didn't work out (I got a sample which uses Twitter Bootstrap <span>
tags instead of <i>
tags):
<asp:Button ID="btnRandom"
runat="server"
Text="<span aria-hidden='true'
class='glyphicon glyphicon-refresh'>
</span>"
onclick="btnRandom_Click" />
Maybe something extra should be done.
How can I get it to work? Thanks in advance for the replies.
Solution 1:
You have to use asp:LinkButton instead of a asp:Button, here is how it works for me using Bootstrap 3 in an ASP.NET web-application:
From your code you can make the following work:
<asp:LinkButton ID="btnRandom"
runat="server"
CssClass="btn btn-primary"
OnClick="btnRandom_Click">
<span aria-hidden="true" class="glyphicon glyphicon-refresh"></span>
</asp:LinkButton>
Here is an example of what I use for a Submit Button with text "Submit":
<asp:LinkButton ID="SubmitBtn"
runat="server"
CssClass="btn btn-primary"
OnClick="SubmitBtn_Click">
<span aria-hidden="true" class="glyphicon glyphicon-ok"></span>Submit
</asp:LinkButton>
Solution 2:
What is real use of ASP Server
control when you can do that in HTML
server control :
You can convert the HTML element to a server control by setting the runat="server" attribute.
<button runat="server" >
<span aria-hidden="true" class="glyphicon glyphicon-refresh"></span>Refresh
</button>