OnClientSelectedIndexChanged

2 posts, 1 answers
  1. Matt
    Matt avatar
    1 posts
    Member since:
    Dec 2011

    Posted 10 Sep 2012 Link to this post

    I've been using the following code successfully with Q3 2011 SP1 to toggle the selection of RadListBox items when they're clicked (SelectionMode="Multiple") without requiring the use of the CTRL key. After upgrading to Q2 2012 SP1, OnClientSelectedIndexChanged no longer appears to fire if you click on an item that's already selected and it's the only item in the RadListBox that's selected. As a result, if there's only one item selected, the user cannot click on it to unselect it without first clicking on another item (and selecting that item). Is there a workaround to restore the previous functionality?

    UPDATE: I've traced the change in behaviour to a bug fix in Q1 2012 SP1: Fixed: OnClientSelectedIndexChanged/ing is always fired on subsequent clicks of the same item
    var changed;
    function radListBox_SelectedIndexChanged(sender, e) {
        if (!changed) {
            changed = true;
            var item = e.get_item();
            if (item.get_checked()) {
                item.uncheck();
                item.unselect();
            }
            else {
                item.check();
                item.select();
            }
            selectCheckedItems(item.get_listBox());
            changed = false;
        }
    }
     
    function selectCheckedItems(listbox) {
        if (listbox) {
            var items = listbox.get_checkedItems();
            for (var i in items) {
                items[i].select();
            }
        }
    }
  2. Answer
    Ivana
    Admin
    Ivana avatar
    657 posts

    Posted 12 Sep 2012 Link to this post

    Hello Brendan,

    This was considered as a bug and we had to change the SelectedIndexChanged behavior in the latest version of RadControls for ASP.NET AJAX.
    The following JavaScript, however, should fix the problem:
    var isSelected;
    function pageLoad() {
        var list = $find("RadListBox1");
        $telerik.$(list._element).delegate(".rlbItem", "mousedown", function (e) {
            if (e.target._item) {
                isSelected = e.target._item.get_selected();
            } else {
                isSelected = e.target.parentNode._item.get_selected();
            }
        });
     
        $telerik.$(list._element).delegate(".rlbItem", "click", function (e) {
            var itemObject = e.target._item;
     
            if (list.get_selectedItems().length == 1 && list.get_selectedItems()[0] == itemObject && isSelected) {
                itemObject.set_selected(!itemObject.get_selected());
            }
        });
    }
     
    var changed;
    function radListBox_SelectedIndexChanged(sender, e) {
        if (!changed) {
            changed = true;
            var item = e.get_item();
            if (item.get_checked()) {
                item.uncheck();
                item.unselect();
            }
            else {
                item.check();
                item.select();
            }
            selectCheckedItems(item.get_listBox());
            changed = false;
        }
    }
     
    function selectCheckedItems(listbox) {
        if (listbox) {
            var items = listbox.get_checkedItems();
            for (var i in items) {
                items[i].select();
            }
        }
    }

    I hope this will be helpful.

    Regards,
    Ivana
    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.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top