Transfer only from one direction

4 posts, 0 answers
  1. CRMR
    CRMR avatar
    4 posts
    Member since:
    Feb 2012

    Posted 04 Jul 2012 Link to this post

    I want to achieve the following:

    I have two Listboxes, one contains available items, the other contains 'current' items. The user must be able to transfer available items into the current items' listbox, or back again to the available items' listbox, which is standard functionality, so no problem there.

    HOWEVER, the current items may not be transferred into the available items' listbox, so I need a way to prevent this, but I don't see how.. Is this possible?
  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 04 Jul 2012 Link to this post

    Hi CRMR,

    Here is the the sample code that I tried based on your scenario.

    ASPX:
    <telerik:RadListBox ID="RadListBox1" runat="server" OnClientTransferring="OnClientTransferring" AllowTransfer="true" TransferToID="RadListBox2"   >
       <Items>
            <telerik:RadListBoxItem runat="server" Value="Sample1" Text="fbgSample1" />
            <telerik:RadListBoxItem runat="server" Value="Sample2" Text="Sample2" />
            <telerik:RadListBoxItem runat="server" Value="Sample3" Text="Sample3" />
            <telerik:RadListBoxItem runat="server" Value="Sample4" Text="Sample1" />
            <telerik:RadListBoxItem runat="server" Value="Sample5" Text="Sample2" />
            <telerik:RadListBoxItem runat="server" Value="Sample6" Text="Sample3" />
            <telerik:RadListBoxItem runat="server" Value="Sample7" Text="Sample1" />
            <telerik:RadListBoxItem runat="server" Value="Sample8" Text="Sample2" />
            <telerik:RadListBoxItem runat="server" Value="Sample9" Text="Sample3" />
       </Items>
    </telerik:RadListBox>
    <telerik:RadListBox ID="RadListBox2" runat="server" >
    </telerik:RadListBox>

    JS:
    <script type="text/javascript">
        function OnClientTransferring(sender, args) {
            var list1 = $find("<%= RadListBox1.ClientID %>");
            var list2 = $find("<%= RadListBox2.ClientID %>");
            if (args.get_sourceListBox() == list2) {
                args.set_cancel(true);
            }
        }
    </script>

    Hope this helps.

    Thanks,
    Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. CRMR
    CRMR avatar
    4 posts
    Member since:
    Feb 2012

    Posted 04 Jul 2012 Link to this post

    Hi Shinu, thanks for you reply. 
    However, your solution only solves part of the problem. It must be possible to move items froms listbox2 to listbox1 if that item was originally located in listbox1.. So I tried to solve the problem by storing the original content of listbox1 in a global variable, but it seems that this variable is somehow updated when listbox1 changes, so It doesn't remember the original items, but the current items in listbox1..

    I have this script now:
    <script type="text/javascript">
     
            itemsList = null;
     
            $(function () {
                var list1 = $find("<%= RadListBox1.ClientID %>");
                 
                // store items of first listbox in global variable
                itemsList = list1.get_items();
            });
     
            function OnClientTransferring(sender, args) {
                var list1 = $find("<%= RadListBox1.ClientID %>");
                //var list2 = $find("<%= RadListBox2.ClientID %>");
     
                // transfer from list1 always OK
                if (args.get_sourceListBox() == list1) {
                    return;
                }
                 
                var orginalList = itemsList;
                var item = args.get_item();
     
                var allowTransfer = true;
                var index = orginalList.indexOf(item);
                if (index >= 0) {
                    allowTransfer = false;
                }
     
                if (!allowTransfer) {
                    args.set_cancel(true);
                }
            }
     
        </script>

    In this script I have the problem that the 'indexOf' function always returns -1, so it never finds the item. If I add a line that counts the items in the 'originalList' or 'itemsList' variables, I see that the count reflects the current number of items in listbox1.. 
    Any clue what I'm doing wrong?
  5. CRMR
    CRMR avatar
    4 posts
    Member since:
    Feb 2012

    Posted 04 Jul 2012 Link to this post

    After a bit more debugging, I've found out what the problem is. Could be a bug, undocumented feature, or just me ;-)

    As it turns out, the internal contents of the stored list, is still correct (i.e. it contains the original items, found in _parent._itemData ). 
    But calling API functions such as get_count() or indexOf() seem to return the current state as it appears on screen! 

    So what I did, is copy the items to an array by caling the toArray() function of the RadListBoxItemCollection, and search that array for the value manually.

    This is the final code that works:
    script type="text/javascript">
     
            itemsList = null;
     
            $(function () {
                var list1 = $find("<%= RadListBox1.ClientID %>");
     
                // store items of first listbox in global variable
                itemsList = list1.get_items().toArray();
            });
     
            function OnClientTransferring(sender, args) {
                var list1 = $find("<%= RadListBox1.ClientID %>");
     
                // transfer from list1 always OK
                if (args.get_sourceListBox() == list1) {
                    return;
                }
     
                var item = args.get_item();
                var itemText = item.get_text();
                var allowTransfer = false;
     
                $.each(itemsList, function (index, value) {
                    if (value.get_text() == itemText) {
                        allowTransfer = true;
                        return;
                    }
                });
     
                if (!allowTransfer) {
                    args.set_cancel(true);
                }
            }
     
        </script>
Back to Top