Adding child elements to submit button. E.g. a span within the button

Question

I need to add create a button with the output of something like

<button class="my-btn" action="${nextAction}" disabled="${nextDisabled}">
<span class="next-icon">Next</span>
</button>

I can use the below code to output the button fine, but I can't figure out how to add the span within it.

<g:actionSubmit name="next" value="${nextText}" class="my-btn" action="${nextAction}" disabled="${nextDisabled}"/>

Any ideas?

Answer 1

You won't be able to do this with the g:actionSubmit because it doesn't allow a body to be included in the tag. The button element allows spans just fine. I use this technique quite a bit and in fact, a lot of the Bootstrap markup for things like Button Dropdowns embed spans in buttons for images.

I think what you'll need to do is just give a name to the button and submit the form to a single action then use the name of the button to determine what logic you need to perform.

<g:form action="save" controller="foo">
  <button name="action1">Action 1</button>
  <button name="action2">Action 2</button>
</g:form>

def save() {
  if (params.action1) {

  } else if (params.action2) {

  }
}

Something like that anyway.