+1-888-365-2779
Try Now
More in this section

Forums / Developing with Sitefinity / RadEditor Control in Custom Widget

RadEditor Control in Custom Widget

4 posts, 2 answered
  1. Gina McCarty
    Gina McCarty avatar
    5 posts
    Registered:
    23 Feb 2006
    12 Jul 2013
    Link to this post
    Hi, I am trying to get the RadEditor to work in a custom widget.  I can get the RadEditor to populate text, but I cannot edit the text inside the RadEditor and I cannot save the value.  I am new to Sitefinity.. can you please enlighten me on what I am doing wrong?  I have looked through the client side API and cannot find what I'm looking for. Thank you. 

    .js file

    Type.registerNamespace("SitefinityWebApp.CustomWidgets.CompressionLink");

    SitefinityWebApp.CustomWidgets.CompressionLinkDesigner = function (element) {
    SitefinityWebApp.CustomWidgets.CompressionLinkDesigner.initializeBase(this, [element]);
    }

    SitefinityWebApp.CustomWidgets.CompressionLinkDesigner.prototype = {
    initialize: function () {
    SitefinityWebApp.CustomWidgets.CompressionLinkDesigner.callBaseMethod(this, 'initialize');
    },
    dispose: function () {
    SitefinityWebApp.CustomWidgets.CompressionLinkDesigner.callBaseMethod(this, 'dispose');
    },
    refreshUI: function () {
    var controlData = this._propertyEditor.get_control();
    var editor = $find("<%=txtBody.ClientID%>");

    //bind widget properties to designer
    jQuery("#txtTitle").val(controlData.linkText);
    jQuery("#txtName").val(controlData.nameText);
    jQuery("#txtBody").html(controlData.bodyText);

    },
    applyChanges: function () {

    var controlData = this._propertyEditor.get_control();

    //bind designer properties back to widget
    controlData.linkText = jQuery("#txtTitle").val();
    controlData.nameText = jQuery("#txtName").val();
    controlData.txtBody = jQuery("#txtBody").val();

    }
    }

    SitefinityWebApp.CustomWidgets.CompressionLinkDesigner.registerClass('SitefinityWebApp.CustomWidgets.CompressionLinkDesigner', Telerik.Sitefinity.Web.UI.ControlDesign.ControlDesignerBase);
    if (typeof (Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();


    .ascx file

    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
    <%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" TagPrefix="sitefinity" %>
     
    <br />
    <span><b>Name</b></span>
    <br />
    <input type="text" id="txtName" style="width:250px;"/>
    <br />
    <span style="color:Gray;">Defines the programmatic name of the item. This is the name used to access the item. Create a name without spaces.</span>
    <br />
    <br />
    <span><b>Title</b></span>
    <br />
    <input type="text" id="txtTitle" style="width:250px;"/>
    <br />
    <span style="color:Gray;">Defines the clickable title that will be displayed to expand or collapse text in the body.</span>
    <br />
    <br />
    <span><b>Body</b></span>
    <br />
    <!-- <asp:TextBox ID="txtBody1" runat="server" style="width:450px;height:200px;" ClientIDMode="Static" TextMode="MultiLine"></asp:TextBox> -->

    <telerik:RadEditor runat="server" ID="txtBody" ClientIDMode="Static">
    <Tools>
    <telerik:EditorToolGroup Tag="MainToolbar">
    <telerik:EditorTool Name="FindAndReplace" />
    <telerik:EditorSeparator />
    <telerik:EditorSplitButton Name="Undo">
    </telerik:EditorSplitButton>
    <telerik:EditorSplitButton Name="Redo">
    </telerik:EditorSplitButton>
    <telerik:EditorSeparator />
    <telerik:EditorTool Name="Cut" />
    <telerik:EditorTool Name="Copy" />
    <telerik:EditorTool Name="Paste" ShortCut="CTRL+V" />
    </telerik:EditorToolGroup>
    <telerik:EditorToolGroup Tag="Formatting">
    <telerik:EditorTool Name="Bold" />
    <telerik:EditorTool Name="Italic" />
    <telerik:EditorTool Name="Underline" />
    <telerik:EditorSeparator />
    <telerik:EditorSplitButton Name="ForeColor">
    </telerik:EditorSplitButton>
    <telerik:EditorSplitButton Name="BackColor">
    </telerik:EditorSplitButton>
    <telerik:EditorSeparator />
    <telerik:EditorDropDown Name="FontName">
    </telerik:EditorDropDown>
    <telerik:EditorDropDown Name="RealFontSize">
    </telerik:EditorDropDown>
    </telerik:EditorToolGroup>
    </Tools>
    <Content>
    </Content>

    <TrackChangesSettings CanAcceptTrackChanges="False"></TrackChangesSettings>
    </telerik:RadEditor>
     
    <br />
    <span style="color:Gray;">Defines the text that will be displayed or hidden when the title is clicked.</span>
    <br />
    <br />

    .cs file

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using Telerik.Sitefinity.Web.UI.ControlDesign;

    namespace SitefinityWebApp.CustomWidgets
    {
    [ControlDesigner(typeof(CompressionLinkDesigner))]
    public partial class CompressionLink : System.Web.UI.UserControl
    {
    public string nameText { get; set; }
    public string linkText { get; set; }
    public string bodyText { get; set; }

    protected void Page_Load(object sender, EventArgs e)
    {
    hlCompressionLink.Attributes.Add("onclick", "showme('" + nameText + "');");

    if (String.IsNullOrEmpty(nameText))
    {
    nameText = "Default";
    }
    else
    {
    nameText = nameText;
    }

    if (String.IsNullOrEmpty(linkText))
    {
    hlCompressionLink.Text = "Your Title";
    }
    else
    {
    hlCompressionLink.Text = linkText;
    }

    if (String.IsNullOrEmpty(bodyText))
    {
    litCompressionLink.Text = "Your Description";
    }
    else
    {
    litCompressionLink.Text = bodyText;
    }

    }

    }
    }

    Answered
  2. Jonathan
    Jonathan avatar
    119 posts
    Registered:
    19 Dec 2012
    12 Jul 2013
    Link to this post
    Sounds to me like you can be using the DynamicModule Builder. Here is Sitefinity's docs.  With the module builder you can have many different types of fields, including LongText which will allow you to use the RadEditor for "Rich Text".  If this doesn't suit your needs if you can explain in further detail what you are trying to accomplish we can continue to help.
  3. Jonathan
    Jonathan avatar
    119 posts
    Registered:
    19 Dec 2012
    12 Jul 2013 in reply to Gina McCarty
    Link to this post
    Sounds to me like you can be using the DynamicModule Builder. Here is Sitefinity's docs.  With the module builder you can have many different types of fields, including LongText which will allow you to use the RadEditor for "Rich Text".
  4. Gina McCarty
    Gina McCarty avatar
    5 posts
    Registered:
    23 Feb 2006
    12 Jul 2013
    Link to this post
    So is this not doable by a custom widget then?  I'd rather not build another module, this is working when we just use a regular asp textbox control instead of the radeditor, however we'd like to add some text customization features for the user when they enter text in the body.
    Answered
4 posts, 2 answered