locked
adding gesture event listeners to template HTML elements

    Question

  • 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?


    Friday, December 07, 2012 2:18 PM

Answers

  • nevermind I just realised I had left out the () bit : /

    • Marked as answer by Syllogism Friday, December 07, 2012 2:20 PM
    Friday, December 07, 2012 2:20 PM

All replies

  • nevermind I just realised I had left out the () bit : /

    • Marked as answer by Syllogism Friday, December 07, 2012 2:20 PM
    Friday, December 07, 2012 2:20 PM
  • actually onmspointerdown="transactionCard.downHandler(event)" is better since you need the event info to do anything constructive.
    Friday, December 07, 2012 2:23 PM