JSViews: multiple 'link's

Question

I'm running into some strange behavior with JSViews 1.0.0alpha. At least, I think it's not me, but I'm not entirely sure...

I'm defining multiple parts of data and templates in one HTML file:

  var data = { extensions: [], queues: [] };

  $.templates({
    extensions: "#extensionsTemplate",
    queues: "#queuesTemplate"
  });

And then I bind these bits of data to the templates I've defined:

  $.templates.extensions.link('#extensions', data);
  $.templates.queues.link('#queues', data);

When I execute, only the first link command works well. The second one, however, doesn't do anything. I know it's correct, though, because if I comment out the first link, the second one works just fine.

I've tried splitting data into multiple variables, but that doesn't work either. Does anyone have any thoughts on how to get the behavior I'm looking for, i.e., two data links? Thanks!

Can you confirm whether the code in my answer below does work for you, and if so mark the answer as accepted? If not, can you create a jsfiddle of your code - since there is perhaps some other issue there... Thanks. — BorisMoore

BorisMoore BorisMoore · Accepted Answer · 2014-06-30T18:26:18

That should work fine.

This works correctly for me:

<script id="extensionsTemplate" type="text/x-jsrender">
  a{{for extensions}}{{:#data}}{{/for}}
</script>

<script id="queuesTemplate" type="text/x-jsrender">
  b{{for queues}}{{:#data}}{{/for}}
</script>

<div id="extensions"></div>
<div id="queues"></div>

<script type="text/javascript">

var data = { extensions: [1,2], queues: [3,4] };

$.templates({
    extensions: "#extensionsTemplate",
    queues: "#queuesTemplate"
});

$.templates.extensions.link('#extensions', data);
$.templates.queues.link('#queues', data);

</script>

JSViews: multiple 'link's

1 Answers