This is a migrated thread and some comments may be shown as answers.

Sorting content Listbox

29 Answers 542 Views
ListBox
This is a migrated thread and some comments may be shown as answers.
Roberth Dudiver
Top achievements
Rank 1
Roberth Dudiver asked on 09 Jul 2009, 04:08 PM
Translate this good day because I speak Spanish, with new controls telerick 
I have to move the contents of a ListBox to another, that the problem is simple this 
they need you to move from ListBoxal listbox2 sorting for this content 
name, any idea how to do
Español

Buen día traduzco esto pues hablo español, trabajo con los controles telerick nuevos tengo que pasar el contenido de un ListBox a otro , eso es sencillo el problema esta en que necesito que al pasar del ListBoxal listbox2 este contenido se ordene por nombre, alguna idea de como hacerlo ??
Thanks

29 Answers, 1 is accepted

Sort by
0
Genady Sergeev
Telerik team
answered on 10 Jul 2009, 12:04 PM
Hello Roberth Dudiver,

RadListBox provides integrated sorting mechanism, there is a property Sort that accepts an enumeration value: RadListBoxSort. The correct way to do an ascending sort is:

 
RadListBox1.Sort = RadListBoxSort.Ascending; 
RadListBox1.SortItems(); 


Sincerely yours,
Genady Sergeev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
vbl vbl
Top achievements
Rank 1
answered on 24 Jul 2009, 05:33 AM
Is there client side sorting? I could not find anything in the docs.

Thanks,
vbl
0
Michael Arocho
Top achievements
Rank 2
answered on 15 Sep 2009, 08:44 PM
I am in the same situation.  I need the ability to refresh the sort on the client after performing a client transfer.  Is there any way to tell the control to refresh its sort?
0
Genady Sergeev
Telerik team
answered on 18 Sep 2009, 08:33 AM
Hello guys,

There is no integrated client side sorting, because this would bring several complications if it were used on a databound RadListBox. However, in the specific case of transferring items, you don't really need a client side sort. The only thing you need is to cancel the transferring event and to manually insert the items being transferred to the correct position


All the best,
Genady Sergeev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
vbl vbl
Top achievements
Rank 1
answered on 18 Sep 2009, 10:05 AM
Neraly 2 months come on guys you are falling behind. Or do you just not like me any more?

I ended up using a bubble sort
0
Simon
Telerik team
answered on 18 Sep 2009, 12:25 PM
Hi all,

As Mr. Sergeev already mentioned, introducing an integrated sorting support will create unnecessary complications to RadListBox and this is something we would like to avoid.

In any case, in response to your interest, the next week we will publish a KB article which will show how to preserve the order of two sorted ListBoxes between Transfer operations at the client-side.

We will follow up in this thread once the KB is out to notify you.

Greetings,
Simon
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Jason
Top achievements
Rank 1
answered on 07 Oct 2009, 11:58 AM
I also think client side sorting should be in the library.  Its been well over a week and no link has been posted.  Please remember to do this.

Integrated databinding seems like something only newb programmers will take advantage of.  Anyone with a clue and a product being used outside of your own company is going to want more control than this. To make sure RadControls doesn't become a watered down version of a library for newbs, you should provide some accompanying support libraries that only work on certain parameters of the control or whatever you need to make the additional functionality work (and really quite basic functionality to anyone who is going to use this control).  One related problem I have is that I want to be able to move items between two lists and always keep them in sorted order. This doesn't necessarily even need to ever sort them on the client side because they are already in order, it just needs to keep them in the same order they were originally in. Maybe you can at least make that work. Right now it just adds them to the end of the list which would then require sorting.
0
Genady Sergeev
Telerik team
answered on 14 Oct 2009, 01:54 PM
Hi guys.

We have recently been very busy working on the upcoming Q3 Beta release. Therefore, the KB is on the queue. We are sorry for the inconvenience, as soon as the beta is out we will prepare the KB article that we have promised. The release of the Q3 beta is scheduled for tomorrow.


Sincerely yours,
Genady Sergeev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Genady Sergeev
Telerik team
answered on 21 Oct 2009, 02:26 PM
Hi guys,

I am happy to announce that we have managed to fix the bug. You can verify that on the latest internal build.

