function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Pradeep Kumar 213Pradeep Kumar 213 

drag and drop in lightning using javascript

  Can anyone help me in getting the drag and drop work in lightning app? I have put div elements withing which I have image elements. I am able to drag and drop the image. But what I want is when I drag and drop one image on other, those two images should get swapped. I have written the javascript code to make work. But I am getting Error as Access Denied.
<div ondrop="{!c.drop}" ondragover="{!c.allowDrop}" id="{!v.appItem.label+'div'}">
<p ondragstart="{!c.drag}" draggable="true" id="{!v.appItem.label}">
<img src="{!v.appItem.logoURL}"  alt="{!v.appItem.altText}" id="{!v.appItem.label+'img'}"/>
"drag": function(cmp, event, helper){
        var source_paraid = document.getElementById(;
        var sourceHTML = document.getElementById(source_paraid).parentElement.innerHTML;
        var source_divid = document.getElementById(source_paraid);
        event.dataTransfer.setData("html", sourceHTML);
        event.dataTransfer.setData("divid", source_divid);
    "allowDrop": function(cmp, event, helper){
    "drop": function(cmp, event, helper){
    var sourceDivId = event.dataTransfer.getData("divid");
    var target_paraid = document.getElementById(;
    var targetDivId = document.getElementById(target_paraid);
    var targetObj = document.getElementById(target_paraid);
    var sourceObj = document.getElementById(sourceDivId).children;

I am getting that error when I use appendChild method.Error

Please help me out. 

Thanks in advance