none
Create user control fields based on bound properties

    Question

  • Hello,

    I am creating a user control that I would like to be able to generate the form entry fields based on what custom data object the form is bound to. Basically, I have a drop-down box that allows the user to pick what type of data object they are working with (user, address, etc.) That choice will bind the user control to the related data object. No big deal there. I am stuck, however, on how to generate the form fields based on the properties of the object. I feel like I have seen examples of this in WPF but am not able to find them now. All form fields will be simple label, textbox combinations in a stackpanel.

    I know more detial will probably be required. Let me know what specifically you would like to know. Any help of direction is greatly appreciated.

    Best,

    Ryan

    Sunday, April 10, 2011 4:43 PM

Answers

  • You may use ContentControl in your UserControl. It could be something below

     <Grid>

             <ContentControl />

      </Grid>

     

    //Bind the UserControl DataContext to your DataObject. Say in the UserControl Constructor

    this.DataContext = new Institution();

     

    //WPF framework takes care of finding your datatemplate from the resource.

     

     


    Ajosh Jose
    Monday, April 11, 2011 6:19 PM
  • Hi Ryan,

    I think you can create different data templates for each type of data object. You can use DateTemplate.DataType property to define which type this template targets, so those data templates will be picked automatically if you don't specify a x:Key for them.

    See Data Templating Overview ,especially this section, for more information. 

    If you still have any questions or concerns about this issue, please feel free to let me know.


    Min Zhu [MSFT]
    MSDN Community Support | Feedback to us
    Get or Request Code Sample from Microsoft
    Please remember to mark the replies as answers if they help and unmark them if they provide no help.

    Monday, April 11, 2011 2:54 AM
    Moderator
  • Hi rkbrown,

    As Jose suggested, you can use ContentControl to represent the data.

    Here is a simple sample.

        <StackPanel>
          <ContentControl Name="ContentHost" Content="UNSET">
            <ContentControl.Resources>
              <DataTemplate DataType="{x:Type local:Student}">
                <TextBlock Text="{Binding StudentID}" Background="Gray" Foreground="Blue"/>
              </DataTemplate>
              <DataTemplate DataType="{x:Type local:Teacher}">
                <TextBlock Text="{Binding Name}" Background="Yellow" Foreground="Black"/>
              </DataTemplate>
            </ContentControl.Resources>
          </ContentControl>
          <Button Content="Student" Click="StudentButton_Click"/>
          <Button Content="Teacher" Click="TeacherButton_Click"/>
        </StackPanel>
    
        private void StudentButton_Click(object sender, RoutedEventArgs e)
        {
          Student student = new Student() { StudentID = 123 };
          ContentHost.Content = student;
        }
    
        private void TeacherButton_Click(object sender, RoutedEventArgs e)
        {
          Teacher teacher = new Teacher() {Name="Maria" };
          ContentHost.Content = teacher;
        }
    

     

      class Student
      {
        public int StudentID { get; set; }
      }
    
      class Teacher
      {
        public string Name { get; set; }
      }
    

    You can also data bind the ContentControl's Content property.

    Hope this helps.


    Min Zhu [MSFT]
    MSDN Community Support | Feedback to us
    Get or Request Code Sample from Microsoft
    Please remember to mark the replies as answers if they help and unmark them if they provide no help.

    • Marked as answer by rkbrown Tuesday, April 12, 2011 2:15 PM
    Tuesday, April 12, 2011 3:26 AM
    Moderator