Sincerely yours,
Genady Sergeev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Mark Galbreath
Top achievements
Rank 2
answered on 17 Nov 2009, 12:23 PM
Just decent API documentation would help....
0
Wendy Hunt
Top achievements
Rank 2
answered on 31 Dec 2009, 06:01 PM
I am using Version 2009.3.1103
I am a newbie when it comes to programming.  I have the following code in my PopulateLIstBoxes() :
        IQueryable allRenewableResources = RenewableSource.GetAllBindings();  
        this.renewableSourceRadListBox.DataSource = allRenewableResources;  
        this.renewableSourceRadListBox.DataValueField = "ID";  
        this.renewableSourceRadListBox.DataTextField = "Name";  
        this.renewableSourceRadListBox.DataBind();  
        this.renewableSourceRadListBox.Sort = RadListBoxSort.Ascending;  
        this.renewableSourceRadListBox.SortItems(); 

I would also like to have the left side re-sort after moving data from left to right and back again.  Is there a way for me to do this?

Thanks!!
wen  :)
0
Genady Sergeev
Telerik team
answered on 04 Jan 2010, 05:20 PM
Hello Wendy Hunt,

Your code is correct.

If you want to sort the listboxes after items are transferred hook on the OnTransferred event of the listbox that you want to sort and use the following code:

RadListBox1.Sort = RadListBoxSort.Ascending; 
RadListBox1.SortItems();


Greetings,
Genady Sergeev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Wendy Hunt
Top achievements
Rank 2
answered on 04 Jan 2010, 05:37 PM
Hi Genady -

Thanks for your response.  What do you mean by "hook on the OnTransferred event"?  I see an OnClientTransferred property, but it has no True/False selection.  What would I place in the property? 

Thanks!!  :)
wen
0
Mark Galbreath
Top achievements
Rank 2
answered on 05 Jan 2010, 01:25 PM

Hey Wen,

That's because Genady is using server-side methods and properties and you are looking at client-side methods.  Assuming you are using Visual Studio 2005+, go into your code-behind, select your radListBox from the left dropdownlist, then look at the methods available in the right dropdownlist.  You will find the OnTransferred event listed.  Select it and VS will insert the event handler method (Sub if Visual Basic) where you would use the code Genady recommended.

Things like this should be made clear in documentation, but Telerik is rewriting the docs right now.

 

Cheers!

Mark

0
Wendy Hunt
Top achievements
Rank 2
answered on 06 Jan 2010, 06:52 PM
I don't think the OnTransferred is what I'm looking for.  More like the OnInserted.  Here is my aspx:
       <asp:Label ID="Label11" runat="server" Text="Locations:" 
          style="z-index:1; position:absolute; top:300px; left:67px; text-align: right;"></asp:Label> 
          
        <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server"   
          style="z-index:1; position:absolute; top:300px; left:150px; height: 78px; width: 75px;">  
            
          <telerik:RadListBox ID="locationsRadListBox" runat="server" Height="125px"   
            Width="150px" AllowTransfer="true"  OnInserted="locationsRadListBox_OnInserted" 
            TransferToID="RadListBoxDestination" DataSortField="Name" DataTextField="Name"   
            DataValueField="Name" AutoPostBack="False" Skin="WebBlue" >   
          </telerik:RadListBox> 
        </telerik:RadAjaxPanel>    
        <telerik:RadListBox runat="server" ID="RadListBoxDestination" Height="125px" Width="100px" 
          style="z-index:1; position:absolute; top:300px; left:300px;"  /> 
          
        <asp:Label ID="Label12" runat="server" Text="Renewable Source:" 
          style="z-index:1; position:absolute; top:432px; left:13px; width: 127px; text-align: right;"></asp:Label> 
          
        <telerik:RadAjaxPanel ID="RadAjaxPanel2" runat="server"   
            
          style="z-index:1; position:absolute; top:432px; left:150px; height: 78px; width: 75px;"   
          EnableTheming="True">  
          
          <telerik:RadListBox ID="renewableSourceRadListBox" runat="server" Height="125px"   
            Width="150px" DataSortField="Name"    
            DataTextField="Name" DataValueField="Name" AllowTransfer="true" TransferToID="RadListDestination2" 
             Skin="WebBlue" onclienttransferred="true">  
          </telerik:RadListBox> 
        </telerik:RadAjaxPanel> 
        <telerik:RadListBox runat="server" ID="RadListDestination2" Height="125px" Width="100px" 
          style="z-index:1; position:absolute; top:432px; left:300px;"  /> 

Here is my behind code for the event:
      protected void locationsRadListBox_OnInserted(object sender, RadListBoxInsertingEventArgs e)  
      {  
        this.locationsRadListBox.Sort = RadListBoxSort.Ascending;  
        this.locationsRadListBox.SortItems();  
      } 

I want the list to be sorted when the data is inserted back into the listbox from the destination box.
My event for OnInserted isn't being fired at all for some reason.
Any Ideas ?

wen







