Drag and Drop - C1 ASP.NET MVC

// This file locates: "Scripts/Lesson/C1FlexGrid/EventsDragDrop.js".
c1.documentReady(function () {
    var theGrid = wijmo.Control.getControl('#theGrid');
 
    // allow dragging from the grid
    makeDragSource(theGrid);
 
    // allow dropping into target
    var theTarget = document.getElementById('theTarget');
    makeDropTarget(theTarget);
 
    // make grid rows draggable
    function makeDragSource(s) {
 
        // make rows draggable
        s.itemFormatter = function (panel, r, c, cell) {
            if (panel.cellType == wijmo.grid.CellType.RowHeader) {
                cell.textContent = (r + 1).toString();
                cell.draggable = true;
            }
        };
 
        // disable built-in row drag/drop
        s.hostElement.addEventListener('mousedown', function (e) {
            if (s.hitTest(e).cellType == wijmo.grid.CellType.RowHeader) {
                e.stopPropagation();
            };
        }, true);
 
        // handle drag start
        s.hostElement.addEventListener('dragstart', function (e) {
            var ht = s.hitTest(e);
            if (ht.cellType == wijmo.grid.CellType.RowHeader) {
                s.select(new wijmo.grid.CellRange(ht.row, 0, ht.row, s.columns.length - 1));
                e.dataTransfer.effectAllowed = 'copy';
                e.dataTransfer.setData('text', ht.row.toString());
            };
        }, true);
    }
 
    // enable drop operations on an element
    function makeDropTarget(s) {
        s.addEventListener('dragover', function (e) {
            var dragRow = e.dataTransfer.getData('text');
            if (dragRow != null) {
                e.dataTransfer.dropEffect = 'copy';
                e.preventDefault();
            }
        });
        s.addEventListener('drop', function (e) {
            var dragRow = e.dataTransfer.getData('text');
            if (dragRow != null) {
                var item = theGrid.rows[parseInt(dragRow)].dataItem;
                alert('thanks for dropping row ' +
                    JSON.stringify(item) +
                  ' here.');
            }
        });
    }
 
});

using System.Web.Mvc;
 
namespace LearnMvcClient.Controllers
{
    public partial class C1FlexGridController : Controller
    {
        // GET: EventsDragDrop
        public ActionResult EventsDragDrop()
        {
            return View(Models.FlexGridData.GetSales());
        }
    }
}

@model IEnumerable<FlexGridData.Sale>
 
<h1>
    @Html.Raw(Resources.C1FlexGrid.EventsDragDrop_Title)
</h1>
<p>
    @Html.Raw(Resources.C1FlexGrid.EventsDragDrop_Text1)
</p>
<p>
    @Html.Raw(Resources.C1FlexGrid.EventsDragDrop_Text2)
</p>
 
<p>
    @Html.Raw(Resources.C1FlexGrid.EventsDragDrop_Text3)
</p>
@Html.C1().FlexGrid().Id("theGrid").Bind(Model).Height(250)
 
<p>
    @Html.Raw(Resources.C1FlexGrid.EventsDragDrop_Text4)
</p>
<div id="theTarget" style="height:100px;background-color:#e0e0e0">
    @Html.Raw(Resources.C1FlexGrid.EventsDragDrop_Text5)
</div>

Dragging Rows from the FlexGrid