All replies

  • I think you are looking for data form control. If so the below link will have the details

    http://wpfdataform.codeplex.com/


    Ajosh Jose
    Sunday, April 10, 2011 8:43 PM
  • Hi Ryan,

    I think you can create different data templates for each type of data object. You can use DateTemplate.DataType property to define which type this template targets, so those data templates will be picked automatically if you don't specify a x:Key for them.

    See Data Templating Overview ,especially this section, for more information. 

    If you still have any questions or concerns about this issue, please feel free to let me know.


    Min Zhu [MSFT]
    MSDN Community Support | Feedback to us
    Get or Request Code Sample from Microsoft
    Please remember to mark the replies as answers if they help and unmark them if they provide no help.

    Monday, April 11, 2011 2:54 AM
    Moderator
  • Min,

    This does look like it is heading down the correct path to what I am looking for. However, I guess I am still at a loss of how to display, or render my data. I created a ResourceDictionary with the following entry:

     

        <DataTemplate DataType="{x:Type model:Institution}">

            <StackPanel HorizontalAlignment="Left" Name="stkPnlMain" VerticalAlignment="Top" Width="276" Orientation="Vertical">

                <StackPanel Height="35" HorizontalAlignment="Left" Margin="12,23,0,0" Name="stkPnlName" VerticalAlignment="Top" Width="276" Orientation="Horizontal">

                    <Label Content="Name:" Height="28" Name="lblName" Width="68" />

                    <TextBox Height="23" Name="txtName" Width="200" Text="{Binding Path=Institution.Name, Mode=TwoWay}" />

                </StackPanel>

                <StackPanel Height="35" HorizontalAlignment="Left" Margin="12,23,0,0" Name="stkPnlDescription" VerticalAlignment="Top" Width="276" Orientation="Horizontal">

                    <Label Content="Description:" Height="28" Name="lblDescription" Width="68" />

                    <TextBox Height="23" Name="txtDescription" Width="200" Text="{Binding Path=Institution.Description, Mode=TwoWay}" />

                </StackPanel>

            </StackPanel>

        </DataTemplate>

    I guess I'm not sure how to use this data template to display on my user control. I am a WPF newbie and this XAML stuff seems very cool but is, for some reason, leaving me at a loss.

    Thanks!

    Monday, April 11, 2011 6:09 PM
  • You may use ContentControl in your UserControl. It could be something below

     <Grid>

             <ContentControl />

      </Grid>

     

    //Bind the UserControl DataContext to your DataObject. Say in the UserControl Constructor

    this.DataContext = new Institution();

     

    //WPF framework takes care of finding your datatemplate from the resource.

     

     


    Ajosh Jose
    Monday, April 11, 2011 6:19 PM
  • Hi rkbrown,

    As Jose suggested, you can use ContentControl to represent the data.

    Here is a simple sample.

        <StackPanel>
          <ContentControl Name="ContentHost" Content="UNSET">
            <ContentControl.Resources>
              <DataTemplate DataType="{x:Type local:Student}">
                <TextBlock Text="{Binding StudentID}" Background="Gray" Foreground="Blue"/>
              </DataTemplate>
              <DataTemplate DataType="{x:Type local:Teacher}">
                <TextBlock Text="{Binding Name}" Background="Yellow" Foreground="Black"/>
              </DataTemplate>
            </ContentControl.Resources>
          </ContentControl>
          <Button Content="Student" Click="StudentButton_Click"/>
          <Button Content="Teacher" Click="TeacherButton_Click"/>
        </StackPanel>
    
        private void StudentButton_Click(object sender, RoutedEventArgs e)
        {
          Student student = new Student() { StudentID = 123 };
          ContentHost.Content = student;
        }
    
        private void TeacherButton_Click(object sender, RoutedEventArgs e)
        {
          Teacher teacher = new Teacher() {Name="Maria" };
          ContentHost.Content = teacher;
        }
    

     

      class Student
      {
        public int StudentID { get; set; }
      }
    
      class Teacher
      {
        public string Name { get; set; }
      }
    

    You can also data bind the ContentControl's Content property.

    Hope this helps.


    Min Zhu [MSFT]
    MSDN Community Support | Feedback to us
    Get or Request Code Sample from Microsoft
    Please remember to mark the replies as answers if they help and unmark them if they provide no help.

    • Marked as answer by rkbrown Tuesday, April 12, 2011 2:15 PM
    Tuesday, April 12, 2011 3:26 AM
    Moderator
  • Excellent Min and Jose! Now, I have this working in code-behind. I need to figure out how to bind my combobox's SelectionChanged event to my ViewModel. I will start a different thread.

    Thank you!!

    Ryan

    Tuesday, April 12, 2011 2:14 PM