Can't insert script in template #94

Closed
bictorman opened this Issue Apr 14, 2011 · 5 comments

Projects

None yet

5 participants

@bictorman

Hi, first of all thanks for the great plugin.

While trying to insert a tweet button ( http://twitter.com/about/resources/tweetbutton ) inside a template, I found that the template engine stops when it finds </script> even if it doesn't belong to the template, not rendering the rest of the content.

A workaround is to self close the script tag <script src="foobar.js" />, but some people might not figure this out.

Cheers

@geekbuntu

can you use external js to select by id/class inside the template? have it load your controller js outside the template - it selects/manipulates if the template is being used?
may need to use .delegate though - since depending on how you're using it, the tag may not exist at load time?

@BorisMoore
Owner

Not sure what you are trying to do here. If you have a template defined in a script block, then clearly the browser parser will see the </script/> closing tag as closing the block in which your are defining the template. You can use $.template( "myTemplate", "templatestring" ); to create a named template which the html markup (including the script tag) in the templatestring. That should work. If not, please post a test case on jsFiddle and reopen the issue....

@BorisMoore BorisMoore closed this Apr 18, 2011
@benblank

My thoughts:

  1. As Boris points out, this is due to the way browsers parse HTML and can't be affected by the plugin.
  2. Needing to embed a script tag in a template should be very rare. With your tweet button, for example, the template only needs to contain the link; the script can be included just once at the page level and it will still work.
  3. You can use the same trick to insert a </script> tag into a template that you do to insert one into inline Javascript — splitting it up. </scr{{= ""}}ipt> seems to work well.
@BorisMoore
Owner

Yes, I agree with Ben on all points. The trick for breaking up the script closing tag can be used if you need to define your template in a script block rather than via an HTML string, but it has a (tiny) perf cost which is better avoided.

@mesetar
mesetar commented Jan 5, 2012

I am trying to add google+, tweet and fb recommend buttons into my template

<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
        <div style="float:left; margin: 3px 0 0 3px;">
            <a href="https://twitter.com/share" data-text="Mešetar.com: ${title}" class="twitter-share-button">Tweet</a>
            <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
        </div>
        <div style="float:left; margin: 3px 0 0 3px;">
            <fb:like send="true" layout="button_count" width="100" show_faces="false" action="recommend" font="trebuchet ms"></fb:like>
        </div>
        </div>

This is the code I need to put into my classified view template.... if I put it directly, the thing does not work as expected...

any suggestions?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment