Question

I need to pass the response from ajax call to a jquery template.The response json is not malformed.I have checked this by using alert statements in the ajax fn.When the response is passed to the template,it does not get recognized.For example,when I use ${field1} in template,nothing gets displayed in the browser.No error messages are displayed at the browser.Can someone help me fix this issue?

Json response from server:

    { 
        "field1": 23432434, 
        "field2": "sometext",
    }

Ajax fn:

    function getinfo(uri)
    {
        jQuery.ajax({
        url:    'http://{{request.META.SERVER_NAME}}'+uri,
        success: function(info) {
                  return info;
              },
        async:   false,
        dataType: 'jsonp'
        });
     }

Template:

    <script id="infoTemplate" type="text/x-jQuery-tmpl">
            <div>${field1}</div>
   </script>

Code to Bind JSON to template:

<script id="Template1" type="text/x-jQuery-tmpl">      
      {{tmpl(getinfo(uri)) "#infoTemplate"}} 
</script>

Note: I can’t use the following method to bind JSON with template.That’s a long story.

function getinfo(uri)
{
    $.getJSON('http://{{request.META.SERVER_NAME}}'+uri, function(data) {
         $("#infoTemplate").tmpl(data).appendTo("#somedivid");
   });
}

Answer 1

That’s not how callbacks work. You’re returning info to the callback function, and not to getinfo.

You either have to do something like you proposed after, or keep the result from the ajax call in a global var and call the tmpl function after while, to be sure that you have already got the answer from the ajax call. The first way is the way to go.