CODEWITHSUNDEEP
wpfxamldatagrid
Frank
Frank

Reputation: 713

Binding textboxes inside a usercontrol to datagrid

Is the way that I'm binding the UserControl to the DataGrid correct? In my MainWindow I have a datagrid (code below):

    <DataGrid x:Name="MusicListGrid" ItemsSource="{Binding MusicList}" AutoGenerateColumns="False" IsSynchronizedWithCurrentItem="True">
        <DataGrid.Columns>
            <DataGridTextColumn Header="Artist" Binding="{Binding Artist,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" />
            <DataGridTextColumn Header="Album" Binding="{Binding Album,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" />
            <DataGridTextColumn Header="Track" Binding="{Binding Track,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" />
        </DataGrid.Columns>
    </DataGrid>

The usercontrol inside my MainWindow, that I'm binding to the selected item of the datagrid:

DataTemplate(in MainWindow):

<Window.Resources>
    <DataTemplate x:Key="MusicDetailListTemplate"  >
        <v:MusicDetailView DataContext="{Binding ElementName=MusicListGrid,Path=SelectedItem}" />
    </DataTemplate>
</Window.Resources>

ContentControl(in MainWindow):

<ContentControl x:Name="musicDetail" Content="{Binding}" ContentTemplate="{StaticResource MusicDetailListTemplate}" Grid.Column="1" />

The textboxes inside my UserControl looks like this:

    <TextBox Grid.Column="1" Grid.Row="0" Width="200" Margin="10,5" Text="{Binding Artist,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" />
    <TextBox Grid.Column="1" Grid.Row="1" Width="200" Margin="10,5" Text="{Binding Album,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" />
    <TextBox Grid.Column="1" Grid.Row="2" Width="200" Margin="10,5" Text="{Binding Track,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" />

This works, but I'm not sure if I'm doing the correct way? Can I also bind a textbox to the datagrid like this:

<TextBox Grid.Column="1" Grid.Row="3" Text="{Binding Path=MusicListGrid.Artist.SelectedItem, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type DataGrid}}}"  />

The data in the datagrid is an ObservableCollection<Music> (music is my model).

If I replace my UserControl with a tabcontrol, should I have the tabcontrol be a separate view or just be part of MainWindow? And have the content of the tabcontrol be separate views? I was thinking of having the datagrid and a tabcontrol with 2 tabs, one for editing and the other for displaying (to look more presentable).

Sorry if these are very basic questions, I just want to be on the right path.

Upvotes: 0

Views: 555

Answers (1)

Sheridan
Sheridan

Reputation: 69979

It is more common to set the Content property of the ContentControl element to the data object:

<ContentControl x:Name="musicDetail" Content="{Binding ElementName=MusicListGrid, 
    Path=SelectedItem}" ContentTemplate="{StaticResource MusicDetailListTemplate}" />

The DataContext defines what the data of the relevant type should look like in the UI, so you shouldn't really set the DataContext there... it is automatically set to the relevant data object instance... it should look more like this (where Prefix is the XML Namespace Prefix that you set up for your project and YourClass is the type of object in the DataGrid):

<Window.Resources>
    <DataTemplate x:Key="MusicDetailListTemplate" DataType="{x:Type Prefix:YourClass}">
        <v:MusicDetailView DataContext="{Binding}" />
    </DataTemplate>
</Window.Resources>

Upvotes: 2

Related Questions