In WPF datatemplate, What I missed? data doesn't show correctly

Question

I use a class 'SecondCondition' as basic data unit. It have 3 public property. ConditionColor, ConditionName, ConditionID
ObservableCollection 'SearchConditionList' is used as data list.
I made a datatemplate Binding like below.

    < Model:SearchCondition x:Key="SearchCondition" />  
    < DataTemplate x:Key="ConditionSelector">
        < StackPanel >
            < xctk:ColorPicker  x:Name="ConditionColorPicker" 
                                SelectedColor="{Binding Path=ConditionColor, 
                                Mode=TwoWay}">  
            < /xctk:ColorPicker>  
            < CheckBox x:Name="ConditionCheckbox" 
                       Content="{Binding Path=ConditionName,  
                       Mode=TwoWay}" />  
        < /StackPanel>

And I used the datatemplate at my Listbox.

    < ListBox    ItemsSource="{Binding Path=SearchConditionList}"
                ItemTemplate="{StaticResource ConditionSelector}">  
    < /ListBox>

As result, I get number of blank template as much as List of items. But it doesn't show properties like color and name. What I used as reference article use almost same and the code works, but mine is not. How can I solve this?

below is my reference. https://docs.microsoft.com/ko-kr/dotnet/framework/wpf/data/data-templating-overview

Thank you.

P.S When I change codes like below, constant strings are shown very well but Bound value are not.

                    <StackPanel DataContext="{Binding Path=SearchConditionList}">
                        <ListBox    ItemsSource="{Binding}"
                                    >
                            <ListBox.ItemTemplate>
                                <DataTemplate>
                                    <TextBlock>
                                        <TextBlock Text="Why this doens't show bound value?"/>
                                        <TextBlock Text=" : " />
                                        <TextBlock Text="{Binding Path=ConditionName}"/>
                                    </TextBlock>
                                </DataTemplate>
                            </ListBox.ItemTemplate>
                        </ListBox>
                    </StackPanel>

result is like below.

Do you have any Errors in Output Window while in Debug Mode? — Lupu Silviu
Dear Lupu. No. I don't get any error message. I think there is mistake at binding to item's property. Because When I changed, constant string was shown normally but just bound values are not. I'll post them at main article — 박영환
Why do you set the DataContext manually? And make sure that the ConditionName is not empty or null. — XAMlMAX
How is SecondCondition defined and how do you set its properties? Your code sample doesn't tell. — mm8

Eugene Kim Eugene Kim · Accepted Answer · 2019-07-09T12:08:03

Here is my implementation based on your source code.

Model

public class SearchCondition
{
    public Color ConditionColor { get; set; }
    public string ConditionName { get; set; }
    public string ConditionID { get; set; }

    public SearchCondition(Color color, string name, string id)
    {
        ConditionColor = color;
        ConditionName = name;
        ConditionID = id;
    }
}

ViewModel

public class ViewModel
{
    public ObservableCollection<SearchCondition> SearchConditionList { get; set; }

    public ViewModel()
    {
        SearchConditionList = new ObservableCollection<SearchCondition>();

        SearchConditionList.Add(new SearchCondition(Colors.Red, "Red", "001"));
        SearchConditionList.Add(new SearchCondition(Colors.Green, "Green", "002"));
    }
}

The ViewModel is bound to the view in the code-behind.

public MainWindow()
    {
        InitializeComponent();

        DataContext = new ViewModel();
    }

Okay.. now this is the XAML.

<Window x:Class="DataBindingTest.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
    Title="MainWindow" Height="450" Width="800">
<Grid>
    <Grid.Resources>
        <DataTemplate x:Key="ConditionSelector">
            <StackPanel Orientation="Horizontal">
                <xctk:ColorPicker x:Name="ConditionColorPicker" SelectedColor="{Binding Path=ConditionColor, Mode=TwoWay}" />
                <CheckBox x:Name="ConditionCheckbox" Content="{Binding Path=ConditionName, Mode=TwoWay}" />
            </StackPanel>
        </DataTemplate>
    </Grid.Resources>

    <ListBox ItemsSource="{Binding Path=SearchConditionList}" ItemTemplate="{StaticResource ConditionSelector}" />
</Grid>

Screenshot

Honestly, I can't figure out where the problem is unless I see your full source code. Visual Studio doesn't spit out exceptions explicitly. But you should be able to see the binding error in the output window. So you can find the clue.

Please compare your implementation with mine.

In WPF datatemplate, What I missed? data doesn't show correctly

1 Answers