The following example shows how to create a form control that will allow uses to choose color from a dropdownlist.
| 1. | Open the web project in Visual Studio 2005 (or Visual Web Developer) using the WebProject.sln file or using File -> Open -> Web site in Visual Studio. |
| 2. | Right-click the CMSFormControls folder and choose Add New Item. Choose to create a new Web User Control and call it ColorSelection.ascx. |
| 3. | Edit the ColorSelection.ascx user control in Design mode. Drag and drop a DropDownList control and a Label control on the form: |
| 4. | Switch to the code behind. |
| 5. | Change the following line |
[C#]
public partial class CMSFormControls_ColorSelection : System.Web.UI.UserControl
to
public partial class CMSFormControls_ColorSelection : CMS.FormEngine.FormEngineUserControl |
[VB.NET]
Partial class CMSFormControls_ColorSelection Inherits SystemWeb.UI.UserControl
to
Partial class CMSFormControls_ColorSelection Inherits CMS.FormEngine.FormEngineUserControl |
It ensures that our user control inherits from the FormEngineUserControl class and can use its standardized properties.
| 6. | Modify the code behind like this: |
[C#]
protected void Page_Load(object sender, EventArgs e) { EnsureItems(); Label1.Visible = false; }
public override Object Value { get { return DropDownList1.SelectedValue; } set { EnsureItems(); DropDownList1.SelectedValue = System.Convert.ToString(value); } }
// check if some color is selected public override bool IsValid() { if ((string) Value != "") { this.Label1.Visible = false; return true; } else { this.Label1.Visible = true; this.Label1.Text = "Please choose some color."; return false; } }
// ensure that the DropDownList contains color options public void EnsureItems() { if (DropDownList1.Items.Count == 0) { DropDownList1.Items.Add(new ListItem("(select color)", "")); DropDownList1.Items.Add(new ListItem("red", "red")); DropDownList1.Items.Add(new ListItem("green", "green")); DropDownList1.Items.Add(new ListItem("blue", "blue")); } } |
[VB.NET]
protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load EnsureItems() Label1.Visible = false End Sub
public Overrides Property Value() As Object Get return DropDownList1.SelectedValue End Get Set(ByVal value As Object) EnsureItems() DropDownList1.SelectedValue = System.Convert.ToString(value) End Set End Property
' check if some color is selected public Overrides Function IsValid() As Boolean if CType(Value, String) <> "" Then Label1.Visible = false return true else Label1.Visible = true Label1.Text = "Please choose some color." return false End if End Function
' ensure that the DropDownList contains color options public Sub EnsureItems() if DropDownList1.Items.Count = 0 Then DropDownList1.Items.Add(new ListItem("(select color)", "")) DropDownList1.Items.Add(new ListItem("red", "red")) DropDownList1.Items.Add(new ListItem("green", "green")) DropDownList1.Items.Add(new ListItem("blue", "blue")) End if End Sub |
| 7. | Go to Site Manager -> Development -> Form controls and click New form control. Enter the following values: - Control display name: Color selection - Control code name: colorselection - Control file name: colorselection.ascx Check the Use control for text box, check the Show control in document types box and click OK.  |
| 8. | Now we will test this control in some document editing form. Go to Site Manager -> Development -> Document types and edit the Product document type. Click the Fields tab and add a new field with following properties: - Attribute name: ProductColor - Attribute type: Text - Attribute size: 100 - Field caption: Color - Field type: Color selection Click OK to save the new field.  |
| 9. | Go to CMS Desk -> Content and create a new product in the /Products section. The new form control will be displayed like this: If you do not choose any color, the error label is displayed. |
|
Getting and setting values of other fields
You can get and set the values of the other fields by getting their reference like this:
[C#]
[VB.NET]
Please note that the field name must be written in lowercase.
When you get the reference to the control, you can get or set its value (for example: txtBox.Text = "150")
If you want to change the value of some other control before its loaded, you need to place the code inside the PageLoad method of your form control.
If you want to change the value of some other control before its saved, you need to place the code inside the IsValid method of your form control.
You can also use the this.DataDR (me.DataDR) property of the forum control that provides the DataRow object with data of the current form.
|
