CODEWITHSUNDEEP
javascriptjquerydust.js
Tam2
Tam2

Reputation: 1367

dust.js render dynamic content

I have the below code in my template which gives the desired output when the page is loaded.

Is there a way to have dust render the page dynamically as i am using sockets to update the data

{#storylines}
<li>{text|bl|s} <span class="badge yellow">{@negidx}{.}{/negidx}</span></li>    
{/storylines}

Socket IO code:

socket.on('updatechat', function (username, data) {
       $('#newstoryline').before(blurlines(data));
});

I've tried simply adding <span class="badge yellow">{@negidx}{.}{/negidx}</span> to end of the data but the output is {@negidx}{.}{/negidx} - is there any way to have dust.js render the latest data? or will i have to use some sort of jQuery instead of {@negidx}{.}{/negidx}?

Upvotes: 0

Views: 780

Answers (1)

smfoote
smfoote

Reputation: 5609

If you are rendering your templates client-side, this should be easy. Your code would look something like this:

socket.on('updatechat', function (username, data) {
  if (data) {
    dust.render('storyline', data, function(err, output) {
      if (output) {
        $('#newstoryline').before(output);
      }
    });
  }
});

What's going on here:

The returned data should be JSON. Check that something has been returned.

  if (data) {

Use dust to render the template using the returned data.

    dust.render('storyline', data, function(err, output) {

Check for output:

  if (output) {

Insert the output into your page. This is usually done with innerHTML, but you can use whatever works for you. Remember, the output is a string at this point.

        $('#newstoryline').before(output);

Upvotes: 1

Related Questions