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

Uncheck does not clear checkbox for moved items

3 Answers 261 Views
ListBox
This is a migrated thread and some comments may be shown as answers.
Vladimir
Top achievements
Rank 1
Vladimir asked on 15 Jun 2011, 01:37 PM
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

3 Answers, 1 is accepted

Sort by
0
Peter Filipov
Telerik team
answered on 20 Jun 2011, 01:10 PM
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

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
Erik
Top achievements
Rank 1
answered on 10 Oct 2012, 04:43 PM
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");

]]

 

 

 

 

 

 

 

 


0
Vladimir
Top achievements
Rank 1
answered on 11 Oct 2012, 08:20 AM
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;
    }
Tags
ListBox
Asked by
Vladimir
Top achievements
Rank 1
Answers by
Peter Filipov
Telerik team
Erik
Top achievements
Rank 1
Vladimir
Top achievements
Rank 1
Share this question
or