javascriptregexclient-side-templatingtemplating-engine

John Resig Micro templating bug


So I am aiming to use John Resig's templating engine.

I need to pass the function a variable containing the "template". However, the problem is that I need to pass something like:

<script>
console.log("Double quotes");
</script>
<script>
console.log('single');
</script>
<iframe src="http://example.com/?<%=SOME_VARIABLE%>" frameborder="0"></iframe>
<div>I think I'm going to break</div>
<% for ( var i = 0; i < users.length; i++ ) { %>
<li><a href="<%=users[i]%>"><%=users[i]%></a></li>
<% } %>
<iframe src='http://example.com/?<%=SOME_VARIABLE%>' frameborder="0"></iframe>
<div>I think I"m going to break</div>
<% for ( var i = 0; i < users.length; i++ ) { %>
<li><a href='<%=users[i]%>'><%=users[i]%></a></li>
<% } %>

The thing that seems to break is:

<script>
console.log('single');
</script>

With this bit of code being passed through the Regex it fails. It is important that I am able to pass any of the above code and have it not break. Any ideas?


Solution

  • So I came across this article which has a fix for this (also changes the <% %> to <# #> FYI

    str.replace(/[\r\t\n]/g, " ")
                   .replace(/'(?=[^#]*#>)/g, "\t")
                   .split("'").join("\\'")
                   .split("\t").join("'")
                   .replace(/<#=(.+?)#>/g, "',$1,'")
                   .split("<#").join("');")
                   .split("#>").join("p.push('")
                   + "');}return p.join('');";
    

    http://weblog.west-wind.com/posts/2008/Oct/13/Client-Templating-with-jQuery