I am encountering an issue with a div element:
<div draggable = "true" ng-show="showPullDown" class="topPull stretch" draggable >
</div>
The draggable=true attribute is not functioning as expected. I have attempted to set it through the controller with no success. Are there any alternative solutions or fixes available?
Here is the directive I am using:
.directive('draggable', function ($ionicGesture) {
return function(scope, element) {
var startX = 0, startY = 0, x = 0, y = 0;
element.draggable=true;
var el = element[0];
element.css({
position: 'relative',
cursor: 'pointer'
});
$ionicGesture.on('dragstart', function(e) {
e.dataTransfer.effectAllowed = 'move';
return false;
}, element);
$ionicGesture.on('dragend', function(e) {
return false;
}, element);
}
})
An error message that I encounter is:
Uncaught TypeError: Cannot set property 'effectAllowed' of undefined
In addition, while console.log(e) correctly logs the event, console.log(e.dataTransfer) returns undefined.