Hi
I've created a template in html for use in a listview. Initially I had my template as a function but as it become more complex I decided to rather use an HTML template. At any rate my question is how do hook up gesture events in an templates HTML tag? The
gesture events don't seem be availble for the DIV HTML tag like so:
<div id="listViewElementTemplate" data-win-bind="style.visibility: root.isHelp transactionCard.setTemplateView" onload="transactionCard.endHandler()"
onmsgesturechange="transactionCard.scaleHandler" onmsgestureend="transactionCard.endHandler"
onmspointerdown="transactionCard.downHandler" onmousewheel="transactionCard.onMouseWheel"
>
This doesn't work and none of those event handlers work.
meanwhile, in the same template I have this code which listens for a click event and seems to work perfectly:
<div id="transactionCardHelp" onclick="transactionCard.createNewSplitHandler()" data-win-bind="style.visibility: root.isHelp transactionCard.setHelpView"><img src="images/transactionCard/instructions.png" /></div>
I tried putting the following JS in my default.js but not dice
app.onready = function (args) {
var trxnTemplate = document.querySelector('#listViewElementTemplate');
trxnTemplate.addEventListener("click", function (e) { //this adds support for mousewheel
console.log('MSGestureChange');
});
trxnTemplate.addEventListener("MSGestureEnd", function (e) { //this adds support for mousewheel
console.log('MSGestureEnd');
});
trxnTemplate.addEventListener("MSPointerDown", function (e) { //this adds support for mousewheel
console.log('MSPointerDown');
});
trxnTemplate.addEventListener("wheel", function (e) { //this adds support for mousewheel
console.log('wheel');
});
};
So what am I doing wrong? how can I hook up these event handlers and still use a html template?
