locked
Dynamically load Usercontrol RRS feed

  • Question

  • Hi,

    Using MVVM, how do I load a UserControl dynamically with all the textboxes populated with values bind to properties in viewmodel.

    I have designed a Usercontrol and used binding in the textboxes to the properties in viewmodel (using sample data in Blend). Now in the code behind for the page, I would like to iterate though items in collection and generate number of usercontrol but bound to individual item in a collection.

    Thanks in advance.

    Friday, October 14, 2011 3:53 AM

Answers

  • Now in the code behind for the page, I would like to iterate though items in collection and generate number of usercontrol but bound to individual item in a collection.

    For this requirement you need to take an itemscontrol and set the itemtemplate as the usercontrol as like this

    <ItemsControl ItemeSource="{Binding Collectin}">

    <ItemsControl.ItemTemplate>

    <local: UC /> --- Your User Control should Be Here

    </ItemsControl.ItemTemplate>

    </ItemsControl>

    The Number of User Controls Will Be Created Automatically no user initialization is Requird..

    If The Collection is ObservableCollection Then you can get the notifications.. other wise you can manually set the itemssource of the itemscontrol when the data is available.. 

    Monday, October 17, 2011 1:15 AM

All replies

  • Hi,

    Here PersonContactMaintenanceChildWindow call PersonDetailUserControl:

    namespace IntCoRe
    {
        public partial class PersonContactMaintenanceChildWindow : ChildWindow
        {
            public PersonContactMaintenanceChildWindow(int businessEntityID, int personCategoryId, string categoryName)
            {
                InitializeComponent();
                _BusinessEntityID = businessEntityID;
                _PersonCategoryID = personCategoryId;
                _CategoryName = categoryName;
                Loaded += new RoutedEventHandler(PersonContactMaintenanceChildWindow_Loaded);
            }
     
            void PersonContactMaintenanceChildWindow_Loaded(object sender, RoutedEventArgs e)
            {
                personContactBorder.Child = new PersonDetailUserControl(_BusinessEntityID, _PersonCategoryID, _CategoryName);
            }
     
            private int _BusinessEntityID;
            private int _PersonCategoryID;
            private string _CategoryName;
     
            private void OKButton_Click(object sender, RoutedEventArgs e)
            {
                this.DialogResult = true;
            }
     
            private void CancelButton_Click(object sender, RoutedEventArgs e)
            {
                this.DialogResult = false;
            }
        }
    }
    
    
    
    
    AND 
    
    
    namespace IntCoRe
    {
    	public partial class PersonDetailUserControl : UserControl
    	{
            public PersonDetailUserControl(int businessEntityID, int personCategoryId, string categoryName)
    		{
    			InitializeComponent();
                _BusinessEntityID = businessEntityID;
                _PersonCategoryID = personCategoryId;
                _CategoryName = categoryName;
                dataHasLoadedCheckBox.IsChecked = true;
                businessEntityIDText.Text = string.Empty;
                RegisterMessages();
            }
     
            private int _BusinessEntityID;
            private int _PersonCategoryID;
            private string _CategoryName;
            
            private void RegisterMessages()
            {
                Messenger.Default.Register<SavePersonDialogMessage>(this, OnSavePersonDialogMessageReceived);
            }
            private void OnSavePersonDialogMessageReceived(SavePersonDialogMessage msg)
            {
                MessageBox.Show(msg.Content, msg.Caption, msg.Button);
            }
     
            private void LayoutRoot_Loaded(object sender, System.Windows.RoutedEventArgs e)
            {
                dataHasLoadedCheckBox.IsChecked = false;
                personCategoryID.Text = _PersonCategoryID.ToString();
                businessEntityIDText.Text = _BusinessEntityID.ToString();
                personCategory.Text = _CategoryName;
            }
        }
    }
    
    
    Both using one ViewModel. ViewModel can be specify at  PersonContactCHildWindow only.
    
    


    Friday, October 14, 2011 5:19 AM
  • Now in the code behind for the page, I would like to iterate though items in collection and generate number of usercontrol but bound to individual item in a collection.

    For this requirement you need to take an itemscontrol and set the itemtemplate as the usercontrol as like this

    <ItemsControl ItemeSource="{Binding Collectin}">

    <ItemsControl.ItemTemplate>

    <local: UC /> --- Your User Control should Be Here

    </ItemsControl.ItemTemplate>

    </ItemsControl>

    The Number of User Controls Will Be Created Automatically no user initialization is Requird..

    If The Collection is ObservableCollection Then you can get the notifications.. other wise you can manually set the itemssource of the itemscontrol when the data is available.. 

    Monday, October 17, 2011 1:15 AM
  • Thanks both for your reply.

    king.sriram, your solution was the closest one that I implemented. The logic was the the same, but since I was doing it in code behind, I has to iterate through the items in ObservableCollection. The idea I followed was from Scott Guthrie's blog here.

    The idea was creating a usercontrol with Binding to property name and then when is instantiated, setting the datacontext to the viewmodel. The Bindings would then update the values automatically.

    If I was doing this is XAML I would have used your approach. Hence I am markign your post as answer.

    But thanks both of you for your support. I really appreaciate your contribution.

    Cheers!

    Monday, October 17, 2011 4:04 AM