Dynamically Create controls using ContentControl and Converters in silverlight4 - silverlight-4.0

Question

I have a problem to create dynamic controls in silverlight 4.
My requirement is:
I have question table in database, which is like below.
QuestionText, AnswerControl, AnswerDefaultText, IsItmandatory
Question1 TextBox null Yes
QuestionText2, RadioButton, Yes, Yes
Question3, ComboBox, null, no
..........................................
I need to get this data into object and conver the question text into TextBlock, and based on answercontrol value, need to create controls dynamically.
I tried like as you mentioned in your post, but data is not binding and not able to send default values as parameter values to converter.
My Converter is not getting called. Is there any thing wrong in below code?
My Codes are:
1)My Xaml Code:
<UserControl x:Class="SilverlightApplication5.DynamicControls"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:SilverlightApplication5.Converter"
xmlns:question="clr-namespace:SilverlightApplication5"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">
<Grid x:Name="LayoutRoot" Background="White" Width="400" Height="400">
<Grid.Resources>
<local:UILocatorConverter x:Key="UILocatorConverter" />
<question:Questions x:Key="Questions"/>
</Grid.Resources>
<ListBox ItemsSource="{Binding Questions}" Width="400" Height="400">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>
<ContentControl Content="{Binding Converter={StaticResource UILocatorConverter},ConverterParameter={Binding QuestionText},Path=QuestionControl}" Grid.Column="0" />
<ContentControl Content="{Binding Converter={StaticResource UILocatorConverter},ConverterParameter={Binding DefaultValue},Path=AnswerControl}" Grid.Column="1" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</UserControl>
2) Code behind file code is:
namespace SilverlightApplication5
{
public partial class DynamicControls : UserControl
{
ObservableCollection<Questions> Question;
public DynamicControls()
{
InitializeComponent();
Question = new ObservableCollection<Questions>();
Question.Add(new Questions { QuestionControl = "TextBlock", QuestionText = "What is your name?", AnswerControl = "TextBox", AnswerValues = "", DefaultValue = "" });
Question.Add(new Questions { QuestionControl = "TextBlock", QuestionText = "What is your surname?", AnswerControl = "TextBox", AnswerValues = "", DefaultValue = "" });
Question.Add(new Questions { QuestionControl = "TextBlock", QuestionText = "Sex:", AnswerControl = "ComboBox", AnswerValues = "Male,Female,Others", DefaultValue = "Select a Value" });
Question.Add(new Questions { QuestionControl = "TextBlock", QuestionText = "Marital Status", AnswerControl = "RadioButton", AnswerValues = "", DefaultValue = "Not Married" });
this.DataContext = Question;
}
}
}
3) My converter is:
namespace SilverlightApplication5.Converter
{
public class UILocatorConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
String param="This is control created dynamically";
if (parameter != null)
{
param = System.Convert.ToString(parameter);
}
switch (value.ToString())
{
case "TextBlock":
return new TextBlock() { Text = param, HorizontalAlignment=HorizontalAlignment.Center,TextWrapping=TextWrapping.NoWrap,Width=200 };
case "Button":
return new Button() { Content = param, Width=150 };
case "TextBox":
return new TextBox() { Text = param };
case "RadioButton":
return new TextBox() { };
case "ComboBox":
return new TextBox() { };
}
return null;
}
public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
throw new NotImplementedException();
}
}
}
4) My Question Class is:
namespace SilverlightApplication5
{
public class Questions
{
private string _questionControl;
public string QuestionControl {
get
{
return _questionControl;
}
set
{
_questionControl = value;
}
}
private string _questionText;
public string QuestionText
{
get
{
return _questionText;
}
set
{
_questionText = value;
}
}
private string _answerControl;
public string AnswerControl
{
get
{
return _answerControl;
}
set
{
_answerControl = value;
}
}
private string _answerValues;
public string AnswerValues
{
get
{
return _answerValues;
}
set
{
_answerValues = value;
}
}
private string _defaultValue;
public string DefaultValue
{
get
{
return _defaultValue;
}
set
{
_defaultValue = value;
}
}
}
}
My converter is not getting called, is there any issues in this code?

Answer 1

You need to use this:
<ListBox ItemsSource="{Binding}" Width="400" Height="400">
As you want to access the collection of Questions you set in the DataContext.
What you were doing was creating a single Questions class in your Resources and telling the ListBox to use that.
So you won't need this at all:
<question:Questions x:Key="Questions"/>
(You might have to use BindsDirectlyToSource...because you are setting the DataContext to a collection directly...could be wrong on that!).
Alternatively, you can do this in your control:
public partial class DynamicControls : UserControl
{
public ObservableCollection<Questions> Question { get; set; }
...
Set the DataContext in this way:
DataContext = this;
And then use this Binding:
<ListBox ItemsSource="{Binding Question}" Width="400" Height="400">
I'd recommend you rename your Questions class to Question, and then rename the Property to Questions, to avoid confusion.