donnut
donnut

Reputation: 190

Using mustache to fill in a html tag argument

I'm trying the append an identier (id) to the href below using mustache

Template:

<div id='tmpl'>
    <a href='#product_detail?'{{id}}>link</a>
</div>    

var template = $('#tmpl').html();

Data:

var model = { id: 22 };

Rendering the template using the model data:

var html = Mustache.to_html(template, model);

results in:

<a href="#product_detail?%7B%7Bid%7D%7D">link</a>

If the template is changed to:

<div id='tmpl'>
    <a href='#product_detail?'{{id}}>link</a>
</div>

The resulting template is:

<a href="#product_detail?" 0="">link</a>

The 'problem' seems to be that jQuery is changing the single quotes in the template to double quotes that confuses mustache. Placing the mustache tag outside the quotes doesn't give the right results either. How can this be solved?

Thanks

Upvotes: 3

Views: 8185

Answers (2)

Nicholas McIver
Nicholas McIver

Reputation: 11

I resolved this issue pay placing ${id} into the attribute instead of {{id}} ex:

<button class="fisherytiles" type="button" data-myid="${Id}" id="imagelink">

Upvotes: 0

iRyusa
iRyusa

Reputation: 394

You need to add the {{id}} in the href, like that :

href="#product_detail?{{id}}"

We used to put our mustache template in a script with type="text/template", i don't know if it will solve your escaping problems but we haven't here.

<script type="text/template" id="tmpl">
   <a href href="#product_detail?{{id}}">link</a>
</script>

If you got some escaping problems use the & before the id like that:

<script type="text/template" id="tmpl">
   <a href href="#product_detail?{{& id}}">link</a>
</script>

Hope it help !

Upvotes: 10

Related Questions