ComboBox inside TileView does not bind ItemSource

4 posts, 0 answers
  1. Ivan
    Ivan avatar
    7 posts
    Member since:
    Mar 2010

    Posted 24 Mar 2010 Link to this post

    Hi,

    I have a RadComboBox inside the TileView.

    The TileView's ItemSource is bound to a collection of Objects set in code.

    The ItemSource of the TileView is also bound to different collection of objects. However the RadComboBox does not access the collection or display the items.

    If the same ComboBox tag is moved outside the TileView, it works fine.

    Can you provide some guidance as to how this can be resolved?

    I am using the 2010 Q1 release controls.



    - Ivan.
  2. Tihomir Petkov
    Admin
    Tihomir Petkov avatar
    576 posts

    Posted 25 Mar 2010 Link to this post

    Hello Ivan,

    I am not sure I understand this part: "The ItemSource of the TileView is also bound to different collection of objects". I will be glad to help, but I will need you to either send me a sample project that demonstrates the problem or at least provide some code snippets that illustrate the ItemsSource collection, the types of the business objects you use, and the way you data bind the TileView and combobox.

    All the best,
    Tihomir Petkov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  3. DevCraft banner
  4. Ivan
    Ivan avatar
    7 posts
    Member since:
    Mar 2010

    Posted 25 Mar 2010 Link to this post

    Hi Tihomir,

    Here is the code snippet
    //////////////////////////////// MainPage.xaml

    <

     

    UserControl x:Class="TestTileView.MainPage"

     

     

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

     

     

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

     

     

    xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Navigation"

     

     

    xmlns:Controls="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls"

     

     

    xmlns:telerikComboBox="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Input"

     

     

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

     

     

    mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480">

     

     

     

    <Grid x:Name="LayoutRoot" Background="White" ScrollViewer.VerticalScrollBarVisibility="Visible">

     

     

     

    <Grid.RowDefinitions>

     

     

     

    <RowDefinition Height="Auto" />

     

     

     

    <RowDefinition Height="Auto" />

     

     

     

    <RowDefinition Height="Auto" />

     

     

     

    <RowDefinition Height="Auto" />

     

     

     

    </Grid.RowDefinitions>

     

     

     

    <StackPanel Orientation="Vertical" HorizontalAlignment="Left" Grid.Row="1" Grid.Column="1">

     

     

     

    <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" VerticalScrollBarVisibility="Auto" Padding="0" BorderThickness="0" >

     

     

     

    <Border Margin="10" HorizontalAlignment="Center" VerticalAlignment="Center">

     

     

     

    <Grid Background="White" ScrollViewer.VerticalScrollBarVisibility="Visible">

     

     

     

    <Grid.RowDefinitions>

     

     

     

    <RowDefinition Height="Auto" />

     

     

     

    <RowDefinition Height="Auto" />

     

     

     

    <RowDefinition Height="Auto" />

     

     

     

    </Grid.RowDefinitions>

     

     

     

    <telerik:RadTileView x:Name="ProductTileView" Width="600" Height="500" Grid.Row="1" Grid.Column="1" MinimizedColumnWidth="197" ItemsSource="{Binding ProductList}" >

     

     

     

    <telerik:RadTileView.ItemTemplate>

     

     

     

    <DataTemplate>

     

     

     

    <TextBlock Text="{Binding Name}" Grid.Row="1" Grid.Column="1" />

     

     

     

    </DataTemplate>

     

     

     

    </telerik:RadTileView.ItemTemplate>

     

     

     

    <telerik:RadTileView.ContentTemplate>

     

     

     

    <DataTemplate>

     

     

     

    <Controls:RadFluidContentControl SmallToNormalThreshold="100, 100" NormalToSmallThreshold="99, 99" NormalToLargeThreshold="300, 300" LargeToNormalThreshold="299, 299">

     

     

     

    <Controls:RadFluidContentControl.SmallContent>

     

     

     

    <Border Width="100" Height="30">

     

     

     

    <TextBlock Text="{Binding Name}" />

     

     

     

    </Border>

     

     

     

    </Controls:RadFluidContentControl.SmallContent>

     

     

     

    <Controls:RadFluidContentControl.Content>

     

     

     

    <Image Source="{Binding Name}"

     

     

    HorizontalAlignment="Left" Margin="13 13 0 0" Height="130"

     

     

    Width="279" VerticalAlignment="Top" />

     

     

     

    </Controls:RadFluidContentControl.Content>

     

     

     

    <Controls:RadFluidContentControl.LargeContent>

     

     

     

    <Grid Width="400" Height="400" >

     

     

     

    <Grid.ColumnDefinitions>

     

     

     

    <ColumnDefinition Width="Auto" />

     

     

     

    <ColumnDefinition Width="200" />

     

     

     

    <ColumnDefinition Width="200" />

     

     

     

    <ColumnDefinition Width="200" />

     

     

     

    </Grid.ColumnDefinitions>

     

     

     

    <Grid.RowDefinitions>

     

     

     

    <RowDefinition Height="Auto" />

     

     

     

    <RowDefinition Height="Auto" />

     

     

     

    <RowDefinition Height="Auto" />

     

     

     

    <RowDefinition Height="Auto" />

     

     

     

    </Grid.RowDefinitions>

     

     

     

    <TextBlock Text="Does Not Work Here" Grid.Row="1" Grid.Column="1" />

     

     

     

    <telerikComboBox:RadComboBox Grid.Row="2" Grid.Column="1" SelectedItem="{Binding Path=ProductType, Mode=TwoWay, ValidatesOnExceptions=True}" DisplayMemberPath="Name" ItemsSource="{Binding Path=ProductTypes}" Margin="5 5 5 5"></telerikComboBox:RadComboBox>

     

     

     

    </Grid>

     

     

     

    </Controls:RadFluidContentControl.LargeContent>

     

     

     

    </Controls:RadFluidContentControl>

     

     

     

    </DataTemplate>

     

     

     

    </telerik:RadTileView.ContentTemplate>

     

     

     

    </telerik:RadTileView>

     

     

     

    </Grid>

     

     

     

    </Border>

     

     

     

    </ScrollViewer>

     

     

     

    </StackPanel>

     

     

     

    <TextBlock HorizontalAlignment="Left" Text="Works Here" Width="100" Grid.Row="2" Grid.Column="1" />

     

     

     

    <telerikComboBox:RadComboBox HorizontalAlignment="Left" Grid.Row="3" Grid.Column="1" Width="100" DisplayMemberPath="Name" ItemsSource="{Binding Path=ProductTypes}" Margin="5 5 5 5"></telerikComboBox:RadComboBox>

     

     

     

    </Grid>

     

    </

     

    UserControl>

     



    ////////////////////////// MainPage.xaml.cs

    using

     

    System.Windows.Controls;

     

    namespace

     

    TestTileView

     

    {

     

    public partial class MainPage : UserControl

     

    {

     

    public DataGenerator dataGenerator = new DataGenerator();

     

     

    public MainPage()

     

    {

    DataContext = dataGenerator;

    InitializeComponent();

    }

    }

    }


    //////////////////////////////////// DataGenerator

    using

     

    System.Collections.ObjectModel;

     

    using

     

    System.Collections.Generic;

     

    namespace

     

    TestTileView

     

    {

     

    public class DataGenerator

     

    {

     

    public List<ProductType> ProductTypes{ get; set; }

     

     

    public DataGenerator()

     

    {

    ProductTypes =

    new List<ProductType>();

     

    ProductTypes.Add(

    new ProductType { Name = "Product Type 1" });

     

    ProductTypes.Add(

    new ProductType { Name = "Product Type 2" });

     

    ProductTypes.Add(

    new ProductType { Name = "Product Type 3" });

     

    ProductList = GetData();

    }

     

    private ObservableCollection<Product> GetData()

     

    {

     

    var products = new ObservableCollection<Product>();

     

    products.Add(

    new Product { Name = "Test Product 1", ProductType = ProductTypes[0] });

     

    products.Add(

    new Product { Name = "Test Product 2", ProductType = ProductTypes[1] });

     

    products.Add(

    new Product { Name = "Test Product 3", ProductType = ProductTypes[2] });

     

     

    return products;

     

    }

     

    public ObservableCollection<Product> ProductList { get; set; }

     

    }

     

    public class Product

     

    {

     

    public string Name { get; set; }

     

     

    public ProductType ProductType { get; set; }

     

    }

     

    public class ProductType

     

    {

     

    public string Name { get; set; }

     

    }

    }



    Regards,

    Ivan.

  5. Tihomir Petkov
    Admin
    Tihomir Petkov avatar
    576 posts

    Posted 26 Mar 2010 Link to this post

    Hello Ivan,

    Thank you for the code you pasted - it made things clearer. Judging from the code, the problem is not in the TileView or ComboBox controls, but rather in the data binding you've specified. The DataConext within the DataTemplate you've created for the content of TileViewItems is an instance of the Product class, because you have set the ItemsSource of the TileView to the ProductList collection. Because of this, you cannot bind the ComboBox.ItemsSource property to the ProductTypes collection, because it is not part of any given Product instance. So the problem is one of scopes. What you can do in your case is either add the ProductTypes collection to each Product object, or use a converter that will return the ProductTypes collection (getting it from somewhere outside your Product object).

    I hope my suggestion will help make things clearer. Let me know if you have further questions.

    Best wishes,
    Tihomir Petkov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Back to Top