Along with the launch of Silverlight 3, a number of new controls were introduced in the Silverlight Toolkit. One control worth taking a look at if you deal with any sort of data entry forms in your applications is the DataForm.
The quick and dirty demo is to take an object, in this case Photo.cs
public class Photo
{
public int PhotoId { get; set; }
public string Title { get; set; }
public string Url { get; set; }
public string Description { get; set; }
public int Rating { get; set; }
public DateTime DateTaken { get; set; }
public bool Printed { get; set; }
}Add a DataForm control, set it’s CurrentItem property to a person obect
<Grid x:Name="LayoutRoot">
<Grid.Resources>
<local:Photo x:Key="MyPhoto"/>
</Grid.Resources>
<dataFormToolkit:DataForm CurrentItem="{StaticResource MyPhoto}" Width="300">
</dataFormToolkit:DataForm>
</Grid>
And there we go, a DataForm!
Just like that, the control auto-generated the fields for us and wired them up to the object. In the case of the bool it selected a checkbox and uses a calendar control for the date taken field. Labels are also created based on the property names.
This is all well and good, but what if that’s not exactly what I want. For example, what if I don’t want to see the PhotoID and should not be able to change the url?
What if there was a way that we could somehow tell the system how we want it to handle the display of our photo class? System.ComponentModel.DataAnnotations to the rescue! Data Annotations give us the ability to add attributes in our class that the data form looks at when generating these fields. Below is the photo class updated to hide the PhotoId field, make the URL read only, and update the label text for the DateTaken property.
public class Photo
{
[Display(AutoGenerateField = false)]
public int PhotoId { get; set; }
public string Title { get; set; }
[Editable(false)]
public string Url { get; set; }
public string Description { get; set; }
public int Rating { get; set; }
[Display(Name="Date photo was taken")]
public DateTime DateTaken { get; set; }
public bool Printed { get; set; }
}
And the result is
One of the additional things that can be done with DataAnnotations is data validation. By adding an attribute of [Required()] to the title, the Dataorm will pickup the validation requirement and automatically display an error message.
You will notice the OK button at the bottom of the form. I added AutoCommit=”False” to the DataForm XAML to allow me to notify the dataform that I was committing changes. In addition to required there are Range, StringLength, RegularExpression validators available.
In Part 2 I’ll go over how you can take even more control over the form by specifying content.