If statements inside an element attribute

[conder]

Data elements render inside an attribute of an element in a template, but the conditional if statement does not seem to work (see title attribute of div element below):

<script id="RunTemplate" type="text/x-jquery-tmpl">
            

                        {{#if photo_fs}}
                            
                        {{else if photo}}
                            
                        {{/end}}
            
</script>

When it renders I see:

<div class="runtemplatex" title="Hudson <!--tmpl() _5--><!--/tmpl--> Moore ">
<!--tmpl() _10-->
<img src="filesystem:http://localhost:8082/persistent/images/hpm6-176790.jpg">
<!--/tmpl-->
</div>

The injected annotations seem to be the problem. Any way to stop those?

Thanks,
Joseph Conder

[conder]

I was able to make this work using a view helper. Should I be able to use that syntax however inside an attribute?

[BorisMoore]

Using {{if}} or {{each}} within attribute markup does not currently work by default, if JsViews is loaded, because JsViews sets a flag for JsRender: $.views.activeViews = true, which tells JsRender to insert comment-based annotations for data binding. You can temporarily set $.views.activeViews = false before rendering, and then switch back after rendering, and things should work fine.

Otherwise you can do:

{{#if preferred_first != first}}
 <div class="runtemplatex" title="{{=first}}({{=preferred_first}}) {{=last}}">
{{else}}
  <div class="runtemplatex" title="{{=first}} {{=last}}">
{{/if}}           

Or again, you can use data binding, along the lines of:

 <div class="runtemplatex" data-getfrom="title:$ctx.getTitle([first], [preferred_first])">

I think some of this will change when we reach beta for JsViews, and this problem should no longer arise...

[BorisMoore]

With the latest update, you can set {link:false} in options that you pass in to render (See #86 (comment) for details)

var html =  $("#myTemplate").render(data, {link: false});

or

var html =  $.render.myTemplate(data, {link: false});

But if you are using JsViews data within your template, you probably don't want to switch off the linking for the whole template. In that case, you can instead set link=false on any block tag.

 <div title="{{:first}} {{if preferred_first != first link=false}}({{:preferred_first}}){{/end}} {{:last}}">

You can even use one or more {{else}} tags, as long as you put link=false on each of them:

<div {{if test link=false}}id="yay"{{else test2 link=false}}class="special"{{else link=false}}id="nay"{{/if}}>

Closing, since this scenario is now supported.