Note that there are some explanatory texts on larger screens.

plurals
  1. POUse Binding in a Listbox Itemtemplate for a custom control
    text
    copied!<p>I am trying to do a custom datepicker control. It's based on a Textbox where I can select diffrent types of dates. So when I get focus on the Textbox then I create a Popup window that has a listbox where the following items is added.</p> <pre><code>Today Last 7 days Month to date Year to date The previous Month Specific date All dates before All dates after Date range </code></pre> <p>This works fine, if I hardcode in all the items. Now I want to extend this list so I use the Listbox.ItemTemplate instead so I can customize the listboxitem. I have creates a DateChoice-class that I create a list of and bind this to the listboxs itemssource.</p> <pre><code>internal class DateChoiceItem { internal DateChoiceEnum DateChoiceEnum { get; set; } internal string DateChoiceName { get; set; } internal bool ExtendedCalender { get; set; } } this.DateChoice.ItemsSource = new ObservableCollection&lt;DateChoiceItem&gt;() { new DateChoiceItem(){DateChoiceName = "Today", DateChoiceEnum = DateChoiceEnum.Today}, new DateChoiceItem(){DateChoiceName = "Last 7 days", DateChoiceEnum = DateChoiceEnum.Last7Days}, new DateChoiceItem(){DateChoiceName = "Month to date", DateChoiceEnum = DateChoiceEnum.MonthToDate}, new DateChoiceItem(){DateChoiceName = "Year to date", DateChoiceEnum = DateChoiceEnum.YearToDate}, new DateChoiceItem(){DateChoiceName = "The previous Month", DateChoiceEnum = DateChoiceEnum.PreviousMonth}, new DateChoiceItem(){DateChoiceName = "Specific date", DateChoiceEnum = DateChoiceEnum.SpecificDate, ExtendedCalender = true}, new DateChoiceItem(){DateChoiceName = "All dates before", DateChoiceEnum = DateChoiceEnum.AllDatesBefore, ExtendedCalender = true}, new DateChoiceItem(){DateChoiceName = "All dates after", DateChoiceEnum = DateChoiceEnum.AllDatesAfter, ExtendedCalender = true}, new DateChoiceItem(){DateChoiceName = "Date range", DateChoiceEnum = DateChoiceEnum.DateRange, ExtendedCalender = true } }; </code></pre> <p>Since this is a customcontrol I have put the xaml-code in a resourcefiles and it looks like this:</p> <pre><code> &lt;ListBox x:Name="PART_DateChoice" Grid.Column="0" Grid.Row="0"&gt; &lt;ListBox.ItemTemplate&gt; &lt;DataTemplate&gt; &lt;Grid&gt; &lt;Grid.ColumnDefinitions&gt; &lt;ColumnDefinition Width="*"/&gt; &lt;ColumnDefinition Width="5"/&gt; &lt;ColumnDefinition Width="16"/&gt; &lt;/Grid.ColumnDefinitions&gt; &lt;TextBlock x:Name="name" Grid.Column="0" Text="{Binding Path=DateChoiceName}"/&gt; &lt;TextBlock Grid.Column="2" Text="&gt;" Visibility="{Binding Path=ExtendedCalender, Converter={StaticResource BooleanToVisibilityConverter}}"/&gt; &lt;/Grid&gt; &lt;/DataTemplate&gt; &lt;/ListBox.ItemTemplate&gt; &lt;/ListBox&gt; </code></pre> <p>So I want it to look like this</p> <pre><code>Today Last 7 days Month to date Year to date The previous Month Specific date &gt; All dates before &gt; All dates after &gt; Date range &gt; </code></pre> <p>Here I use 2 textboxes to show the name and even if it's possible to extend the listboxitem so I can show some calenders if I need to select 1 or 2 specific dates. But All I get is a listbox filled with '>'. Like this</p> <pre><code> &gt; &gt; &gt; &gt; &gt; &gt; &gt; &gt; &gt; </code></pre> <p>It looks like the Text="{Binding Path=DateChoiceName}" isn't working. What am I missing here? </p> <p>Now I can solve this by doing a lot of hardcoding, but I prefere to bind my list to the listbox and get the Binding working!!</p> <p>Have anybody has the same problem?</p> <p>Thanks in advance.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload