Geek Answers Handbook

Put HTML in the submit button value

I have a submit button that is used to save the form. Inside the submit button, I want to use an HTML tag. I use Font Awesome , and I would like the save icon to appear next to the word save in the button. HTML for this

<i class="icon-save"></i> Save

The only problem is that I cannot get HTML to display inside the value="" property on the submit button. How can I display HTML inside the submit button? This does not parse HTML, it actually displays a button with literal content

 <input type="submit" value="<i class='icon-save'></i> Save" />

Here is an example of what I want

+4
source share
2 answers

You tried the button tag as follows:

 <button type="submit"> <i class='icon-save'></i> Save </button>
+13
source

Using a background image can also achieve this JSFiddle

 <input type="button" style="background-image:url(http://icons.iconarchive.com/icons/double-j-design/ravenna-3d/24/Access-icon.png); background-position:left; background-repeat:no-repeat; padding-left:30px; padding-top:4px; padding-bottom:4px; padding-right:4px" value="Save" />​
0
source

More articles:


All Articles