Честно не совсем понятен ваш случай, вот рабочий пример:
<!DOCTYPE html>
<html>
<head>
<title>demo</title>
<script src='http://docs.sencha.com/ext-js/4-1/extjs/ext-all.js'></script>
<link rel="stylesheet" href="http://docs.sencha.com/ext-js/4-1/resources/css/app.css" type="text/css" />
<script>
Ext.onReady(function() {
var tpl = new Ext.XTemplate('<tpl for=".">',
'<input type="checkbox" />',
'</tpl>'
);
var panel = Ext.create('Ext.Panel', {
title: 'panel',
width: 50,
bodyStyle: 'padding: 3px',
height: 50,
renderTo: Ext.getBody()
});
panel.tpl = tpl;
panel.tpl.overwrite(panel.body, {});
});
</script>
</head>
<body></body>
</html>
хотя я бы на вашем месте использовал стандартный Ext-компонент...