Tagged: Ajax Control Toolkit

How to bind Reorder List to an object data source

The reorderlist is part of the Ajax Control toolkit which provides us with a  databound list control which can be reordered interactively. The reorder list can be bound to any datasource that implements the IList interface. Below is a sample code to use the reorder list bound to an object data source


<cc1:ReorderList runat="server"

    DataSourceID="ObjectDataSource2"

    DragHandleAlignment="Left"

    ItemInsertLocation="Beginning"

    DataKeyField="Id"

    SortOrderField="Position"

    AllowReorder="true"

    CallbackCssStyle="callbackStyle">

      <ItemTemplate>
<div>

              <asp:Label Text='<%# Eval("Name") %>' runat="server"  />

         </div>
</ItemTemplate>

      <ReorderTemplate>

                            <asp:Panel runat="server" CssClass="reorderCue" />

                        </ReorderTemplate>

                        <DragHandleTemplate>

                           
<div></div>
                        </DragHandleTemplate>

</cc1:ReorderList>

<asp:ObjectDataSource runat="server" SelectMethod="GetList"

        TypeName="BusinessLayer" OldValuesParameterFormatString="original_{0}"

        UpdateMethod="SaveList">

        <UpdateParameters> 
         <asp:Parameter Name="Original_Id" Type="Int32" />
	<asp:Parameter Name="Position" Type="Int32" />
        </UpdateParameters>

    </asp:ObjectDataSource>

 

Once you have your get and update methods defined you are good to go.

 Many of you might have encountered a generic “faliled to reorder” error message while trying to save the reorder list. The main reason for this error is the way the reorder list builds the parameter dictionary for the update method. The reorderlist uses “TypeDescriptor.Getproperties(row)” which results in a parameter for each property of the custom data object to which you are binding. To work around this it would be advisable to create a datatable with only the required fields to display and update the data (See our earlier post on converting a generic list to a datatable). In our example the required fields to display are Id, Name and Position (Case sensitive). For update we would require only the Id and Position. Since our reorderlist will include “Name” also in the parameter dictionary please see that your update method includes the “Name” field  in its signature.

 


public bool SaveList(int Original_Id,int Position, string Name)
{ }

 public DataTable GetList()
{
 List<Category> lst=GetCategories();
 //convert this lst to a datatable with just the required columns             
}

That’s it. Your reorderlist is ready.