I'm using Scala-Play 2.5.10, Play-Bootstrap and AngularJS 1.x and I need one form submission to be handled from AngularJS. I then tried:
@b3.submit('class -> "btn btn-danger",
'ng-click -> "runInSampleSimulation()") {
<span class="glyphicon glyphicon-cog"></span> Run Simulation
}
but the ng-click
isn't recognized. I was hoping that it would be simply passed through into a Map as key-value pairs i.e. <button type="@buttonType" @toHtmlArgs(innerArgsMap)>@text</button>
see here.
So I'd be left only with the choice of falling back to plan HTML like this:
<button type="submit" class="btn btn-danger" ng-click="runInSampleSimulation()">
<span class="glyphicon glyphicon-cog"></span> Run Simulation
</button>
Is there a way to hook in the ng-click
to the b3?
I decided to achieve this through changing the form
instead of the submit
button and using ng-submit
.
Apparently there was no solution out-of-the-box. Although what I was hoping for was true that the Symbols are pass through, for some reason the dash -
is an illegal Symbol for the templates. Therefore this would give an error:
@b3.form(routes.Simulation.computeInSample, 'ng-submit -> "runInSampleSimulation()") {
So I took the form template and modified into a custom b3/ngform.scala.html
like this:
@(action: Call, args: (Symbol, Any)*)(body: => Html)(implicit fc: b3.B3FieldConstructor)
<form method="@action.method" ng-submit="@bs.Args.get(args, 'ngsubmit)('@action.toString')"
class="@fc.formClass @bs.Args.get(args, 'class)"
@toHtmlArgs(bs.Args.remove(bs.Args.remove(bs.Args.inner(args, 'role -> "form"), 'ngsubmit), 'class).toMap)>
@body
</form>
Which I can then use like this:
@b3.ngform(routes.Simulation.computeInSample, 'ngsubmit -> "runInSampleSimulation") {
and generates exactly what I had wanted:
<form class="form-horizontal ng-pristine ng-valid"
role="form" method="GET" ng-submit="runInSampleSimulation('/simulation/in/')">