0
Genady Sergeev
Telerik team
answered on 07 Jan 2010, 01:51 PM
Hi Wendy Hunt,

OnInserting, OnInserted, OnTransfering and OnTransferred are all server events that have their counter part on the client, named the same + the onclient prefix. In your case, you are not posting back to the server, so the server events are not fired. Please, remove the AutoPostBack="false" declaration and put the following instead:

AutoPostBackOnTransfer="true"


So, your source listbox declaration should looks like this:

<telerik:RadListBox ID="locationsRadListBox" runat="server" Height="125px" 
            Width="150px" AllowTransfer="true"  OnInserted="locationsRadListBox_OnInserted"
            TransferToID="RadListBoxDestination" DataSortField="Name" DataTextField="Name" 
            DataValueField="Name" AutoPostBackOnTransfer="true" Skin="WebBlue" >


This will make the server events described above to fire. However, you cannot use the Inserting event to sort items. The reason is, that the Inserting event has entirely different purpose. It was designed to be used when the ListBox is bound to a datasource and the automatic datasource updates functionality is turned on. In your case, you wil need to stick to the OnTransferring event. Once there, you need to use the following code:

void RadListBox1_Transferred(object sender, RadListBoxTransferredEventArgs e)
    {
        RadListBox1.Sort = RadListBoxSort.Ascending;
        RadListBox1.SortItems();
    }

For your convenience, I have prepared sample project demonstrating the approach.

Best wishes,
Genady Sergeev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Wendy Hunt
Top achievements
Rank 2
answered on 07 Jan 2010, 05:49 PM
HI Genady -

I was able to get it to work, finally...  :)

I had to put it in an if statement with (!Page.IsPostBack) because it kept repopulating itself and refreshing the list without transferring my requested data to the next box.  Now it works just fine.  Thanks for your help and explanations. 

wen
0
Mark Galbreath
Top achievements
Rank 2
answered on 11 Jan 2010, 12:57 PM
Doh!  Wendy, I was thinking of telling you to put it in the isPostback conditional of the Page_Load method, but just assumed you were doing that.  Sorry!

Cheers!
Mark
0
Jerry T.
Top achievements
Rank 1
answered on 04 Jan 2011, 06:38 PM
Whatever happened to the KB article on sorting a listbox on the client-side?
0
Simon
Telerik team
answered on 05 Jan 2011, 12:59 PM
Hello Roberth Dudiver,

It has been a long time since we promised to publish the KB without any result until now. We will now look into this and will consider publishing the article in the next few weeks.

Please excuse us for delaying this for so long and thank you for reminding us.

Greetings,
Simon
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
Jerry T.
Top achievements
Rank 1
answered on 05 Jan 2011, 02:22 PM
Thanks, Simon!
0
Jerry T.
Top achievements
Rank 1
answered on 10 Feb 2011, 07:22 PM
Any word on releasing this?
0
Genady Sergeev
Telerik team
answered on 16 Feb 2011, 02:09 PM
Hi Jerry T.,

I am attaching sample project that shows how to do the sorting. The changes are persist over a postback. I hope that this will help you to get started.

Greetings,
Genady Sergeev
the Telerik team
Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.
0
Premalatha
Top achievements
Rank 1
answered on 08 Jun 2011, 12:55 PM
Hi,

The code given below is not working (RadListBoxSort.Zip). We are not able to move all the items using >> button. The items are not at all moving. Please provide us the correct code so that we can use it.

Please do the needful.
 
Thanks,
Prema
0
ANDREW
Top achievements
Rank 1
answered on 24 Feb 2012, 02:44 AM
Hi Folks,

