jquery table dnd 플러그인이 gridview - drop 이벤트에서 작동하지 않습니다.

asp.net (3.5)을 사용하고 있습니다. GridView가 있고 항목 (테이블 행)을 재정렬하고 db에 새로운 순서를 저장하기 위해 Drag & Drop을 사용해야합니다.jquery table dnd 플러그인이 gridview - drop 이벤트에서 작동하지 않습니다.

나는이 목적으로 jquery.tablednd 플러그인을 사용할 수 있다는 것을 알게되었다.

DnD 기능이 실제로 작동하지만 ON DROP이 절대로 작동하지 않기 때문에 항목을 재정렬하고 db로 저장할 수 없습니다.

웹에서 찾은 다른 예제를 복사하려고 시도했지만 ondrop이 절대로 작동하지 않습니다. 테스트 할 새 파일을 만들었습니다 (원래 페이지는 마스터 페이지를 사용합니다). ajaxToolkit : ToolkitScriptManager가 포함되어 있지만 asp : ScriptManager로 시도했습니다. DropAndDrag가 작동하지만 ON DROP 이벤트가 호출되지 않습니다. OnDragStart 이벤트가 성공적으로 호출됩니다.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="News.aspx.cs" Inherits="Tutelaconnect.News" %> 

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head id="Head1" runat="server"> 
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.js" type="text/javascript"></script> 
<script src="http://www.isocra.com/articles/jquery.tablednd.js" type="text/javascript"> 
</script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#<%= GridViewSample.ClientID %>").tableDnD({ 
      onDrop: function (table, row) { 
       alert('1');     ///// THIS NEVER HAPPEN 
      }, 
      onDragStart: function (table, row) { 
       // alert('2'); //// THIS HAPPENS 
      } 
     }); 
    });   
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"> 
</ajaxToolkit:ToolkitScriptManager> 
<div id="debugArea"> 
</div> 
<div class="tableDemo"> 
    <asp:GridView ID="GridViewSample" runat="server" AutoGenerateSelectButton="false" 
     AutoGenerateColumns="false" Width="800px"> 
     <Columns> 
      <asp:TemplateField HeaderText="C"> 
       <ItemTemplate> 
        <asp:TextBox ID="TextBoxC" runat="server" Text='<%# Eval("C") %>' Width="50px" /> 
       </ItemTemplate> 
       <HeaderStyle HorizontalAlign="Center" /> 
       <ItemStyle HorizontalAlign="Center" Width="10em" /> 
      </asp:TemplateField> 
      <asp:TemplateField HeaderText="A"> 
       <ItemTemplate> 
        <asp:Label ID="LabelA" runat="server" Text='<%# Eval("A") %>' /> 
       </ItemTemplate> 
       <HeaderStyle HorizontalAlign="Center" /> 
       <ItemStyle HorizontalAlign="Left" Width="30em" /> 
      </asp:TemplateField> 
     </Columns> 
    </asp:GridView> 
</div> 
</form> 
</body> 
</html>

정말 붙어 이니, 내 코드에 봐 하십시오. 계속하는 법을 모르십시오.

출처

2012-08-31 renathy

여기 해결책을 발견 :

var i = 0; 
$("#<%= GridViewSample.ClientID %>").find('tr').each(function() { 
    $(this).attr('id', i++); 
});

내가 바로 전에이 코드를 배치 : 기본적으로 http://www.isocra.com/2008/02/table-drag-and-drop-jquery-plugin/comment-page-15/#comment-3460

, 각 행 테이블에 그들에게 하나를주고,이 같은 코드를 사용할 수있는 ID를 필요 : $("#<%= GridViewSample.ClientID %>").tableDnD 그리고 내가 행을 떨어 뜨릴 때마다 alert(1); 상자가 표시 될 수있었습니다. JS에서 on drop의 트리거 기능이 정의되어 있는지 여부를 여부 파일에 대한

출처

2012-10-16 07:31:21

감사합니다. 이 맛있는 음식은 나를 도왔다. – Jeff

고마워, 내 엉덩이를 저장 :) –

봐 그런 다음 오류가 자리하고있는 곳 찾을 수있을 것입니다.

출처

2012-10-16 07:37:16 Raghurocks

jquery table dnd 플러그인이 gridview - drop 이벤트에서 작동하지 않습니다.

답변

관련 문제