Grails - 使用JSON从控制器通过Ajax渲染Map

Question

I know this is a recurrent/classical topic but I did not found anything that helped me so far. I am trying to render a Map from my controller. This results from an Ajax request and is supposed to be "eaten" by a Javascript function 'onSuccess'.

Here is my Javascript and .gsp view :

<g:javascript>
function updateVideoLoad(e) {
var map = eval("("+e.responseText+")") // evaluate the JSON
$('#resultsChecker').html(map.urlAccepted + ' - ' + map.provider + ' - ' + map.videoId + ' - ' + map.videoTag)
}
</g:javascript>
<g:formRemote name="myForm" update="" url="[controller: 'project', action:'addVideo']" onSuccess="updateVideoLoad(e)">        
    ...      
</g:formRemote>

Here is my controller :

    import grails.converters.JSON

class ProjectController {

    def addVideo() {
       ...
    def videoMap = [urlAccepted: videoList[0], provider: videoList[1], videoId: videoList[2], videoTag: videoList[3]]
    render videoMap as JSON
    }

It looks to me exactly as the example provided in the Grails documentation . However it does not work. On the browser console, I get:

Uncaught ReferenceError: e is not defined

from my g:remoteForm .

Any suggestion is most welcome. Thank you for your help.

Answer 1

I'm guessing here, but it looks like a mistake in the documentation. I would expect that this part:

 onSuccess="updateVideoLoad(e)"
                           ^^^

Should really be:

 onSuccess="updateVideoLoad(data,textStatus)"
                           ^^^^^^^^^^^^^^^^^

Looking at the generated code (under Grails 2.0), these are the variables used in the returned:

<form onsubmit="jQuery.ajax({type:'POST',data:jQuery(this).serialize(), url:'/project/addVideo',success:function(data,textStatus){updateVideoLoad(e);},error:function(XMLHttpRequest,textStatus,errorThrown){}});return false"
    method="post" action="/project/addVideo" id="myForm">

Look at the success property in the generated code.

Answer 2

This seems to be working:

<g:formRemote name="myForm" update="" url="[controller: 'project', action:'addVideo']" onComplete="updateVideoLoad(XMLHttpRequest)">

Is there a place where to get documentation on those javascript events ( onComplete , onSuccess , ...) ?

Answer 3

This appears to be a documentation bug. If using JQuery (the default as of Grails 2.0) The variable should be 'data' not 'e' and it will contain your JSON object that you returned from your controller, and there is no need to eval or parse it like in the docs.

Answer 4

I had the same problem, but I'm using Dojo.

If you use dojo, you shoud use the variable name 'response':

onComplete="updateVideoLoad(response)"

It works fine for Dojo.