For mouse event ondragstart, .setData/.getData call in the drag(event) function works fine. However, when firing the ondragstart via .trigger() the .setData/.getData methods do not work properly and an error is returned
"Uncaught TypeError: Cannot read property 'setData' of undefined"
Please refrain from directing towards using a .js library such as TouchPunch etc.
I'm trying to bind the 'touchmove' event to fire off the drag(event) and provide the same .setData/.getData functionality that is available for the mouse drag triggered event.
HTML:
<div class="l-col-container">
<section id="1130" class="orderqueue">
<h1>Order Queue</h1>
<div class="orderList">
<div id="100" class="order" timeslot="1130" ordernumber="100" draggable="true" ondragstart="drag(event)">
<div class="order-name">Johnny Cash</div>
<div class="order-num">Order Number: 100</div>
</div>
<!-- /order -->
<div id="101" class="order" timeslot="1130" ordernumber="101" draggable="true" ondragstart="drag(event);">
<div class="order-num">101</div>
<div class="order-name">Johnny Cash</div>
</div>
<!-- /order -->
</div>
<!-- /orderlist -->
</section>
<div class="queuebar">
<h2>Queue Bar</h2>
<hr/>
<div class="queuebar-dropzone"></div>
</div>
<div id="testsensor">
<h2>Test Log</h2>
<p id="testsensor-output"></p>
</div>
</div>
<!-- /l-col-container -->
JavaScript:
var orders = $('.order');
var testelement = document.getElementById('testsensor-output');
var index = 0;
orders.each(function () {
$(this).bind('touchmove', function (evt) {
index++;
testelement.innerHTML = index + ' dragstart fired';
console.log('dragstart fired');
$(this).trigger('dragstart');
});
$(this).bind('dragstart', function(event){
drag(event);
});
});
function drag(ev) {
console.log(ev);
var obj = $('#' + ev.target.id);
ev.dataTransfer.setData("Text", ev.target.id);
var data = ev.dataTransfer.getData("Text");
}
See jquery html 5 dragstart .on('dragstart',function(e){}) e.dataTransfer.setData() doesn't work
using the event.originalEvent.dataTransfer
does the trick
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With