-1

Can any one have code for drag and drop for visualforce if yes then please help .

0
7

Here's a simple drag-drop example written in pure Visualforce:

<apex:page controller="DragDrop">
  <script>
    var dragStartId;
    function cancel(event) {
      event.preventDefault();
    }
    function dragstart(event) {
      dragStartId = event.target.dataset.rowid;
    }
    function drop(event) {
      reorderitems(dragStartId, event.target.dataset.rowid);
    }
  </script>
  <apex:form id="form">
    <apex:actionFunction name="reorderitems" reRender="form" action="{!reorder}">
      <apex:param name="dragStart" assignTo="{!dragStartId}" value="" />
      <apex:param name="dragEnd" assignTo="{!dragEndId}" value="" />
    </apex:actionFunction>
    <div ondragover="cancel(event)" ondragenter="cancel(event)" ondrop="drop(event)">
    <apex:repeat value="{!items}" var="item">
      <div data-rowid="{!item.index}" draggable="true" ondragstart="dragstart(event)" >
        {!item.Name}
      </div>
    </apex:repeat>
    </div>
  </apex:form>
</apex:page>

public class DragDrop {
    public Integer dragStartId { get; set; }
    public Integer dragEndId { get; set; }

    public Item[] items { get; set; }

    public class Item {
        public Item(String theName, Integer theIndex) {
            Name = theName;
            index = theIndex;
        }
        public String Name { get; set; }
        public Integer index { get; set; }
    }

    public DragDrop() {
        items = new Item[0];
        while(items.size() < 5) {
            items.add(new Item('Value '+items.size(), items.size()));
        }
    }

    public void reorder() {
        Item temp = items[dragStartId];
        items[dragStartId] = items[dragEndId];
        items[dragEndId] = temp;
    }
}
1
  • Hardly pure Visualforce when it's got Apex and Javascript as well?
    – Adrian Larson
    Mar 8 '17 at 13:41

Not the answer you're looking for? Browse other questions tagged or ask your own question.