Working with complex properties in Custom public controls (WebTypeEditor)

Working with complex properties in Custom public controls (WebTypeEditor)

Posted on May 24, 2007 0 Comments

The content you're reading is getting on in years
This post is on the older side and its content may be out of date.
Be sure to visit our blogs homepage for our latest news, updates and information.

When working with Sitefinity, specifically with public web controls (such as Image of Posts list) you may have noticed some properties that have a “Select” button next to them. Those properties (we’ll call them Complex properties for the purpose of this post) have one thing in common : It is impossible or very hard for the user to type in the value of those properties so another window opens and let’s user visually determine the value of that property.

To show you how you can implement those complex property editors, I’ve created a short project called Quotes. The project has two controls :

  1. QuoteList - public control that displays all quotes inside of one category of quotes (this control has a complex property Quotes, which can be edited in QuotesSelector control)
  2. QuotesSelector - web editor control that let’s user select which category of quotes to display

Take a look at the following screenshots to get the idea of the functionality that’s being described :

Complex property

Complex property editor

Though the project is available for download and it is commented, let me just simply explain the concept.

You create a custom control as you would usually (same principle applies if your custom control is part of module as well) and then you set up a complex property just as any other you would. So my complex property is named Quotes and it’s of type string. The value of this property is the key of the dictionary that holds different categories of Quotes. Since users don’t know which categories of quotes are available I wanted to provide them with a new control that will let them choose among various Quote categories. In order to attach a Web Editor to a property I needed to add an attribute. This is how the property is defined in QuoteList control :

[WebEditor(”Sample.Quotes.QuotesSelector, Sample.Quotes”)]
public string Quotes
{
get
{
return this.selectedQuotesCategory;
}
set
{
this.selectedQuotesCategory = value;
}
}

As you can see I’ve added WebEditor attribute and set it to QuotesSelector control, the other control in my project.

QuotesSelector control is just another custom control where I can do whatever I please, but with one important property! The overridden Value property of WebUITypeEditor is the value that will be returned to the QuotesList Quote property when user clicks “I’m done” button. So, one central purpose of QuotesSelector control is to set the it’s Value property. How will this been done really doesn’t matter, though should be user-friendly as possible :).

The Sample.Quotes project you can download here. (Note : I’ve used the fake data source which is implemented in QuotesDat.cs file)

p.s. when you upload Sample.Quotes.dll control through page editor Both controls will appear. Since you don’t want users to be able to drag QuotesSelector control, go to web config and delete QuotesSelector from toolboxControl section. Optionally set section of QuoteList to “Quotes”.

progress-logo

The Progress Team

View all posts from The Progress Team on the Progress blog. Connect with us about all things application development and deployment, data integration and digital business.

Comments

Comments are disabled in preview mode.
Topics

Sitefinity Training and Certification Now Available.

Let our experts teach you how to use Sitefinity's best-in-class features to deliver compelling digital experiences.

Learn More
Latest Stories
in Your Inbox

Subscribe to get all the news, info and tutorials you need to build better business apps and sites

Loading animation