Passing the model to a Javascript function through the onSuccess of a g:formRemote

Question

I want to call a JS function either by the "onload()" function after a template has been rendered, or through the "onSuccess()" callback in the g:formRemote tag. Inside my main GSP I have the following. This code makes a callback to a controller and sets up the model to be passed into the template.

GSP:
<g:formRemote name="ptoReport" url="[controller:'Report', action:'ptoBarChart']" update="barChartDiv">
    <g:submitButton name="pto" value="PTO" class="btn btn-primary"/>
</g:formRemote>

<div id="barChartDiv">
    <g:render template="barChart"/>
</div> 

My controller code looks like so:

Controller:
def ptoBarChart(){
    Map usersAndPTO = timesheetService.getPTOForAllUsers()
    render(template: 'barChart', model:[points: usersAndPTO])
}

I want to call a JS function immediately after the template has loaded, but the trick is to pass in the "usersAndPTO" map into the JS function. I have tried adding "onLoad="barChart(${points})"" to the rendered template, but it never gets called. And adding the "onSuccess="barChart(data)"" to the g:formRemote results in me passing the GSP code for the template to the JS function.

Any help greatly appreciated.

Answer 1

check this out :

in controller i would return the points as json, too , if you only need it for the js render it only as json

render(template: 'barChart', model:[points: usersAndPTO,jsonPoints: usersAndPTO as JSON])

this is you template _barChart.gsp´s bottom

...
<g:if test="${jsonPoints}">
<script>

alert("${jsonPoints}");
// you can also pass them to a function from original dom, its available cause this template now is part of original dom
myFreakyFunction("${jsonPoints}");
</script>
</g:if>

and when the template is loaded complete,it should alert ! so