RadListBox - Issue with Items moving from Destination to Source ListBox

[vishnu]

Hello Team,

I have an issue with sorting the Items in the RadListBox. When i try to move the Items from Source List box to the destination box, everything here works fine. But when i move the selected Items from the Destination Box to the Source Box, the items that has been moved, falls at the bottom of the box. Instead this should be at the top of the box. How can i fix this..? Please help me with some ideas. 

 

The First images describes the Items that has been selected and to be moved in the Destination Box.
The Second image has the items moved successfully to the destination box.
The Third image describes that the items has been moved to source box , but items moved to the bottom , instead it has to be at the top of the box

 

<telerik:RadListBox RenderMode="Lightweight" runat="server" SelectionMode="Multiple" ID="lstSysPrin" Height="200px" Width="200px"
                                            AllowTransfer="true" TransferToID="lstSysPrinDestination" Sort="Ascending" 
                                            ButtonSettings-AreaWidth="35px">
  </telerik:RadListBox>
 <telerik:RadListBox RenderMode="Lightweight" runat="server" ID="lstSysPrinDestination" SelectionMode="Multiple" Height="200px" Width="160px"
                                            ButtonSettings-AreaWidth="35px">
 </telerik:RadListBox>

[Vessy]

Hi vishnu,

By design RadListView adds the transferred items at the end of its current item collection (they are considered as newly added items).

You can change this behavior by overwriting the private _inserItem function for the source ListView. You can do that by adding the script below just before the closing </form> tag:

    <telerik:RadScriptBlock runat="server">
        <script>
            Telerik.Web.UI.RadListBox.prototype._insertItem = function (item) {
                this._persisted(function (listBox) {
                    if (listBox.get_id() == $find("<%=lstSysPrin.ClientID%>").get_id()) {
                        listBox.get_items().insert(0, item);
                    }
                    else {
                        //use the default logic of the ListBox in other cases:
                        listBox.get_items().add(item);
                    }
                });
            }
        </script>
    </telerik:RadScriptBlock>

Regards,
Vessy
Progress Telerik

[vishnu]

Hello Vessy, 
Thank you so much for the help, this idea helped me .While looking into this result, i have another question that popped up.
 Say example, if i have selected items randomly and moved it into the destination box. I changed my mind and i wanted to put those items back into the same place it was earlier...!! How can i achieve that..?

[Vessy]

Hi vishnu,

In order to achieve that you will need to implement your custom logic storing the previous indexes of the different files. You can store the previous index of the items in the OnClientTransferring event, but inserting them in exactly the same position will be hard to achieve.

To illustrate my thought, if you have the items:
item 1
item 2
item 3
item 4

and then you move item 2 (index 1) and item 3(index 2), when you decide to bring back the item 3 at the remaining [item 1; item 4] list, its index 2 will add it at the end, but not between item 1 and item 4.

Regards,
Vessy
Progress Telerik

[vishnu]

Thank you Team

[Vessy]

Hi,

You are welcome, vishnu! :)

Regards,
Vessy
Progress Telerik