[How Do I:] The AJAX Toolkit Reorder Control

Please install Silverlight or click download to watch video locally.

In this video I will demonstrate the use of the reorder control that ships with the AJAX toolkit. The reorder control lets you present to your users a list of data items that can be reordered as the user prefers.

Presented by Joe Stagner

Duration: 21 minutes, 56 seconds

Date: 21 February 2008

Watch    Video   |   Download    Video   |   VB Code    C# Code

Video downloads: WMV  |  Zune  |  iPod  |  PSP  |  MPEG-4  |  3GP

Audio downloads: AAC  |  WMA  |  MPEG-4  |  MPEG-3  |  MPEG-2

Comments : 16

Leave a Comment

The_ASP_KID : On May 12, 2008 1:20 PM said:

Anyone know of a how-to when the user reorders the list, that list order is saved in the DB

Wardgp : On June 16, 2008 4:26 PM said:

Given that a postback will reset the order of the list just exactly is the usefulness of this control?  This could be a major source of user frustration.

richileung : On July 22, 2008 10:31 AM said:

I use CommandName="edit" on a link button but it doesn't trigger edit event but an insert instead :( Any ideas?

fxjamy : On July 25, 2008 2:35 PM said:

i noticed tht too, on postback everything is set back as it was.. and is it possible to save the order in db and id we want to delete any of d item ..  ? ??

anybody ???

Super ASP : On July 30, 2008 9:21 PM said:

I noticed that it does reorder the Priority in the DB and so I just added  ORDER BY PRIORITY to the end of my select statment and now it works Great.  Also richileung you can use CommandName="Edit" but be sure you are using it in the <ItemTemplate>. Hope this helps

ashwinee : On July 31, 2008 1:54 AM said:

A very good idea 'Super ASP' :)

But i dint understand what is the use of the following attribute?

ItemInsertLocation="Beginning"

(bcz if v dont do order by in select stmt then items are inserted at the end)

Please clarify

Super ASP : On August 01, 2008 2:58 PM said:

If ItemInsertLocation="Beginning", then a new entry will get inserted at the beginning of the list. The Reorder Control will assign the new record a priority that is smaller then any other in the list.  

So if the items in your list have a priority from 0-4 then it will assign a -1

If ItemInsertLocation is set to “End” the new entry in placed at the end of the list with a Priority greater the any in the list.

So if the items in your list have a priority from 0-4 then it will assign a 5

cv_vikram : On August 07, 2008 3:59 PM said:

Very good tutorial..thanks

pnv.ravikiran : On August 07, 2008 10:31 PM said:

a nice helpful video...

tuhina213 : On November 17, 2008 1:33 PM said:

Can I use Reorder List without using a SQLDataSource or ObjectDataSource? I want to bind the data in my code behind. How do I update the Ranking programatically and in which event do I do this?

Please help.

JimmyS : On January 30, 2009 4:35 AM said:

After being frustrated with trying to find a solution in vb with a sqldatasource in order to save the reordered list, I figured it out and is pretty straight forward. Here is how to do it in codebehind (for this example you must have the Reorder List AutoPostback="true"). This is all done from the ItemReorder event.  This may seem long but is not bad. My example uses an extra field in the database for client ID since each client has their own.

   Protected Sub ReorderList1_ItemReorder(ByVal sender As Object, ByVal e As AjaxControlToolkit.ReorderListItemReorderEventArgs) Handles ReorderList1.ItemReorder

       'get Old Priority

       Dim oldI As Integer = e.OldIndex

       'get New Priority

       Dim newI As Integer = e.NewIndex

       'get the selected Item Value

       Dim selectedDK As String = ReorderList1.DataKeys(oldI).ToString()

       Dim i2updateList As String = ""

       'Build update list based on everything after/equal to the new priority but not equal to the selected one and in order so they can be updated in order

       Using oConn As SqlConnection = New SqlConnection(ConfigurationManager.ConnectionStrings("ibmas terConnectionString").ConnectionString)

           Dim sqlCmd As New SqlCommand("select id from client_todolist where id <> '" & selectedDK & "' and client_id='111193' and priority >= '" & newI & "' order by priority asc", oConn)

           oConn.Open()

           Using reader As SqlDataReader = sqlCmd.ExecuteReader()

               While reader.Read()

                   If i2updateList = "" Then

                       i2updateList = reader("id").ToString

                   Else

                       i2updateList &= "," & reader("id").ToString()

                   End If

               End While

           End Using

       End Using

       Dim newPriority As Integer = newI

       Dim rolArr As String()

       rolArr = i2updateList.Split(",")

       'update each from the list by 1

       For Each x In rolArr

           newPriority = newPriority + 1

           Using myConnection As SqlConnection = New SqlConnection(ConfigurationManager.ConnectionStrings("ibmas terConnectionString").ConnectionString)

               myConnection.Open()

               Dim myCommand As SqlCommand = New SqlCommand("update client_todolist set priority = '" & newPriority & "' where id='" & x & "'", myConnection)

               myCommand.ExecuteNonQuery()

           End Using

           newPriority = newPriority

       Next

       'finally, update the selected one for its changed priority

       Using myConnection As SqlConnection = New SqlConnection(ConfigurationManager.ConnectionStrings("ibmas terConnectionString").ConnectionString)

           myConnection.Open()

           Dim myCommand As SqlCommand = New SqlCommand("update client_todolist set priority = '" & newI.ToString() & "' where id='" & selectedDK & "'", myConnection)

           myCommand.ExecuteNonQuery()

       End Using

   End Sub

uswebpro : On February 01, 2009 3:28 PM said:

I agree with the top 2 comments. This video is great - but too basic. A video on how to handle updates would be nice.

Reinaldo Ferreira : On March 02, 2009 1:06 PM said:

when I use the reorder list inside of modal dialog, the rectangle on reorderCue doesnt show the text inside while moving it.

haithemara : On May 03, 2009 7:25 AM said:

good video . Thank you Joe. I have noticed that some field such as RepeatItemCount is disabled in this control. Does anyone know how to enabled them. Also, did anyone know how to display the items in horizontal way.

Thanks

jberda : On July 29, 2009 2:50 PM said:

I have a parent page of items that allows you to navigate to an item detail page. It passes the itemID to the item detail page which uses the ID in its page_load event to modify a reorderlist's select command.

The parent item page originally used Server.Transfer to navigate to the item detail page. The reorderlist would not reorder until a postback occurred. Then I changed the parent item page to Response.Redirect to the item detail and everything worked as I originally hoped it would.

Westnyorai : On September 15, 2009 1:32 AM said:

A heads up to anyone who wants to use this with XML or any non database solution. You need to create a custom class with properties then add several of the class objects to an ilist(of yourCustomClass) and bind it to the reorderlist.

Once you do that you simply class the values using the property name in place of the column name. To save the results you'll have to cycle through all of the reorderlistitem objects using a foreach loop. The trick to this is, you can't recall the property, instead you'll have to cheat a little by storing the values inside a hiddenvalue/textbox and using findcontrol to recapture the values and store them back into the xml file.

Hopefully this put you on the right track instead of having to waste a few hours figuring it out.

Leave a Comment

You must be logged in to leave a comment. Click here to log in.

Microsoft Communities