Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Basic HelloWorld Widget with ControlDesigner for Sitefinity 4.0
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="HelloWorld.ascx.cs" Inherits="SitefinityWebApp.Widgets.HelloWorld.HelloWorld" %>
<p>Hello <asp:Literal ID="NameLiteral" runat="server" />, how are you?</p>
using System;
using Telerik.Sitefinity.Web.UI.ControlDesign;
namespace SitefinityWebApp.Widgets.HelloWorld
{
/// <summary>
/// Sitefinity "Hello World" Widget
/// </summary>
[ControlDesigner(typeof(HelloWorldDesigner)), PropertyEditorTitle("Hello World")]
public partial class HelloWorld : System.Web.UI.UserControl
{
/// <summary>
/// Gets or sets the name.
/// </summary>
/// <value>
/// The name.
/// </value>
public string Name { get; set; }
/// <summary>
/// Handles the Load event of the Page control.
/// </summary>
/// <param name="sender">The source of the event.</param>
/// <param name="e">The <see cref="System.EventArgs"/> instance containing the event data.</param>
protected void Page_Load(object sender, EventArgs e)
{
NameLiteral.Text = Name;
}
}
}
<div class="sfContentViews">
<div id="RotatorOptions">
<div>
<div id="groupSettingPageSelect">
<ul class="sfTargetList">
<li>
<label for="Name" class="sfTxtLbl">
Your Name</label>
<input type="text" id="Name" class="sfTxt" />
</li>
</ul>
</div>
</div>
</div>
</div>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Telerik.Sitefinity.Web.UI.ControlDesign;
using System.Web.UI;
namespace SitefinityWebApp.Widgets.HelloWorld
{
/// <summary>
/// Widget Control Designer for the "Hello World" Widget
/// </summary>
public class HelloWorldDesigner : ControlDesignerBase
{
/// <summary>
/// Initializes the controls.
/// </summary>
/// <param name="container">The container.</param>
protected override void InitializeControls(Telerik.Sitefinity.Web.UI.GenericContainer container)
{
base.DesignerMode = ControlDesignerModes.Simple;
}
private string _layoutTemplatePath = "~/Widgets/HelloWorld/HelloWorldDesignerTemplate.ascx";
/// <summary>
/// Gets or sets the layout template path.
/// </summary>
/// <value>
/// The layout template path.
/// </value>
public override string LayoutTemplatePath
{
get { return _layoutTemplatePath; }
set { _layoutTemplatePath = value; }
}
private string _scriptPath = "~/Widgets/HelloWorld/HelloWorldDesigner.js";
/// <summary>
/// Gets or sets the designer javascript path.
/// </summary>
/// <value>
/// The designer javascript path.
/// </value>
public string DesignerScriptPath
{
get { return _scriptPath; }
set { _scriptPath = value; }
}
/// <summary>
/// Gets the name of the layout template.
/// </summary>
/// <value>
/// The name of the layout template.
/// </value>
protected override string LayoutTemplateName
{
get { return "IGNORE"; }
}
/// <summary>
/// Gets the script references.
/// </summary>
/// <returns></returns>
public override IEnumerable<ScriptReference> GetScriptReferences()
{
// get existing scripts
var scripts = base.GetScriptReferences() as List<ScriptReference>;
if (scripts == null) return base.GetScriptReferences();
// add widget designer script
scripts.Add(new ScriptReference(DesignerScriptPath));
return scripts.ToArray();
}
}
}
Type.registerNamespace("SitefinityWebApp.Widgets.HelloWorld");
SitefinityWebApp.Widgets.HelloWorld.HelloWorldDesigner = function (element) {
SitefinityWebApp.Widgets.HelloWorld.HelloWorldDesigner.initializeBase(this, [element]);
}
SitefinityWebApp.Widgets.HelloWorld.HelloWorldDesigner.prototype = {
initialize: function () {
SitefinityWebApp.Widgets.HelloWorld.HelloWorldDesigner.callBaseMethod(this, 'initialize');
},
dispose: function () {
SitefinityWebApp.Widgets.HelloWorld.HelloWorldDesigner.callBaseMethod(this, 'dispose');
},
refreshUI: function () {
// initialize property getter
var data = this._propertyEditor.get_control();
// bind properties
jQuery("#Name").val(data.Name);
},
applyChanges: function () {
// initialize property setter
var controlData = this._propertyEditor.get_control();
// set property values
controlData.Name = jQuery("#Name").val();
}
}
SitefinityWebApp.Widgets.HelloWorld.HelloWorldDesigner.registerClass('SitefinityWebApp.Widgets.HelloWorld.HelloWorldDesigner', Telerik.Sitefinity.Web.UI.ControlDesign.ControlDesignerBase);
if (typeof (Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();
@gzeder
Copy link

gzeder commented Feb 3, 2011

Thanks for the easy to understand example. Should HelloWorldDesigner.ascx be named HelloWorldDesignerTemplate.ascx?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment