Forums Ultimate UI for ASP.NET Web Forms
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Ravi
300
Multiple selection with checkbox - dropdownlist and selecteditems array out of sync
posted

Please refer to your official sample/demo page: https://es.infragistics.com/samples/aspnet/drop-down/multi-selection

  1. Use the first dropdownlist - which is the checkbox example.
  2. Dropdown the list using your mouse.
  3. Select the 3rd, 4th and 5th items in the list.
  4. Observe that the "new items" array in the Client Events log at the top of the page has the correct item numbers. It matches the items checked in the list.
  5. Now, using your keyboard, hit the <Home> key. Observe that the "new items" array is no longer in synch with the checked items in the list.
  6. Use the up/down cursor keys to move between the 1st and 2nd elements in the list. Observe that the originally checked items remain checked; the items that are selected and deselected using the up/down keys do NOT get checked/unchecked and the "new items" array no longer reflects the items selected using the mouse and checkbox.
  7. Now, leave items 3, 4 and 5 checked as they originally were. If you now use your mouse to select any other items, the "new items" array only has the newly checked items and not items 3, 4 and 5 that have remained checked.

Is this by design? What is the point of allowing selection using checkboxes if there is no reliable way to access them using the selecteditems array?

Is there any way to get the list of items that are currently checked?

I am not using the edit control part of the drop down. I have disabled it by setting the DisplayMode to DropDownList and with "eventArgs.set_cancel(true);" in the ValueChanging client-side event.

I have a separate label on the page where I display a comma delimited list of the currently selected items using the following client-side function triggered on SelectionChanged:

function onSelectedIndexChanged(sender, eventArgs) {
    var Items = eventArgs.getNewSelection();

    var ItemsString = "";
    var Delimiter = "";

    if (Items.length > 1)
        Delimiter = ", ";

    for (i = 0; i < Items.length; i++) {
        ItemsString += Items[i].get_text();
        if (i < (Items.length - 1))
            ItemsString += Delimiter;
    }

    $get("<%=selLabel.ClientID%>").innerHTML = ItemsString;
} 

Just as in your demo, this only works as long as the user uses their mouse to check and uncheck the items' checkboxes. The moment they use the keyboard to navigate through the list, it breaks.

To reiterate, is there any way I can get a list of items that are checked?

If not, is there any way I can disable navigating through the list using the keyboard? Using "eventArgs.set_cancel(true);" for the InputKeyUp and InputKeyDown events does not help. Any other thoughts?

Thanks.

Parents
  • 300
    posted

    Wanted to add that I've tested/observed the above with the following browsers: IE 6, IE 8, Firefox 3.5 and Chrome 3 on WIndows XP.

    Thanks.

Reply Children