I've modified Genady's example to use args.get_items instead of args.get_item so it will work with multiple items (either by selecting multiple or using the 'transfer all' buttons. Also the example was missing the specification for the source sorting order which meant that the source box would sort descending..

Regarding the track and commit code, I'm not sure what the recommended location would be (around the items for loop or inside wrapping each insert call). Putting it outside the items for loop should perform better but not sure if there would be any downsides??

HTH

Andrew

var direction = { ascending: 0, descending: 1 };
 
Telerik.Web.UI.RadListBox.prototype.comparer = function() { };
Telerik.Web.UI.RadListBoxItem.prototype.compareTo = function(otherItem) {
    return this.get_parent().comparer(this, otherItem);
}
 
function pageLoad() {
    initComparers();
}
 
function initComparers() {
    var source = $find("<%= source_ListBox.ClientID %>");
    var destination = $find("<%= destination_ListBox.ClientID %>");
 
    // you can chose among ascending/descending
    source.direction = direction.ascending;
    destination.direction = direction.ascending;
 
    // you can use your own comparer depending on the criteria you want to compare the
    // the items against. If the item to insert should preceed the current item
    // return 1. If the current item is before the item to insert return -1
    destination.comparer = source.comparer = function(item, otherItem) {
        var arr = [item.get_text(), otherItem.get_text()];
        arr.sort();
        var result = arr[0] == item.get_text() ? -1 : 1;
 
        if (item.get_parent().direction == direction.descending)
            result *= -1;
 
        return result;
    }
}
 
function transferring(sender, args) {
    args.set_cancel(true);
    var destination = args.get_destinationListBox();
 
    var items = args.get_items();
 
   destination.trackChanges();
   args.get_sourceListBox().trackChanges();

    for (var j = 0; j < items.length; j++) {
        var itemToTransfer = items[j];
        var index = destination.direction == 0 ? destination.get_items().get_count() : 0;
 
        for (var i = 0; i < destination.get_items().get_count(); i++) {
            var currentItem = destination.getItem(i);
 
            if (currentItem.compareTo(itemToTransfer) > 0) {
                index = currentItem.get_index();
                break;
            }
        }
 
        destination.get_items().insert(index, itemToTransfer);
    }

   
destination.commitChanges();
   args.get_sourceListBox().commitChanges();

}
0
ANDREW
Top achievements
Rank 1
answered on 24 Feb 2012, 02:54 AM
Ok so I've just found a bug in this method.. it seems that when transferring from source to destination (either using the single move to dest on the last remaining item in the source list or 'all move to dest' buttons, all buttons disable. However if going the other way (from destination to source), moving the last remaining item in the destination list or 'all move' button the 'move single to source' and 'move all to source' buttons stay enabled until the use clicks in the source box.

Just out of interest, what is the reason that the 'move all' buttons appear disabled at all? I can understand that if all items are already in one location you wouldn't need the move all TO that location but surely the move all to other location button should be enabled even if the listbox doesn't have focus? The buttons themselves do actually still 'work' but appear disabled until either listbox gains focus.

Just to clarify, the problem only occurs if the transfer function is 'overridden'. The standard Telerik controls function as expected if the transfer isn't cancelled and processed manually. Just need to work out how to update the transfer buttons manually post update.

Cheers,

Andrew
0
Brent
Top achievements
Rank 1
answered on 26 Jun 2012, 01:48 PM
I'm having the same issue. The server side sort adds the un-smooth postback and the code above seems to work nicely but it has errors with the transfer all. Any fix/solution for this?
0
Genady Sergeev
Telerik team
answered on 29 Jun 2012, 09:03 AM
Hello,

We have dropped the idea for client-side sorting due to the performance impact it would have caused. If you experience any issue with the server-side sorting please open a support ticket and provide more details regarding your scenario there.

All the best,
Genady Sergeev
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
SlimSjakie
Top achievements
Rank 2
answered on 23 Nov 2012, 01:06 PM
Sorting a RadListBox on the client is not that difficult:

function doFullSort(sender, args) {
    var oRadListBox = $telerik.toListBox($find('<%=rlbMain.ClientID %>'));
 
    var Items = oRadListBox.get_items();
    var ItemA, ItemB, ItemX;
 
    for (x = 0; x < Items.get_count(); x++) {
        ItemA = Items.getItem(x);
 
        for (y = x+1; y < Items.get_count(); y++) {
            ItemB = Items.getItem(y);
 
            if (ItemA.get_text() > ItemB.get_text()) swapItem(ItemA, ItemB);
        }
    }
}
 
function swapItem(ItemA, ItemB)
{
    var ItemX = new Telerik.Web.UI.RadListBoxItem();
 
    ItemX.set_value(ItemB.get_value());
    ItemX.set_text(ItemB.get_text());
 
    ItemB.set_value(ItemA.get_value());
    ItemB.set_text(ItemA.get_text());
 
    ItemA.set_value(ItemX.get_value());
    ItemA.set_text(ItemX.get_text());
}
Tags
ListBox
Asked by
Roberth Dudiver
Top achievements
Rank 1
Answers by
Genady Sergeev
Telerik team
vbl vbl
Top achievements
Rank 1
Michael Arocho
Top achievements
Rank 2
Simon
Telerik team
Jason
Top achievements
Rank 1
Mark Galbreath
Top achievements
Rank 2
Wendy Hunt
Top achievements
Rank 2
Jerry T.
Top achievements
Rank 1
Premalatha
Top achievements
Rank 1
ANDREW
Top achievements
Rank 1
Brent
Top achievements
Rank 1
SlimSjakie
Top achievements
Rank 2
Share this question
or