Databases
StackOverflow2013
Postsdbo
POjquery table dnd plugin with gridview - on drop event never works
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjquery table dnd plugin with gridview - on drop event never works
    text
    copied!<p>I am using asp.net (3.5). I have GridView and I need to use Drag&amp;Drop for purpose to reorder items (table rows) and save new order to db. </p> <p>I have found out that I can use jquery.tablednd plugin for this purpose. </p> <p>DnD functionality really works for me, but I cannot reorder items and save in db, because ON DROP never works for me.</p> <p>I have tried to copy different examples I found in web, but ondrop never works for me. I have created new file to do tests (my original page uses masterpage). I have included ajaxToolkit:ToolkitScriptManager , but I have also tried it with asp:ScriptManager. DropAndDrag is working, but ON DROP event is never called. OnDragStart event is called successfully. Please, have a look to my code:</p> <pre><code>&lt;%@ Page Language="C#" AutoEventWireup="true" CodeBehind="News.aspx.cs" Inherits="Tutelaconnect.News" %&gt; &lt;%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head id="Head1" runat="server"&gt; &lt;script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="http://www.isocra.com/articles/jquery.tablednd.js" type="text/javascript"&gt; &lt;/script&gt; &lt;script type="text/javascript"&gt; $(document).ready(function () { $("#&lt;%= GridViewSample.ClientID %&gt;").tableDnD({ onDrop: function (table, row) { alert('1'); ///// THIS NEVER HAPPEN }, onDragStart: function (table, row) { // alert('2'); //// THIS HAPPENS } }); }); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;form id="form1" runat="server"&gt; &lt;ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"&gt; &lt;/ajaxToolkit:ToolkitScriptManager&gt; &lt;div id="debugArea"&gt; &lt;/div&gt; &lt;div class="tableDemo"&gt; &lt;asp:GridView ID="GridViewSample" runat="server" AutoGenerateSelectButton="false" AutoGenerateColumns="false" Width="800px"&gt; &lt;Columns&gt; &lt;asp:TemplateField HeaderText="C"&gt; &lt;ItemTemplate&gt; &lt;asp:TextBox ID="TextBoxC" runat="server" Text='&lt;%# Eval("C") %&gt;' Width="50px" /&gt; &lt;/ItemTemplate&gt; &lt;HeaderStyle HorizontalAlign="Center" /&gt; &lt;ItemStyle HorizontalAlign="Center" Width="10em" /&gt; &lt;/asp:TemplateField&gt; &lt;asp:TemplateField HeaderText="A"&gt; &lt;ItemTemplate&gt; &lt;asp:Label ID="LabelA" runat="server" Text='&lt;%# Eval("A") %&gt;' /&gt; &lt;/ItemTemplate&gt; &lt;HeaderStyle HorizontalAlign="Center" /&gt; &lt;ItemStyle HorizontalAlign="Left" Width="30em" /&gt; &lt;/asp:TemplateField&gt; &lt;/Columns&gt; &lt;/asp:GridView&gt; &lt;/div&gt; &lt;/form&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>I am really stuck. Do not know how to continue.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload