Hi,
 I am modifying the example shown here: http://www.telerik.com/community/forums/silverlight/tabcontrol/how-to-close-the-tab.aspx to accomplish having a close button on my Tab Header control. Basically I don't want to bind my RadTabControl to a list, but rather to create the RadTabItems programatically. The reason is because the content for each TabItem may differ substantially (we are dynamically generating that content).  However, I would sill like to bind the the TabItem to a class.  My HeaderTemplate is defined as:


This is what the logic looks like where I create my TabItems. I've cleaned it up to make it easier to see:

Probably is that the ID is not displayed properly in the Tab Header. After some testing I tried binding the TabControl to a list of MyObject instance and that seemed to make the header display correctly. But I really can't do that. Any ideas?

Maybe there is a way to do this without binding the TabItem at all?

 -- xavier

Ok, so figured out how to add the button to the RadTabItem head using a DataTemplate. I also can do this where I am creating the RadTabItem's programatically. My code looks something like this:


The RadTabHeaderTemplate is defined as:


here are the problems I am Having.

1. I want to bind the controls in the DataTemplate to properties of the MyObject class. Specifically, MyObject.Id and MyObject.ImageSource. I can't seem to get this binding to work.

2. In the OnClick event of the button, How do I get access to the DataContext of the RadTabItem.  This is what I currently have, what do I need to add to access the MyObject Datacontext from the line above:

newTab.DataContext = MyObject;

here is what I have now:


Finally, for the RadTabControl, I use DropDownDisplayMode="Visible". However, this shows everything in the RadTabHeaderTemplate (button, image and text) in the dropdown. Can I create a separate template to display only the text in the dropdown?

Thanks for any help you can offer here.

Hello Xavier,

I prepared a sample for you that shows the proffered approach in this situation. Basically, it uses TabIteViewModel and the TabControl is bound to an ObservableCollection of ViewModels.
Do not hesitate to ask if you need more info on this.

Regards,
Petar Mladenov
the Telerik team

Peter,
  First, thank you for your response. I was hoping that I was clear on one particular point and that is that we cannot bind the TabControl to a viewmodel for various reasons. Therefore, we would need to be able to bind the TabItem itself to the view model as such:


At that point, it should not matter that the TabControl itself is not bound to a list. Is this not possible with the TabControl?  If it is possible, then I would l need to have the other questions answered:

1.How do I bind the controls defined in the DataTemplate to properties of the MyViewModel class?
2. How do I access the ViewModel in the OnClick event of the button on the head and then how can I tell the TabControl to remove the specified tab since it is not bound to a list?

Please let me know if this is impossible.  Thanks Peter!

 -- xavier

Peter,
  I believe I have figured it out. Basically, it requires the following code:


Apparently, the Header is not linked to it's parent's Datacontext.  This is a good find.

Hello Xavier,

This is expected behavior of the RadTabItem. When you create the TabItems programatically, the usual approach requieres setting Header and Content. The DataContext actually is needless in your last code if you set the both Content and the Header like so:
Feel free to ask if you need more info.

Kind regards,
Petar Mladenov
the Telerik team