draggable="true"
is not working in firefox. The following code working fine in chrome,but not in firefox.
DragDropDemo.app
<aura:application >
<aura:attribute name="values"
type="String[]"
access="private" />
<aura:attribute name="dragid"
type="Integer"
access="private" />
<aura:handler name="init"
value="{!this}"
action="{!c.doInit}" />
<div class="droparea"
ondragover="{!c.cancel}"
ondragenter="{!c.cancel}"
ondrop="{!c.drop}">
<aura:iteration items="{!v.values}"
indexVar="index"
var="value">
<div class="row"
draggable="true"
ondragstart="{!c.dragstart}"
data-drag-id="{!index}">
{!value}
</div>
</aura:iteration>
</div>
</aura:application>
DragDropDemo.css
.THIS.droparea{
border: 1px solid black;
position: relative;
margin: 3px;
}
.THIS.droparea .row {
position: relative;
border: 1px solid red;
padding: 3px;
margin: 3px;
}
DragDropDemoController.js
({
doInit: function(component, event, helper) {
var values = "a b c d e".split(' ');
component.set("v.values", values);
},
dragstart: function(component, event, helper) {
component.set("v.dragid", event.target.dataset.dragId);
},
drop: function(component, event, helper) {
var dragId = component.get("v.dragid"),
values = component.get("v.values"),
temp;
temp = values[dragId];
values[dragId] = values[event.target.dataset.dragId];
values[event.target.dataset.dragId] = temp;
component.set("v.values", values);
event.preventDefault();
},
cancel: function(component, event, helper) {
event.preventDefault();
}
})