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

Limit selectable items client side

7 Answers 216 Views
ListBox
This is a migrated thread and some comments may be shown as answers.
Paul J
Top achievements
Rank 1
Paul J asked on 27 May 2011, 03:22 PM
Does not look like the RadListBox (SelectionMode="Multiple) has a "max # of allowable selected items" attribute, so how may I programmatically limit it client side?

I've got the following so far. But how do I basically say if the # of selectable items is greater than 5, then remove the last selected item?

Thanks! (fyi, I did an extensive search of the forums, and documentation but could not find something that shows me how to do this).
How do i set "item" to the last selected item of the listbox? sounds like
listbox.get_selectedItem();

in a multi select listbox gets the first selected, not the "last selected".


function onSelectedIndexChanged(sender, args) {
    var listbox = $find("<%= MyListBox.ClientID %>");               
    var items = listbox.get_selectedItems();
 
    if (items.length > 5) {
        // var item = get last selected item ??
        listbox.trackChanges();
        listbox.get_items().remove(item);
        listbox.commitChanges();
         
    }

7 Answers, 1 is accepted

Sort by
0
Accepted
Gimmik
Top achievements
Rank 1
answered on 27 May 2011, 05:15 PM
Hi Paul,

Rather then counting the selected items after a new item is selected, then trying to cancel the latest selection, let's try it a slightly different way. Have you tried to wire-up the OnClientSelectedIndexChanging event? Since this event is fired before the item is selected, you can cancel the selection. Here's a link to the documentation page.

http://www.telerik.com/help/aspnet-ajax/listbox-onclientselectedindexchanging.html

Let me know if this works for you,
-Gimmik
0
Paul J
Top achievements
Rank 1
answered on 27 May 2011, 07:06 PM
Gimmik,

Good call! Thanks for the help. Works great when using the Control key to select multiple items.

how can i adjust this so that it takes into account when the user selects items using the shift key? I mean, on the onClientSelectedIndexChangingHandler event how can I count the # of items the user is trying to select (i.e. versus already selected, which is what i'm currently checking.
0
Gimmik
Top achievements
Rank 1
answered on 27 May 2011, 07:43 PM
Hi Paul,

That actually is a more complicated situation. The only object sent into the the event is the item clicked on, because that represents the index of the last item selected (if that makes any sense.) The perfect method would be OnClientSelected, which isn't implemented for the RadListBox. I would submit a ticket to Telerik to see if there is an easy way to do this. Otherwise, I think you may have to do something along the lines of what you were thinking originally. Maybe there is a way of disabling the shift key?

-Gimmik
0
Paul J
Top achievements
Rank 1
answered on 27 May 2011, 07:52 PM
Thanks for the response. I probably won't venture into a way to handle it right now. I have other checks in place that do not allow the form to submit if the user's selected more than 5 items from the listbox. I also have a label on screen that informs the user of the 5 item limit (not that users ever read what's in front of them). But these things should suffice to not have to take the time/effort to code to simply handle the case of them using the shift key. Besides, for my situation, because of what data they select within the ListBox, it'll be rare that they use the shift key in a way to select more than the alloted 5 items.

Again, thanks for your help though.
0
Gimmik
Top achievements
Rank 1
answered on 27 May 2011, 08:12 PM
If end-users knew how to read and follow directions, us developers would be out of business. Good luck with your project my friend.

-Gimmik
0
Harshil
Top achievements
Rank 1
answered on 18 Jul 2011, 02:07 PM
Can i know the aspx code also?
On which event I can call this Javascript function?

OnselectIndexChanges it throws an error.
0
Paul J
Top achievements
Rank 1
answered on 18 Jul 2011, 07:26 PM
you should be using the : OnClientSelectedIndexChanging event

here's the full code:

function onClientSelectedIndexChangingHandler(sender, e) {
               var listbox = $find("<%= RadListBox1.ClientID %>");
               var items = listbox.get_selectedItems();
    
               if (items.length >= 5) {
                   
                    e.set_cancel(true); 
                   }
                   else
                   {
                       e.set_cancel(false);
                   }                
               
               
           }

aspx:

<telerik:RadListBox  ID="RadListBox1" OnClientSelectedIndexChanging="onClientSelectedIndexChangingHandler" runat="server" Width="270px" Height="110px" SelectionMode="Multiple"   />

Tags
ListBox
Asked by
Paul J
Top achievements
Rank 1
Answers by
Gimmik
Top achievements
Rank 1
Paul J
Top achievements
Rank 1
Harshil
Top achievements
Rank 1
Share this question
or