RadTabControl TabReorder

8 posts, 0 answers
  1. Nasir
    Nasir avatar
    18 posts
    Member since:
    Apr 2013

    Posted 28 Nov 2013 Link to this post

    Hi,

    we are using a TabControl where the TabItems are generated at runtime and an ObservableCollection is bound to the ItemSource.
    I have set the AllowDragReorder to True but for some reason only one tab can be dragged and re-ordered. I am not sure what is causing this behaviour.

    Can someone please help?

    Regards,


    Nasir
  2. Milena
    Admin
    Milena avatar
    201 posts

    Posted 02 Dec 2013 Link to this post

    Hi Nasir,

    I tried to reproduce the issue locally, but I was not able to. I'm sending you a project where you can see a simple implementation of the RadTabControl in data-binding scenario and  where the AllowDragReorder functionality works as expected.
    However, we might miss important part of your implementation. This is why I believe it will be better if you can modify the project I sent you. This will allow us to examine your implementation and try to reproduce the issue locally. 

    Thank you in advance for your cooperation on the matter.

    Regards,
    Milena
    Telerik
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for SILVERLIGHT.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  3. DevCraft banner
  4. Nasir
    Nasir avatar
    18 posts
    Member since:
    Apr 2013

    Posted 04 Dec 2013 Link to this post

    Thanks for replying.

    I have managed to reproduce the issue in a test project. Basically when you have tabs already created e.g. 5 tabs is the bound object.
    If you set a new object to an existing index e.g. create a new object (don't add it to the collection or insert) but set it on an existing index e.g Tabs[0] = New bound object.

    This disables Drag reordering on the Tab[0]. The rest of the tabs can be dragged and dropped but any existing tab content updated via an index seems to have disabled the Drag Reorder.

    Support ticket:
    http://www.telerik.com/account/support-tickets/view-ticket.aspx?threadid=765034

    Thanks.
  5. Milena
    Admin
    Milena avatar
    201 posts

    Posted 05 Dec 2013 Link to this post

    Hello Nasir,

    Thank you for reporting this issue. I have forwarded it to our developers so they will take a look at it. 

    In the meantime, as a workaround you can add the new TabItems as follow:
    private void InsertTab_OnClick(object sender, RoutedEventArgs e)
    {
        var vm = this.DataContext as SampleViewModel;
        //vm.Items[0] = "New tab";
     
        vm.Items.RemoveAt(0);
        vm.Items.Insert(0, "New Item");      
    }

    Let me know if this information helps or if you have any further questions.


    Regards,
    Milena
    Telerik
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for SILVERLIGHT.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  6. Nasir
    Nasir avatar
    4 posts
    Member since:
    Sep 2013

    Posted 05 Dec 2013 Link to this post

    Hi Milena,

    I have already tried removing and inserting the tab which restores the re-ordering correctly but it then messes up the rest of our business logic.

    The way our code works is we have a Tab history setup. So each tab can have its own navigation history i.e. a single tab can display different types of content. We need to retain the 'created' RadTabItem and only change its content by doing vm.Items[0] = "New Content".
    This gets logged as a history over time so if the user then navigates forward or backward (using dedicated buttons) on a single tab, this same tab will be able to show different content.

    Now the problem is when you remove a tab and add it again, it destroys the visual element and creates a completely new one which messes up the History for this tab.

    We are still working out if we can make it work using the approach you suggested which we already tried before posting the question here but still trying to make it work the way we want.

    Regards,

    Nasir
  7. Milena
    Admin
    Milena avatar
    201 posts

    Posted 06 Dec 2013 Link to this post

    Hi Nasir,

    Thank you for the given details about your implementation and your requirements. I'm attaching an edited project where you can find a workaround. What we have changed - we use the ItemsSource CollectionChanged event which is fired after modifying the RadTabItems collection and we make each RadTabItem draggable by setting the DragDropManager.SetAllowCapturedDrag to true.

    Let me know if this works for you or in case you have any further questions.

    Regards,
    Milena
    Telerik
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for SILVERLIGHT.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  8. Nasir
    Nasir avatar
    4 posts
    Member since:
    Sep 2013

    Posted 06 Dec 2013 Link to this post

    Hi Milena,

    Thank you very much that will resolve the issue but we are using MVVM where we don't have access to the Tab control in the view model so I can use the workaround as it is. Is there a way I can do this in MVVM?

    Regards,


    Nasir
  9. Nasir
    Nasir avatar
    4 posts
    Member since:
    Sep 2013

    Posted 09 Dec 2013 Link to this post

    Hi Milena,

    No worries, I have used the tab control's SelectionChanged event with the same code you posted and it works great. Thanks again!
Back to Top
DevCraft banner