clearSelection not working on source ListBox in OnClientTransferred event

4 posts, 0 answers
  1. Gunnar Skogen
    Gunnar Skogen avatar
    10 posts
    Member since:
    Jul 2009

    Posted 07 Jul 2010 Link to this post

    Hi,

    Default behavior when transferring items between ListBoxes seem to be that the adjacent item to the moved item in the source listbox is selected. This is not what I wanted, so I tried various ways to unselect all in the source listbox after a transfer.
    When transferring items between two listboxes (AllowTransfer="true"), the ListBox.clearSelection dows not work on the source ListBox.
    I also tried using this statement from another related thread:

    $telerik.$(sourceListBox._getGroupElement()).focus();

     but this does not help.

    Only way I made it work is the rather graceless way of using

    OnClientSelectedIndexChanged

    as shown in this code:
    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestListBox.aspx.cs" Inherits="TestListBox" %> 
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
     
    <html xmlns="http://www.w3.org/1999/xhtml">  
    <head runat="server">  
        <title></title>  
        <telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" /> 
    </head> 
    <body> 
        <form id="form1" runat="server">  
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">  
            <Scripts> 
                <%--Needed for JavaScript IntelliSense in VS2010--%> 
                <%--For VS2008 replace RadScriptManager with ScriptManager--%> 
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" /> 
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" /> 
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" /> 
            </Scripts> 
        </telerik:RadScriptManager> 
        <script type="text/javascript">  
     
            var lastSrcLB = "";  
            // Maintain edits in  
            function ListBoxItemTransferred(sender, event) {  
                var destinationListBox = event.get_destinationListBox();  
                var sourceListBox = event.get_sourceListBox();  
                //$telerik.$(destinationListBox._getGroupElement()).focus();  
                destinationListBox.clearSelection();  
                lastSrcLB = sourceListBox.get_id();  
                //$telerik.$(sourceListBox._getGroupElement()).focus();  
                sourceListBox.clearSelection();  
            }  
     
     
            function SelectedIndexChanged(sender, e) {  
                var item  = e.get_item();  
                alert(sender.get_id() + "::" + lastSrcLB  + "::" + item.get_text());  
                if (sender.get_id() == lastSrcLB) {  
                    lastSrcLB = "";  
                    event.returnValue = false;  // To late  
                    event.cancelBubble = true;  
                    item.set_selected(false);  
                    return false;  
                }  
            }  
     
        </script> 
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">  
        </telerik:RadAjaxManager> 
        <div> 
                                    <telerik:RadListBox ID="SystemUserListBox1"   
                                                    runat="server"   
                                                    OnClientTransferred="ListBoxItemTransferred"   
                                                    OnClientSelectedIndexChanged="SelectedIndexChanged" 
                                                    AllowTransfer="True"   
                                                    TransferToID="TeamUserListBox"   
                                                    >                  
                                <ButtonSettings Position="Bottom" HorizontalAlign="Center" /> 
                                        <Items> 
                                            <telerik:RadListBoxItem runat="server" Text="RadListBoxItem1" /> 
                                            <telerik:RadListBoxItem runat="server" Text="RadListBoxItem2" /> 
                                            <telerik:RadListBoxItem runat="server" Text="RadListBoxItem3" /> 
                                            <telerik:RadListBoxItem runat="server" Text="RadListBoxItem4" /> 
                                        </Items> 
                                </telerik:RadListBox> 
     
     
     
     
     
                                <telerik:RadListBox ID="TeamUserListBox"   
                                                    runat="server"   
                                                    OnClientTransferred="ListBoxItemTransferred"    
                                                    OnClientSelectedIndexChanged="SelectedIndexChanged" 
                                                    > 
                                </telerik:RadListBox> 
     
        </div> 
        </form> 
    </body> 
    </html> 
     

    Any better alternatives?

    (Would be nice if this behaviour could be set though properties..)


    Best Regards



    Gunnar Skogen

  2. Genady Sergeev
    Admin
    Genady Sergeev avatar
    1596 posts

    Posted 09 Jul 2010 Link to this post

    Hello Gunnar Skogen,

    I believe that this is a bug inside RadListBox functionality. We will fix it, meanwhile you can use the following workaround, wrap the clearSelection method invocation inside setTimeout. Example code:

    function onClientTransferred(sender, args) {
                setTimeout(function() { sender.clearSelection(); }, 100);
            }


    All the best,
    Genady Sergeev
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Gunnar Skogen
    Gunnar Skogen avatar
    10 posts
    Member since:
    Jul 2009

    Posted 12 Jul 2010 Link to this post

    Thanks Genady,

    Timeout: Cause of bug probably inside the Browsers/DHTML then as I have experienced this kind of problems back in the day when doing stuff like this - creating elements in DHTML on the fly  and doing other stuff at the same time causes problems like this. Usually some well placed alerts inside the code makes things "work".
    If Telerik has a strategy around stuff like this, that would be nice, even if it is a timeout :)


    Best Regards

    Gunnar Skogen  
  5. T. Tsonev
    Admin
    T. Tsonev avatar
    2772 posts

    Posted 15 Jul 2010 Link to this post

    Hello Gunnar,

    Timeouts are sometimes needed in order to give the browser a chance to update it's DOM state. In this case the problem is in the control itself - the selection is moved after the transferred event firs which is misleading.

    We'll take care to fix this. As a token of gratitude for your involvement your Telerik points have been updated.

    Greetings,
    Tsvetomir Tsonev
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Back to Top