Determaining isselected inside a data template

Anyone have any insight on how to determine INSIDE a listboxitem's datatemplete wehether or not it is selected (whether the containing listboxitem IsSelected).  


Answer this question

Determaining isselected inside a data template

  • dotAge

    Thanks, Stephen!

    I solved my issue of conditional checkmark using a DataTrigger within a named Style.

    I was looking at this problem all wrong, from a non-XAML point of view. Once I saw your example of the DataTrigger on the parent's IsSelected property, I realized I could put a DataTrigger in a named style for a polygon and set the Visibility to "Visible" or "Hidden" based on the value of the IsSelected member of the parent of the parent data template, like this:

    <Style x:Key="SelectedItemCheckMarkStyle" TargetType="{x:Type Polygon}">
      <Setter Property="Stroke" Value="Black"/>
      <Setter Property="Fill" Value="Black"/>
      <Setter Property="VerticalAlignment" Value="Center"/>
      <Setter Property="Points" Value="3,3 7,3 5,5.5"/>
      <Style.Triggers>
        <DataTrigger Binding="{Binding Path=IsSelected, RelativeSource=/TemplatedParent/TemplatedParent}" Value="True">
          <Setter Property="Visibility" Value="Visible"/>
        </DataTrigger>
        <DataTrigger Binding="{Binding Path=IsSelected, RelativeSource=/TemplatedParent/TemplatedParent}" Value="False">
          <Setter Property="Visibility" Value="Hidden"/>
        </DataTrigger>
      </Style.Triggers>
    </Style>

    I admit I'm still confused about the Binding Path syntax, and would like to find some documentation that explains all the possible values that can be specified in this way.

    Thanks!

     


  • Drummos

    I had to add an extra /Templated parent to get the effect I wanted.

    I'm including the entire template for referrence. I do have anothe rquestion though. While the setter in the style works, the animation fails to begin.

      <!--Data Templates-->
          <DataTemplate   x:Key="TVFeedTemplate">
           
            <StackPanel x:Name="HolderPanel">
              <StackPanel.RenderTransform>
                <ScaleTransform x:Name="MainTransform" ScaleX="1" ScaleY="1"></ScaleTransform>
              </StackPanel.RenderTransform>

              <!-- This is the Media element playing the video::::Working-->
              <MediaElement Volume="0" x:Name="VideoPlayer" Height="100" Source="{Binding Source}">
                <MediaElement.RenderTransform>
                  <ScaleTransform x:Name="ScaleTrans" ScaleX="1" ScaleY="1">

                  </ScaleTransform>
                </MediaElement.RenderTransform>
              </MediaElement>
              <!--This is the Title of the "Feed"::::Working-->
              <TextBlock Text="{Binding Title}"></TextBlock>
              <!--This is the "Control Panel" for the feed, only the selected feed should have a control panel.
              Not working: The detection of the selected element is malfunctioning. REally its the setter im having problems with.
              -->
              <TextBlock Text="{Binding Path=IsSelected, RelativeSource=/TemplatedParent/TemplatedParent}"/>
              <StackPanel x:Name="ControlPanel">
                <StackPanel.Style>
                  <Style>
                    <Style.Triggers>
                     <DataTrigger  Binding="{Binding Path=IsSelected, RelativeSource=/TemplatedParent/TemplatedParent}" Value="True">
                        <DataTrigger.EnterActions>
                          <BeginStoryboard>
                            <Storyboard>
                              <DoubleAnimation Storyboard.TargetName="ControlPanel" Storyboard.TargetProperty="Opacity" From ="0" To="1" Duration="0:0:1" />
                            </Storyboard>
                          </BeginStoryboard>
                        </DataTrigger.EnterActions>
                       <Setter Property="Control.Opacity" Value=".5"/>
                      </DataTrigger>
                    </Style.Triggers>
                  </Style>
                </StackPanel.Style>
             
               
                <Button x:Name="Mute" Content="Mute"/>
                <Slider Value="{Binding ElementName=VideoPlayer, Path=Volume}" x:Name="VolumeControl" Minimum="0" Maximum="1" ></Slider>

              </StackPanel>


            </StackPanel>
           
          </DataTemplate>

  • sap22

    Stephen: i think the animation is not starting because you are trying to operate on an item named "ControlPanel" under the logical tree of the stack panel named "ControlPanel", and it can't find the name because it's not looking at the root.

    try moving your DataTrigger out of the style and into a <DataTemplate.Triggers> section.  it might require you to remove one of the /TemplatedParent instances in your binding syntax because you'll be up one level in the logical tree.  when you move it up into the DataTemplate, it should be able to resolve the "ControlPanel" name.


  • bambag

    I have a need to do something similar, but do not understand your suggested Binding Path, how that would work.

    I have a ComboBox with a DataTemplate and within the template I want to draw a checkmark next to the selected item in the combobox drop list as shown in this example (note the checkmark to the left of the selection of "Repairs     Job"):

    http://www.ejthomas.com/images/example.jpg

    I would like to add a conditional Polygon element (that draws the checkmark) as the first element of a horizontal StackPanel. This element should draw only if the item is the currently selected item in the drop list.

    Can you elaborate on your suggestion above on how I would actually code that in XAML Here is my XAML where CustomerList is an instance of ObservableCollection and DisplayColumn1 and DisplayColumn2 are methods on the enclosed CustomerItem class that return formatted item text that goes in the drop list.

    </Window.Resources>
      ...
      <local:CustomerList x:Key="CustomerList" />
    </Window.Resources>

    <Grid DataContext="{StaticResource CustomerList}">
      ...
      <ComboBox Name="customerListComboBox" ItemsSource="{Binding}"
                IsSynchronizedWithCurrentItem="True"
                SelectedIndex="0" Width="200">
        <ComboBox.ItemTemplate>
          <DataTemplate>
            <StackPanel Orientation="Horizontal" Margin="10, 0">
              <TextBlock Text="{Binding Path=DisplayColumn1}" Width="250"/>
              <TextBlock Text="{Binding Path=DisplayColumn2}"/>
            </StackPanel>
          </DataTemplate>
        </ComboBox.ItemTemplate>
      </ComboBox>
    </Grid>

    So, to restate my question: is there some way to make a XAML element conditional based on if the item being rendered is the currently selected item

    Thanks for any suggestions!


  • scubabeme

    have you tried 

    {Binding Path=IsSelected,RelativeSource=/TemplatedParent}


  • Determaining isselected inside a data template