在ExtJS组合框中使用teamplate时出现Javascript错误(仅限IE)

Question

我使用的是ExtJs 4.1.1&我的申请有一个组合框。我已将TPL添加到组合框中。除了数据有特殊字符(如单引号(撇号))外，一切都很好。如果我删除TPL应用程序不会抛出任何JS错误。错误仅发生在IE中。我正在使用IE 10。

即使数据具有特殊字符，我如何确保没有java脚本错误。

这是一把小提琴

Answer 1

在模板中，您使用的是onclick属性中javascript代码中的记录数据：

onClick="Ext.PA.getController('MyController').ShowSharedQueryWindow('{Name}');"

当记录包含单引号时，模板将在该javascript代码中产生语法错误：

Ext.PA.getController('MyController').ShowSharedQueryWindow('query's');

您需要转义记录的属性以防止这种情况发生：

onClick="Ext.PA.getController('MyController').ShowSharedQueryWindow('{Name:htmlEncode:htmlEncode}');"

:htmlEncode是一种简写，可以在XTemplates中用于调用Ext.util.Format.的函数

编辑：您需要对其进行双重编码，一次用于模板，另一次用于生成的JavaScript代码(请参阅上面的更新代码)。

---

Fwiw，在XTemplate生成的HTML中使用onclick侦听器似乎不是最好的方法。通常，当我使用ExtJS时，我希望避免通过HTML添加侦听器。

您可以在组合框的绑定列表上使用itemclick监听器，如果链接被点击，它会调用相应的函数：

combo.getPicker().on({
'itemclick': function(view, record, node, index, e) {
if (e.getTarget().tagName == 'a') {
Ext.PA.getController('MyController').ShowSharedQueryWindow(record.get('Name'));
}
}
});

这样，你也可以避免逃跑的问题。