Friday, September 9, 2016

Moving rows up and down with reordering using a list view where each row could have multiple items assigned to it.

You display a list of data in an organized way using a list view. Everything looks good and you are a happy camper until the request comes in: "I want to be able to move these items up and down on this list as I please,  just with the power of my brain waves...".  I am still working on the brain waves stuff but lets analyzed the below list:



Let's say we need to swap two items on our list. Item with step number 3 will take  item with step number 2 place and step number also. And of course vice-versa. There are other scenarios such as deleting and item or even "cloning" (creating another item from an existing item)  which I don't discuss on this post but which can be addressed with the same approach.
First of all, we need to select the item which will be moved. Once the item is selected, we then give the user the ability to move the item up or down, depending on the item current location. Of course we could not move and item down if the current location was the bottom already.
I have a private method called SetSelectedControls(). In this method, I make certain controls either available or disabled for certain rows, dependent on the rows location and selection. A slimmed down version for reference:

Once an item is selected, I use the button event to get the necessary data  and thus proceed with the operation to swap the items. Both buttons events call the same method passing  the step number and the direction we need to move the item as parameters.


FYI: I use a data table to save my list items into session. You have to keep in mind that this scenario worked great for this situation due to the limited number of records this application will deal with but this is something to consider if your application will be dealing with a lot of records.


If we were  only to swap the rows and their steps, life would be so much easier but for this request though, each step could have multiple products assigned to it and to make the boss happy we will have to swap those too. Products are saved in a different table and we can reference them by step.   Here is the reorder table method:

       

Once we save the data table to session with the new order,we can just rebind the list and if needed keep the same step that was selected  before selected now in the new position on the list.


The same approach can be used when an item is deleted but in this situation we will have to deal with moving all the steps that were above the deleted item down one step but it should not be any problem , right?




No comments:

Post a Comment