Struts 2 bug – s:submit tag type=button rendering

In Struts 2.0.11, the s:submit tag with type=button does not render properly.

While working on a project using Struts 2, I was attempting to create a HTML button that looked something like:

<button type="button" class="button positive save">
    <img src="/images/tick.png" alt="Save"> Save
</button>

I followed the Struts 2 Tag Reference for the submit tag and tried the following:

<s:submit type="button" cssClass="button positive save">
    <img src="/images/tick.png" alt="Save"> Save
</s:submit>

Instead of rendering like my example above, it looks like:

<img src="/images/tick.png" alt="Save"> Save
<button type="submit" id="test_0" value="Submit" class="button positive save">Submit</button>

Not exactly what I had in mind… 😉

At first I thought that I was just doing something wrong, so I posed a question on the mailing list. Then after searching the list some more, I found that this was, in fact, a bug and that it had been previously reported and supposedly fixed.

I checked out the Struts 2 core project and started looking around in the code. I posted some of my thoughts and ended up creating a patch that added a new s:button tag.

Struts tries to render the button tag using the same code that is used to render the input tag. The two tags share a lot in common, however, there are some important differences between them. Mainly, the input tag does not have a body and uses its value attribute for its label, whereas the button tag must have a body, which is what is used as its label. Unless you required name/value information to be sent for the button, there is no need to include either of those attributes on the button tag.

It will be interesting to see if my patch is used…either way, it was fun to dig into the Struts code and it was a good learning experience.