Uncheck does not clear checkbox for moved items

[Vladimir]

Hello,

I have listbox with checkboxes.
I need to select/deselect item when checkbox is checked/unchecked and check/uncheck checkbox when item is selected/deselected.
I have implemented this by adding handlers to OnClientSelectedIndexChanged and OnClientItemChecked events.

<script type="text/javascript">

    var lock;

    var SelectedIndexChanged = function (sender, event) {

        if (!lock) {

            lock = true;

            var item = event.get_item();

            var listbox = item.get_listBox();

             

            item.check();

             

            var selectedItems = jQuery.makeArray(listbox.get_selectedItems());

            var checkedItems = listbox.get_checkedItems();

            var diffItems = [];

 

            for (var i = 0; i < checkedItems.length; i++) {

                if (jQuery.inArray(checkedItems[i], selectedItems) == -1) {

                    diffItems.push(checkedItems[i]);

                }

            }

 

            for (var i = 0; i < diffItems.length; i++) {

                diffItems[i].uncheck();

            }

 

            lock = false;

        }

    }

 

    var ItemChecked = function (sender, event) {

        lock = true;

        var i = event.get_item();

        i.set_selected(i.get_checked());

        lock = false;

    }

</script>

<asp:ScriptManager ID="sc" runat="server">
    </asp:ScriptManager>
    <telerik:RadListBox ID="lstbx1" runat="server" AllowDelete="false" AllowReorder="true"
        CheckBoxes="true" AllowTransfer="false" AutoPostBack="false" DataKeyField="ID"
        DataTextField="Name" DataValueField="ID" SelectionMode="Multiple"
        EnableDragAndDrop="true" Height="210" Width="250"
        OnClientSelectedIndexChanged="SelectedIndexChanged"
        OnClientItemChecked="ItemChecked">
        
    </telerik:RadListBox>


It works fine when single or multiple items are selected.
But it does not work if items were moved by buttons or by mouse.
When item "N1" (for example) is moved and then I select other item, listbox.get_checkedItems() returns this item and then I do uncheck for it in SelectedIndexChanged handler. But checkbox of this item is still checked, moreover listbox.get_checkedItems() does not return the item anymore. It looks like the item has 'not checked' status in object model but its checkbox is still checked.

I use ASP.NET AJAX Q1 2011.

/Vladimir

[Peter Filipov]

Hi Vladimir,

I have already answered your support ticket regarding the same issue.

To avoid duplication, please let continue our discussion into the support ticket.

Greetings,

Peter Filipov
the Telerik team

[Erik]

I'm running in the same issue; can you share the resolution?
Thanks!

Version=2011.2.712.40


                        <telerik:RadListBox ID="lstTemplates" runat="server"    
                            height="500px"
                             AllowDelete="false"
                            AllowTransfer="false"
                            AllowTransferDuplicates="false"
                            AllowTransferOnDoubleClick="false"
                            PersistClientChanges="true"
                            CheckBoxes="true"
                            ButtonSettings-ShowReorder="false"
                            AllowReorder="true" EnableDragAndDrop="true"
                            Width="95%" />



client script:

        function UnCheckAll() {
            var listbox = $find("<%= lstTemplates.ClientID %>");
            if (!listbox) return;

            var selections = listbox.get_checkedItems();
            if (selections && selections.length) {
                for (var i = 0; i < selections.length; i++) {
                    selections[i].set_checked(false);
                }
            }
        }

After user drags and drop a list item (that is already checked); then invokes UnCheckAll() - the moved item is returned in the get_checkedItems() call, but calling set_checked(false) or uncheck() does not change the state of the UI element (the underlying object model is now 'unchecked however).

If there is a work around for this version of the controls that would be appreciated - we can and do plan on upgrading to the current version soon-ish - but is not an immediately possibility.
Thanks!



[[
My current work around, which is fine for unselecting all the checkbox is, is to simply do this after clearing the model's selected state in UnCheckAll() :

 $("#<%= lstTemplates.ClientID %> input[type=checkbox]").removeAttr("checked");

]]

 

 

 

 

 

 

 

 

[Vladimir]

var lock;
    this.SelectedIndexChanged = function (sender, event) {
        if (!lock) {
            lock = true;
            var item = event.get_item();


            item.check();
            $("input:checkbox", item.get_element())[0].checked= true;

            var listbox = item.get_listBox();
            var selectedItems = $.makeArray(listbox.get_selectedItems());
            var checkedItems = listbox.get_checkedItems();
            var diffItems = [];

            for (var i = 0; i < checkedItems.length; i++) {
                if ($.inArray(checkedItems[i], selectedItems) == -1) {
                    checkedItems[i].uncheck();
                    $("input:checkbox", checkedItems[i].get_element())[0].checked= false;
                }
            }

            lock = false;
        }
    }

    this.ItemChecked = function (sender, event) {
        lock = true;
        var i = event.get_item();
        i.set_selected(i.get_checked());
        lock = false;
    }