Syntax Error with John Resig's Micro Templating after changing template tags <# {% {{ etc

Question

I'm having a bit of trouble with John Resig's Micro templating.

Can anyone help me with why it isn't working?

This is the template

<script type="text/html" id="row_tmpl">
test content {%=id%} {%=name%}
</script>

And the modified section of the engine

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

and the javascript

var dataObject = { "id": "27", "name": "some more content" };
var html = tmpl("row_tmpl", dataObject);

and the result, as you can see =id and =name seem to be in the wrong place? Apart from changing the template syntax blocks from <% %> to {% %} I haven't changed anything.

This is from Firefox.

Error: syntax error
Line: 30, Column: 89
Source Code:
var p=[],print=function(){p.push.apply(p,arguments);};with(obj){p.push(' test content ');=idp.push(' ');=namep.push(' ');}return p.join('');

Answer 1

To change the tags in John Resig's Micro-Template Library, you must change two split() calls and the two regular expressions from the original code.

For example, changing the original tags <%= %> to {{= }} is done like so

//ORIGINAL
str
  .replace(/[\r\t\n]/g, " ")
  .split("<%").join("\t")              //CHANGE string "<%"
  .replace(/((^|%>)[^\t]*)'/g, "$1\r") //CHANGE expression /((^|%>)[^\t]*)'/g
  .replace(/\t=(.*?)%>/g, "',$1,'")    //CHANGE expression /\t=(.*?)%>/g
  .split("\t").join("');")             
  .split("%>").join("p.push('")        //CHANGE string "%>"
  .split("\r").join("\\'")

//INTO
str
  .replace(/[\r\t\n]/g, " ")
  .split("{{").join("\t")                //INTO string "{{"
  .replace(/((^|\}\})[^\t]*)'/g, "$1\r") //INTO expression /((^|\}\})[^\t]*)'/g
  .replace(/\t=(.*?)\}\}/g, "',$1,'")    //INTO expression /\t=(.*?)\}\}/g
  .split("\t").join("');")
  .split("}}").join("p.push('")          //INTO string "}}"
  .split("\r").join("\\'")

Be carefull when changing regular expressions in the engine, you must escape special characteres. In javascript flavor of regexp, these are: \ / [ ] ( ) { } ? + * | . ^ $ Escape them by prefixing them with "\". This does not apply to the split params as they are not regexp in this case.

Answer 2

When you modified the engine, you forgot to change these lines:

  .replace(/((^|%>)[^\t]*)'/g, "$1\r")
  .replace(/\t=(.*?)%>/g, "',$1,'")

to this:

  .replace(/((^|%\})[^\t]*)'/g, "$1\r")
  .replace(/\t=(.*?)%\}/g, "',$1,'")