At some point you might encounter the need to display certain amount of data in a way the user can easily interact with, when being registered to your site. In the past, we had several requests by users which were related to the extension of the registration form control, to include functionality, allowing the newly registered user to choose from a list of items.
I am going to focus on the scenario, where you need to create a dropdown field, in the registration form to display a list of countries ( which will be flat taxonomies ) for the user to choose from.
For the purpose, I will create a new Registration control, which directly inherit from the default one. Then the logic in the InitializeControls method will be overridden to include the new code for our scenario.
As for the workflow:
1. We will create a new classification, called Countries ( Simple list ).
2. After that all the countries will be added to the new classification.
3. Then, a new custom field needs to be created in the profile type that is being used. It needs to be set "Classification" type.
4. We can then create our code. For the code behind, we can use:
In my case, the custom classification holding the countries is called
For your convenience I am attaching the above code in an archive.
The next step would be to register the control in the Toolbox section of the site, so that it can be used in "Page Edit" mode.
I am going to focus on the scenario, where you need to create a dropdown field, in the registration form to display a list of countries ( which will be flat taxonomies ) for the user to choose from.
For the purpose, I will create a new Registration control, which directly inherit from the default one. Then the logic in the InitializeControls method will be overridden to include the new code for our scenario.
As for the workflow:
1. We will create a new classification, called Countries ( Simple list ).
2. After that all the countries will be added to the new classification.
3. Then, a new custom field needs to be created in the profile type that is being used. It needs to be set "Classification" type.
4. We can then create our code. For the code behind, we can use:
using
System;
using
System.Collections.Generic;
using
System.Linq;
using
System.Web;
using
Telerik.Sitefinity.Security.Web.UI;
using
Telerik.Web.UI;
using
Telerik.Sitefinity.Taxonomies;
using
Telerik.Sitefinity.Taxonomies.Model;
using
Telerik.Sitefinity.Security.Model;
using
Telerik.Sitefinity.Model;
using
Telerik.OpenAccess;
namespace
SitefinityWebApp
{
public
class
RegFormCustom : RegistrationForm
{
protected
virtual
RadComboBox CategoriesCombo
{
get
{
return
this
.Container.GetControl<RadComboBox>(
"categoriesCombo"
,
true
);
}
}
protected
override
string
LayoutTemplateName
{
get
{
return
null
;
}
}
public
RegFormCustom()
{
this
.LayoutTemplatePath =
this
.layoutTemplatePath;
}
protected
override
void
InitializeControls(Telerik.Sitefinity.Web.UI.GenericContainer container)
{
this
.LayoutTemplatePath =
this
.layoutTemplatePath;
base
.InitializeControls(container);
TaxonomyManager taxonomyManager = TaxonomyManager.GetManager();
var newsCategories = taxonomyManager.GetTaxonomies<FlatTaxonomy>().Where(t => t.Name ==
"Countries"
).SingleOrDefault().Taxa
.Select(t =>
new
{
taxonId = t.Id,
taxonTitle = t.Title.ToString()
}).ToList();
this
.CategoriesCombo.DataTextField =
"taxonTitle"
;
this
.CategoriesCombo.DataValueField =
"taxonId"
;
this
.CategoriesCombo.DataSource = newsCategories;
this
.CategoriesCombo.DataBind();
RadComboBoxItem emptyItem =
new
RadComboBoxItem(
"Choose a country"
);
this
.CategoriesCombo.Items.Insert(0, emptyItem);
CategoriesCombo.SelectedIndexChanged +=
new
RadComboBoxSelectedIndexChangedEventHandler(CategoriesCombo_SelectedIndexChanged);
}
void
CategoriesCombo_SelectedIndexChanged(
object
sender, RadComboBoxSelectedIndexChangedEventArgs e)
{
//throw new NotImplementedException();
}
protected
override
void
CreateUserProfiles(Telerik.Sitefinity.Security.Model.User user)
{
base
.CreateUserProfiles(user);
var userProfile =
this
.GetUserProfile(user,
typeof
(SitefinityProfile).FullName);
var taxList =
new
TrackedList<Guid>();
taxList.Add(
new
Guid(CategoriesCombo.SelectedValue));
userProfile.SetValue(
"Country"
, taxList);
this
.UserProfileManager.SaveChanges();
}
public
string
layoutTemplatePath =
"~/RegFormCustomTempl.ascx"
;
}
}
In my case, the custom classification holding the countries is called
Countries
and the custom field is Country
. The template, RegFormCustomTempl.ascx
is as follows:<%@ Control Language="C#"%>
<%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI.Fields" Assembly="Telerik.Sitefinity" %>
<%@ Register TagPrefix="sf" Namespace="Telerik.Sitefinity.Web.UI" Assembly="Telerik.Sitefinity" %>
<%@ Register TagPrefix="sfvalidation" Namespace="Telerik.Sitefinity.Web.UI.Validation.Definitions" Assembly="Telerik.Sitefinity"%>
<
fieldset
class
=
"sfregisterFormWrp"
>
<
asp:Panel
ID
=
"formContainer"
runat
=
"server"
DefaultButton
=
"registerButton"
>
<
ol
class
=
"sfregisterFieldsList"
>
<
sf:TextField
ID
=
"firstName"
runat
=
"server"
DataFieldName
=
"FirstName"
DataItemType
=
"Telerik.Sitefinity.Security.Model.SitefinityProfile"
DisplayMode
=
"Write"
Title="<%$ Resources:Labels, FirstName %>" CssClass="sfregisterField sfregisterFirstName" WrapperTag="li" />
<
sf:TextField
ID
=
"lastName"
runat
=
"server"
DataFieldName
=
"LastName"
DataItemType
=
"Telerik.Sitefinity.Security.Model.SitefinityProfile"
DisplayMode
=
"Write"
Title="<%$ Resources:Labels, LastName %>" CssClass="sfregisterField sfregisterLastName" WrapperTag="li" />
<
sf:TextField
ID
=
"email"
runat
=
"server"
DataFieldName
=
"Email"
DisplayMode
=
"Write"
Title="<%$ Resources:Labels, Email %>" CssClass="sfregisterField sfregisterEmail" WrapperTag="li">
<
ValidatorDefinition
MessageCssClass
=
"sfError"
Required
=
"true"
ExpectedFormat
=
"EmailAddress"
/>
</
sf:TextField
>
<
telerik:RadComboBox
runat
=
"server"
ID
=
"categoriesCombo"
Skin
=
"Sitefinity"
></
telerik:RadComboBox
>
<
sf:TextField
ID
=
"userName"
runat
=
"server"
DataFieldName
=
"UserName"
DisplayMode
=
"Write"
Title="<%$ Resources:Labels, UserName %>" CssClass="sfregisterField sfregisterUserName" WrapperTag="li">
<
ValidatorDefinition
MessageCssClass
=
"sfError"
Required
=
"true"
/>
</
sf:TextField
>
<
sf:TextField
ID
=
"password"
runat
=
"server"
DisplayMode
=
"Write"
Title="<%$ Resources:Labels, Password %>" IsPasswordMode="true" CssClass="sfregisterField sfregisterPassword" WrapperTag="li">
<
ValidatorDefinition
MessageCssClass
=
"sfError"
Required
=
"true"
/>
</
sf:TextField
>
<
sf:TextField
ID
=
"reTypePassword"
runat
=
"server"
DisplayMode
=
"Write"
Title="<%$ Resources:UserProfilesResources, ReTypePassword %>" IsPasswordMode="true" CssClass="sfregisterField sfregisterConfirmPassword" WrapperTag="li">
<
ValidatorDefinition
MessageCssClass
=
"sfError"
>
<
ComparingValidatorDefinitions
>
<
sfvalidation:ComparingValidatorDefinition
ControlToCompare
=
"password"
Operator
=
"Equal"
ValidationViolationMessage="<%$ Resources:ErrorMessages, CreateUserWizardDefaultConfirmPasswordCompareErrorMessage %>"/>
</
ComparingValidatorDefinitions
>
</
ValidatorDefinition
>
</
sf:TextField
>
</
ol
>
<
asp:Panel
ID
=
"errorsPanel"
runat
=
"server"
CssClass
=
"sfErrorSummary"
Visible
=
"false"
/>
<
div
class
=
"sfregisterLnkWrp"
>
<
asp:Button
runat
=
"server"
ID
=
"registerButton"
Text="<%$ Resources:UserProfilesResources, Register %>" CssClass="sfregisterSaveLnk"/>
</
div
>
</
asp:Panel
>
<
sf:SitefinityLabel
id
=
"successMessageLabel"
runat
=
"server"
WrapperTagName
=
"div"
CssClass
=
"sfSuccess"
/>
<
asp:Panel
ID
=
"configurationErrorsPanel"
runat
=
"server"
CssClass
=
"sfErrorSummary"
Visible
=
"false"
>
<
div
runat
=
"server"
id
=
"smtpSettingsErrorWrapper"
Visible
=
"false"
>
<
asp:Label
runat
=
"server"
id
=
"smtpConfigurationErrorTitle"
Text="<%$ Resources:ErrorMessages, CannotSendEmails %>"/>
<
asp:Label
runat
=
"server"
id
=
"smtpConfigurationError"
></
asp:Label
>
</
div
>
</
asp:Panel
>
</
fieldset
>
For your convenience I am attaching the above code in an archive.
The next step would be to register the control in the Toolbox section of the site, so that it can be used in "Page Edit" mode.