tags:

views:

100

answers:

1

Why would this example fail when the XTemplate is built using string in double quotes, the same example works when string are defined whithin single quotes. The code just dies silently

    var tplData = [{ // 1
    color : "#FFE9E9",
    name : 'Naomi White',
    age : 25,
    dob : '03/17/84',
    cars : ['Jetta', 'Camry', 'S2000']
    },{
    color : "#E9E9FF",
    name : 'John Smith',
    age : 20,
    dob : '10/20/89',
    cars : ['Civic', 'Accord', 'Camry']
}];
var myTpl = new Ext.XTemplate( // 2
    "<tpl for='.'>", // 3
    "<div style='background-color: {color}; margin: 10px;'>",
    "<b> Name :</b> {name}<br />",
    "<b> Age :</b> {age}<br />",
    "<b> DOB :</b> {dob}<br />",
    "</div>",
    "</tpl>"
);
myTpl.compile();
myTpl.append(document.body, tplData);   

The same example with single quotes strings.

    var tplData = [{ // 1
    color : "#FFE9E9",
    name : 'Naomi White',
    age : 25,
    dob : '03/17/84',
    cars : ['Jetta', 'Camry', 'S2000']
    },{
    color : "#E9E9FF",
    name : 'John Smith',
    age : 20,
    dob : '10/20/89',
    cars : ['Civic', 'Accord', 'Camry']
}];
var myTpl = new Ext.XTemplate( // 2
    '<tpl for=".">', // 3
    '<div style="background-color: {color}; margin: 10px;">',
    '<b> Name :</b> {name}<br />',
    '<b> Age :</b> {age}<br />',
    '<b> DOB :</b> {dob}<br />',
    '</div>',
    '</tpl>'
);
myTpl.compile();
myTpl.append(document.body, tplData);       
+2  A: 

I guess it doesn't explicitly say that double-quotes are required in XTemplate operators, but all of the examples and documentation use them and it is inferred. It probably should be stated explicitly.

The only issue in the first code block is the "<tpl for='.'>", line. Double-quotes are required in operators, so if you prefer to use double-quotes around your template strings, you must escape any operators like so: "<tpl for=\".\">", Or just use single-quoted strings to make your life easier.

BTW, you can verify that this is a requirement by looking at the code in XTemplate:

nameRe = /^<tpl\b[^>]*?for="(.*?)"/,

As you can see, the regex explicitly expects a double-quoted for operator.

bmoeskau