jtemplates append instead of overwrite

Question

Hi all,

I'm using jtemplates (jquery plugin) as my templating solution which rocks by the way! I replaced my asp.net updatepanels with this and my god what a speed booster. The problem I have however is that I'm loading user comments under an article with this templating system. I'm processing the template like this:

function ApplyTemplate(result) {
if (result.d.length == 0) {
    $('#comments_empty').show();
}
else {
    var msg = (typeof result.d) == 'string' ? eval('(' + result.d + ')') : result.d;
    $('#comments_container').setTemplate($("#comments_template").html());
    $('#comments_container').processTemplate(msg);
    $('#comments_empty').hide();
}
$('#loading').hide();

}

This works fine but what I want now I cannot achieve. I want to append the new items (because there's a button called 'show more comments' to the older ones. So I was thinking I could just use:

var html = $('#comments_container').processTemplate(msg).toString();

and then add the html to that or another container but that doesn't work. Sorry I'm not much of a jquery/javascript guy but I hope someone knows the solution.

Thank you for your time. Kind regards, Mark

Answer 1

It's kind of a shot in the dark, because I know neither the details of the jtemplates plugin nor what your templates look like.

Try this:

function ApplyTemplate(result) {
  if (result.d.length == 0) {
    $('#comments_empty').show();
  } else {
    var
      $commentsContainer = $('#comments_container'),
      msg = ((typeof result.d) == 'string' ? eval('(' + result.d + ')') : result.d),
      old = $commentsContainer.html();
    $commentsContainer.setTemplate($("#comments_template").html());
    $commentsContainer.processTemplate(msg);
    $commentsContainer.prepend(old);
    $('#comments_empty').hide();
  }
  $('#loading').hide();
}