Ajax reorder list not dragable

Question

I have the same problem as Simon in this post.

He found out some sort of a solution, but it does not work for me. Please, could someone explain me what is going on in this answer or advice me something else.

PS: there is an example on the asp.net site which doesn't work exactly the same way as my reorder list... (click view a demo)

The solution that is suggested here adds these few lines to web.config:

<httpHandlers> 

  <add path="ScriptResource.axd" verb="GET,HEAD" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" validate="false"/> 

</httpHandlers> 

Perhaps I just need to change something to make it work... but I don't know what. For example I have no idea what the ScriptResource.axd is supposed to be.

My code: .aspx file

    <%@ Page Title="" Language="C#" MasterPageFile="~/editor/editor_template.Master" AutoEventWireup="true" CodeBehind="menuEditor.aspx.cs" Inherits="WebPageEditor.editor.menuEditor" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
    <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

    <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true">
</asp:ScriptManager>

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>

     <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" 
            DeleteMethod="DeleteMenu" InsertMethod="InsertMenu" SelectMethod="SelectMenu" 
            TypeName="WebPageEditor.editor.MenuSourceManager" UpdateMethod="UpdateMenu"
             >
            <DeleteParameters>
                <asp:Parameter Name="ID" Type="Int32" />
            </DeleteParameters>
            <InsertParameters>
                <asp:Parameter Name="name" Type="String" />
                <asp:Parameter Name="url" Type="String" />
                <asp:Parameter Name="order" Type="Int32" />
            </InsertParameters>
            <UpdateParameters>
                <asp:Parameter Name="ID" Type="Int32" />
                <asp:Parameter Name="name" Type="String" />
                <asp:Parameter Name="url" Type="String" />
                <asp:Parameter Name="order" Type="Int32" />
            </UpdateParameters>            
        </asp:ObjectDataSource>

        <asp:ReorderList ID="ReorderList1" runat="server" AllowReorder="True" 
            DataSourceID="ObjectDataSource1" PostBackOnReorder="False" 
            ShowInsertItem="True"       SortOrderField="order" DataKeyField="ID" 
            ItemInsertLocation="Beginning">

            <ItemTemplate>
            <div class="menuEditor">
            &raquo;   <%# Eval("name") %>  
            <asp:LinkButton ID="LinkButton1" runat="server" CommandName="Edit">LinkButton</asp:LinkButton>
            </div>               
            </ItemTemplate>

            <DragHandleTemplate>
                <img src="ico/moveHandle_ico.gif" 
                alt='<asp:Literal ID="Literal1" runat="server" Text="<%$ Resources: editorLocalization, ME_moveHandleTT %>" />'
                style="cursor:move; width:35px;" />
            </DragHandleTemplate>
            <ReorderTemplate>
            <asp:Panel runat="server" />

            </ReorderTemplate>

            <InsertItemTemplate>
                <asp:Panel ID="panel1" runat="server" DefaultButton="Button1">
                                  <asp:TextBox ID="TextBox1" runat="server" Text=' <%# Bind("name") %>' ValidationGroup="add" />
                                    <asp:Button ID="Button1" runat="server" CommandName="Insert" Text="Add"  ValidationGroup="add" />
                                   <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ValidationGroup="add"
                                        ErrorMessage="Please enter some text" ControlToValidate="TextBox1" />
                                </asp:Panel>
            </InsertItemTemplate>

            <EditItemTemplate>
            <asp:TextBox ID="TextBox2" runat="server" Text='<%# Bind("name") %>' ValidationGroup="edit" />
                <asp:TextBox ID="TextBox3" runat="server" Text='<%# Bind("url") %>' ValidationGroup="edit" />
                     <asp:TextBox ID="TextBox4" runat="server" Text='<%# Bind("order") %>' ValidationGroup="edit" />
                  <asp:LinkButton ID="LinkButton1" runat="server" CommandName="Update">LinkButton</asp:LinkButton>

            </EditItemTemplate>

        </asp:ReorderList>        



    </ContentTemplate>
    </asp:UpdatePanel>




</asp:Content>

and the code behind

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;

namespace WebPageEditor.editor
{

    public class MenuSourceManager 
    {
        public static List<MenuItem> menuItems;  

        #region DataBindMethods
        //[System.ComponentModel.DataObjectMethod(System.ComponentModel.DataObjectMethodType.Select)]
        public List<MenuItem> SelectMenu()
        {            
            return menuItems;  
        }

        public void UpdateMenu(int ID, string name, string url, int order)
        {
            menuItems[ID].Name = name;
            menuItems[ID].Url = url;
            menuItems[ID].Order = order;            
        }

        public void InsertMenu(string name, string url, int order)
        {
            menuItems.Add(new MenuItem(name, url, order, menuItems.Count));
        }

        public void DeleteMenu(int ID)
        {
            menuItems.RemoveAt(ID);
        } 
        #endregion  
    }

    public class MenuItem
    {
        public MenuItem(string name, string url, int order, int ID)
        {
            Name = name; Url = url; Order = order; this.ID = ID;
        }

        public string Name { get; set; }
        public string Url { get; set; }
        public int Order { get; set; }
        public int ID { get; set; }
    }
}

I load the data to the List collection from the page_load event but that works fine. The data binding works as well. The problem is in that the items cannot be reordered -- during the reordering, the sort value doesn't change and the list doesn't update.

Answer 1

I decided to not rely on the Microsoft and waste my time trying to adjust this control and, of course, to make it work at first.

So I created the control myself. It has some weak points (for example it works completely just in IE under compatibility view or in later versions) and compared to the Ajax control it is certainly less flexible but for me it is perfectly enough.

For those curious about the result, here is a little demonstration: http://machta.aspone.cz/editor/menuEditor.aspx

user name: machta

password: 123456

The changes are saved after you leave the page (or after you reload it). You can see the result here: http://machta.aspone.cz/editor/src/home.aspx

Answer 2

Add this event with your reorder list tag

OnItemReorder="ReorderList1_ItemReorder"

Now on code behind add this code:

protected void ReorderList1_ItemReorder(object sender, AjaxControlToolkit.ReorderListItemReorderEventArgs e)
        {
//write your logic here to sort order change.
}