How to disable dragging/dropping to first position?

14 posts, 0 answers
  1. kalyan gupta
    kalyan gupta avatar
    52 posts
    Member since:
    Aug 2010

    Posted 01 Feb 2011 Link to this post

    Hi

    I am using Telerik:RadListbox in which i have to to show one item as disabled. Now I should always show the disable item at the top and should prompt the user tht disabled item will be the first item always.

    Please let me know how to achieve this functionality.

    Thanks in advance.
  2. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 02 Feb 2011 Link to this post

    Hello kalyan gupta,

    You could use the following function to disable an item from the ListBox and put it on top of the list.
    function disableItem(sender, args) {
                if (!confirm("Are you sure?")) {
                    args.set_cancel(true);
                }
                else {
                    var item = args.get_item();
                    sender.trackChanges();
                    item.disable();
                    sender.reorderItem(item, 0);
                    sender.commitChanges();
                }
            }

    Regards,
    Kate
    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.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. kalyan gupta
    kalyan gupta avatar
    52 posts
    Member since:
    Aug 2010

    Posted 02 Feb 2011 Link to this post

    Hi Kate

    Thanks for your response. I think you misunderstood my requirement, I am sorry for poor explanation.

    I will explain in a better way.

    I have 2 list boxes left side and right side.

    By default when the page loads right side list box should load with one list item which should not be allowed to drag to the left side list box.

    Also user should not be able to drag the items from left side list box to right side list box at the top, rather they can drag from the second position.
    And when the right side list box has more than one item after shifting the items from left to right list box, user should not be allowed to reorder the items to the first position.
    For Eg: any item greater than 1st position should not be allowed to be dragged to 1st position. 1st position should be occupied by predeficed element.

    Is there any way where in we can find the destination position to which the item is being dragged? If there is such way of finding destination position then i can show alert to user saying that Items cannot be reordered to first position.

    I hope this is clear. Please let me know if there is any such way.
  5. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 02 Feb 2011 Link to this post

    Hi kalyan gupta,

    As far as I understand your issue I believe that you could use this method:
    function dropping(sender, args) {
                
               var index = args.get_destinationItem().get_index();
     
               if (index < 1) {
                   alert('you may not drop on the first item');
                   args.set_cancel(true);
               }
     
           }

    And apply it on the ClientDropping event in the ListBox control:

    <telerik:RadListBox ID="RadListBox1" runat="server" EnableDragAndDrop="true"
              OnClientDropping="dropping" TransferToID="RadListBox2" AllowTransfer="true"  >

    Regards,
    Kate
    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.
  6. kalyan gupta
    kalyan gupta avatar
    52 posts
    Member since:
    Aug 2010

    Posted 03 Feb 2011 Link to this post

    Hi Kate,

    Thanks for your response.

    I am getting
    args.get_destinationItem().get_index() as 0 all the time when I am trying to transfer the values from left side listbox to right side listbox and hence values are not getting transferred to right side list box with the javascript which is being used.

    Please let me know how to proceed.

    Thanks in advance.
  7. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 03 Feb 2011 Link to this post

    Hi kalyan gupta,

    Here I am sending you a sample page demonstrating that you can not drop an item from the left ListBox to the right one only when the index of the destintion is zero. The get_destinationItem().get_index() gets the index of the destination item and does not allow you to drop the item with index 0 (on the first position in the ListBox). 

    Let me know how it goes.

    Regards,
    Kate
    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.
  8. kalyan gupta
    kalyan gupta avatar
    52 posts
    Member since:
    Aug 2010

    Posted 03 Feb 2011 Link to this post

    Hi Kate

    Your code works fine when there are more than one items in the right side list box.

    But if there is only one item in the right side list box args.get_destinationItem().get_index() is giving 0 and hence unable to transfer any items from left to right.

    Please let me know how to handle this case.
  9. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 04 Feb 2011 Link to this post

    Hello Kalyan,

    Give a try with the following code snippet:

    Java Script:
    <script type="text/javascript">
                function cancelDragDrop(sender, args) {
                      set_cancel(true);
               }
               function dropping(sender, args) {
                    var index = args.get_destinationItem().get_index();
                    if (index < 1 && args.get_destinationItem().get_parent().get_items().get_count()>1) {
                        alert('you may not drop on the first item');
                        args.set_cancel(true);
                    }
               }
    </script>


    -Shinu.
  10. kalyan gupta
    kalyan gupta avatar
    52 posts
    Member since:
    Aug 2010

    Posted 04 Feb 2011 Link to this post

    Hi Shinu

    if (index < 1 && args.get_destinationItem().get_parent().get_items().get_count()>1)
    Now the above condition allows the user to drag items from left list box to right list box but in my case user should not be allowed to drag the items to the first position.. Any Item from left list box should be allowed to transfer below the first item only.

    By default the first position of the right side list box should be item 1r. Code would look something like this:

    Please help me how to achieve this.

    <

     

     

    telerik:RadListBox ID="RadListBox1" runat="server" EnableDragAndDrop="true" Style="top: 0px;

     

     

     

     

    left: 5px" TransferToID="RadListBox2" AllowTransfer="true" OnClientDropping="dropping">

     

     

     

    <Items>

     

     

     

    <telerik:RadListBoxItem Text="item 1" />

     

     

     

    <telerik:RadListBoxItem Text="item 2" />

     

     

     

    <telerik:RadListBoxItem Text="item 3" />

     

     

     

    <telerik:RadListBoxItem Text="item 4" />

     

     

     

    </Items>

     

     

     

    </telerik:RadListBox>

     

     

     

    <telerik:RadListBox ID="RadListBox2" runat="server" EnableDragAndDrop="true" Style="top: 0px;

     

     

     

     

    left: 50px;" OnClientDragStart="cancelDragDrop" OnClientDropping="cancelDragDrop">

     

     

     

    <Items>

     

     

     

    <telerik:RadListBoxItem Text="item 1r" />

     

     

     

    </Items>

     

     

     

    </telerik:RadListBox>

     

  11. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 07 Feb 2011 Link to this post

    Hello Kalyan,

    The following code snippet shows how to achieve this.

    Java Script:
    <script type="text/javascript">
          function dropping(sender, args) {
             if (args.get_dropPosition() < 1) {
                alert('you may not drop on the first item');
                args.set_cancel(true);
            }
       }
             
    </script>


    Thanks,
    Princy.
  12. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 07 Feb 2011 Link to this post

    Hi kalyan gupta,

    Thanks for the remark. Try to modify the function from the project I sent you to:
    function dropping(sender, args) {
                    var itemsCount = sender.get_transferTo().get_items().get_count();
     
                    if (itemsCount <= 1) {
                        return; // allow drop
                    } else if (args.get_destinationItem().get_index() < 1) {
                        alert('you may not drop on the first item');
                        args.set_cancel(true); // cancel
                    }
     
                 }
    Let me know if it helps.

    Kind regards,
    Kate
    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.
  13. kalyan gupta
    kalyan gupta avatar
    52 posts
    Member since:
    Aug 2010

    Posted 07 Feb 2011 Link to this post

    Hi Kate

    Thanks for your solution.

    function dropping(sender, args) {
                    var itemsCount = sender.get_transferTo().get_items().get_count();
     
                    if (itemsCount <= 1) {
                        return; // allow drop
                    } else if (args.get_destinationItem().get_index() < 1) {
                        alert('you may not drop on the first item');
                        args.set_cancel(true); // cancel
                    }
     
                 }

    The above function allows the user to trannsfer a left side list box item as the first item of right side list box. But from the second time onwards it does not allow the user to transfer any items.

    Please help in correcting the code.

    Thanks in advance.
  14. kalyan gupta
    kalyan gupta avatar
    52 posts
    Member since:
    Aug 2010

    Posted 07 Feb 2011 Link to this post

    args.get_destinationItem().get_index() results in 0 when there are only one item in the right list box.
    So the user is able to transfer the items to right list box when there is only one item in the right list box.

  15. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 08 Feb 2011 Link to this post

    Hi kalyan gupta,

    I am not quite sure that I understand what you are trying to achieve, try the following code and in case it does not help, please let me know again which items exactly  from ListBox1 and/or ListBox2 are allowed to be transfered and which are not :
    <script type="text/javascript">
               function cancelDragDrop(sender, args) {
                  
                   set_cancel(true);
              }
     
              function dropping(sender, args) {
               
                  Sys.Debug.trace(args);
                  var itemsCount = sender.get_transferTo().get_items().get_count();
     
                  if (args.get_destinationItem())
                      Sys.Debug.trace(args.get_dropPosition());
                    
                   if (itemsCount < 1 || (itemsCount == 1 &&  args.get_dropPosition() > 0)) {
                       return; // allow drop
                   } else if (args.get_destinationItem().get_index() < 1) {
                       alert('you may not drop on the first item');
                       args.set_cancel(true); // cancel
                   }
     
                }
            
           </script>


    Best wishes,
    Kate
    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.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017