c# - AjaxControlToolkit ReorderList 不起作用

Question

我需要使用拖放控件来对列表进行排序。我想通过 AjaxControlToolkit 中的 ReorderList 控件来实现这一点。我已经尝试了一切让它工作，但它不会。一切顺利，比如列表的填充等。但是我不能像应该使用的那样使用这个控件。加载页面时，它会显示一个列表，左侧有一个 reordergrip，但是当我尝试拖动一个项目时，它不会拖动。它只是留在原地。我也尝试过其他浏览器，如 IE9 和 Firefox。有人可以帮我解决这个问题吗？我在 Visual Studio 2010 中使用 ASP.NET/C#。

提前致谢!

ASPX:

    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
        <div class="ajaxOrderedList">
            <asp:ReorderList runat="server" DataSourceID="SqlDataSource1" ID="rlData" PostBackOnReorder="true" DragHandleAlignment="Left" ItemInsertLocation="Beginning" SortOrderField="Naam" AllowReorder="true">
                <DragHandleTemplate> 
                    <asp:Panel ID="dragHandle" runat="server" 
                        style="height: 20px; width: 20px; border: solid 1px black; background-color: Red; cursor: pointer;" 
                        Visible="<%# ShowDragHandle %>">
                        &nbsp;
                    </asp:Panel>
                    </DragHandleTemplate> 
                <ItemTemplate>
                    <div class="itemArea"> 
                        <asp:Label ID="lblNaam" runat="server" Text='<%#  HttpUtility.HtmlEncode(Convert.ToString(Eval("Naam")))  %>' />
                        <asp:Label ID="lblFunctie" runat="server" Text='<%#  HttpUtility.HtmlEncode(Convert.ToString(Eval("Functie")))  %>' />
                    </div>
                </ItemTemplate>
                <ReorderTemplate>
                    <div style="width: 300px; height: 20px; border: dotted 2px black;">
                        &nbsp;
                    </div>
                </ReorderTemplate>
            </asp:ReorderList>
            </div>
        </ContentTemplate>
    </asp:UpdatePanel>
    <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
    ConnectionString="<%$ ConnectionStrings:testdataConnectionString %>" 
    SelectCommand="SELECT [id], [naam], [functie] FROM [personen]" DeleteCommand="DELETE FROM [personen] WHERE [id] = @intID"
                InsertCommand="INSERT INTO [personen] ([naam], [functie]) VALUES (@strNaam, @strFunctie)"
                UpdateCommand="UPDATE [personen] SET [naam] = @strNaam, [functie] = @strFunctie WHERE [id] = @intID">
                <DeleteParameters>
                <asp:Parameter Name="intID" Type="Int32" />
            </DeleteParameters>
            <UpdateParameters>
                <asp:Parameter Name="strNaam" Type="String" />
                <asp:Parameter Name="srtFunctie" Type="String" />
                <asp:Parameter Name="intID" Type="Int32" />
            </UpdateParameters>
            <InsertParameters>
                <asp:Parameter Name="strNaam" Type="String" />
                <asp:Parameter Name="srtFunctie" Type="String" />
            </InsertParameters>
</asp:SqlDataSource>

代码隐藏:

DataView MyDView = null; 

        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                ShowDragHandle = true;
            }
        }

        protected void ReorderList1_ItemReorder(object sender, ReorderListItemReorderEventArgs e)
        {
            ShowDragHandle = true;
        }

        protected Boolean ShowDragHandle { get; set; }


        protected void Page_PreInit(object sender, EventArgs e)
        {
            //set theme
            this.Theme = "ServiceSuite";
        }

无法正常工作的 Reorderlist 图像(这是我尝试拖动项目时得到的结果!):

Answer 1

尝试将其添加到您的重新订购列表属性中

ClientIDMode="AutoID"