Finding drag direction when TabStrip Reordered

3 posts, 0 answers
  1. Daniel
    Daniel avatar
    2 posts
    Member since:
    Feb 2014

    Posted 12 Feb 2014 Link to this post


    I as thinking of using the Reordered server event to catch the reordering of tabs and to save the change to a database. I know e.Offset is the difference between the source index and the destination index, however it is always positive, so if I drag a tab by 1 to the left or to the right, the offset is still always positive 1.

    Is there any way to detect the drag direction?

    The code I was planning to use is something like this:

    void tabsDescriptions_Reordered(object sender, RadTabStripReorderedEventArgs e)
        int descriptionId = (int.Parse(e.Tab.Value));
        int destinationIndex = (e.Tab.Index + e.Offset);
        int destinationId = int.Parse(tabsDescriptions.Tabs[destinationIndex].Value);
        if (e.Offset > 0) //moving after destination
            ProductDescriptionsController.MoveProductDescriptionAfter(descriptionId, destinationId, int.Parse(txtProductId.Text), System.Threading.Thread.CurrentThread.CurrentUICulture.Name);
        else //moving before destination
            ProductDescriptionsController.MoveProductDescriptionBefore(descriptionId, destinationId, int.Parse(txtProductId.Text), System.Threading.Thread.CurrentThread.CurrentUICulture.Name);
  2. Boyan Dimitrov
    Boyan Dimitrov avatar
    1728 posts

    Posted 17 Feb 2014 Link to this post


    An easy and convenient way of determining whether the user is dragged the selected tab to the left or right would be to use the RadTabStrip OnClientReordering. This way you can store the tab index before the dragging. So in the Reordered server-event you can determine the drag direction
    //markup code
    <telerik:RadTabStrip ID="RadTabStrip1" runat="server" OnReordered="RadTabStrip1_Reordered" EnableDragToReorder="true" OnClientReordering="clientReordering">
    <asp:HiddenField  ID="hiddenField" runat="server"/>
    <asp:Label ID="Label1" runat="server"></asp:Label>
    function clientReordering(sender, args) {
                        document.getElementById("hiddenField").value = args.get_tab().get_index();
    //code behind
    protected void RadTabStrip1_Reordered(object sender, RadTabStripReorderedEventArgs e)
                if (int.Parse(hiddenField.Value) > e.Tab.Index)
                    Label1.Text = "Negative";
                    Label1.Text = "Positive";

    Boyan Dimitrov
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the UI for ASP.NET AJAX, subscribe to the blog feed now.
  3. DevCraft R3 2016 release webinar banner
  4. Daniel
    Daniel avatar
    2 posts
    Member since:
    Feb 2014

    Posted 27 Feb 2014 in reply to Boyan Dimitrov Link to this post

    Thanks, I found another way by reading the whole thing back after a move and then do my reordering according to what changed, but your solution probably has a better performance. I will try to implement that for the next version of what I am doing...
Back to Top