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

Forums / General Discussions / Inline Javascript.

Inline Javascript.

10 posts, 0 answered
  1. John
    John avatar
    12 posts
    Registered:
    01 Nov 2010
    11 Jan 2011
    Link to this post
    Hello,

    Im trying to insert javascript in a template that gets the latest news of the company from another site. I am able to do this easily through the css widget, but I have to include the javascript in the middle of a content block because of css issues. (unless there is a way to set a wrapper class for the javascript widget??)  When I try to insert the script on the html, it gets erased once I press ok or switch between source/design. Is there a way to do this?? I saw some other threads that mentioned to set to "true" allowscripts and contentfilters to "none" but I cant find these properties or the files (ControlTemplates) anywhere.. which brings me to another question... when I click on "Edit on visual studio" VS pulls up the solution, but all the default.ascx files are completely empty although I have three published pages and a template throught the sitefinity UI. So whenever I see some solutions on the threads that require editing the project on VS, Im not really sure what to edit. (Im probably looking at the wrong place or something :/ ).

    Thanks for your time!
  2. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    19 Sep 2016
    12 Jan 2011
    Link to this post
    Hello John,

    You can map the ContentBlockDesigner


    2. Add the following

    in the ascx

    <%@ Control Language="C#" %>
    <%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" TagPrefix="sf" %>
    <%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI.Fields" TagPrefix="sf" %>
     
    <sf:ResourceLinks id="resourcesLinks" runat="server">
        <sf:ResourceFile Name="Styles/Window.css" />
    </sf:ResourceLinks>
     
    <sf:FormManager ID="formManager" runat="server" />
    <div style="width: 660px; overflow: hidden;">
        <sf:HtmlField
            ID="htmlEditor"
            runat="server"
            Width="99%"
            Height="370px"
            EditorContentFilters="DefaultFilters"
            EditorStripFormattingOptions="MSWord,Css,Font,Span,ConvertWordLists"
            DisplayMode="Write"
            FixCursorIssue="True">
        </sf:HtmlField>
    </div>
    <script type="text/javascript">
        $("body").addClass("sfContentBlockDesigner");
    </script>

    Change EditorContentFilters. Then you can set the ContentFilters you want to have.

    All the best,
    Ivan Dimitrov
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. Duneel
    Duneel avatar
    166 posts
    Registered:
    08 Dec 2010
    17 Jan 2011
    Link to this post
    Hi Ivan,

    I want to use the ContentBlock in my custom control designer to set a string property in a custom widget (created as a usercontrol). I have successfully hooked up everithing and it is showing content block editor when i go to the edit view of the control. Now the chellenge I have is to get the entered content and and set it to the property in the widget. The following two functions in the designer.js fails when loading or saved.

    Previously I used RadEditor instead and these functions worked without any trouble. Can you tell me what i need to do inorder to read/set the content input from the custom control designer?

    //refreshes the UI overrides the base interface
        refreshUI: function () {
            this._refreshMode = true;
            var data = this.get_controlData();
              
            this.get_contentBlockControlTop().set_html(data.ContentTop)
        },
      
        // forces the designer to apply the changes on UI to the cotnrol Data buth
        applyChanges: function () {
            var data = this.get_controlData();
              
            data.ContentTop = this.get_contentBlockControlTop().get_html();
        }

    Thanks!
    Duneel
  4. Duneel
    Duneel avatar
    166 posts
    Registered:
    08 Dec 2010
    17 Jan 2011
    Link to this post
    Hello,

    I solved the above problem by changing the set_html() and get_html() to as follows...
    //refreshes the UI overrides the base interface
        refreshUI: function () {
            this._refreshMode = true;
            var data = this.get_controlData();
      
            this.get_contentBlockControlTop()._setEditorHtml(data.ContentTop);
        },
      
        // forces the designer to apply the changes on UI to the cotnrol Data buth
        applyChanges: function () {
            var data = this.get_controlData();
            data.ContentTop = this.get_contentBlockControlTop().get_value();
        }

    Thanks!
    Duneel
  5. Jerami Tainter
    Jerami Tainter avatar
    27 posts
    Registered:
    29 Oct 2009
    13 Mar 2011
    Link to this post
    Hey I'm having the same problems and the one thing im missing from this is:

    this.get_contentBlockControlTop()

    Can you share the markup for that function?
  6. Duneel
    Duneel avatar
    166 posts
    Registered:
    08 Dec 2010
    14 Mar 2011
    Link to this post
    Hi Jerami,

    Here is the complete client-side code I'm having.

    Type.registerNamespace("Samples.ControlDesigners.CertifiedAgents");
      
    Samples.ControlDesigners.CertifiedAgents.CertifiedAgentsDesigner = function (element) {
      
        // Elements
        this._contentBlockControlTop = null;
        this._contentBlockControlBottom = null;
        Samples.ControlDesigners.CertifiedAgents.CertifiedAgentsDesigner.initializeBase(this, [element]);
    }
      
    Samples.ControlDesigners.CertifiedAgents.CertifiedAgentsDesigner.prototype = {
      
        initialize: function () {
            Samples.ControlDesigners.CertifiedAgents.CertifiedAgentsDesigner.callBaseMethod(this, 'initialize');
      
        },
      
        dispose: function () {
            Samples.ControlDesigners.CertifiedAgents.CertifiedAgentsDesigner.callBaseMethod(this, 'dispose');
      
        },
      
        // Top Content
        get_contentBlockControlTop: function () {
            return this._contentBlockControlTop;
        },
        set_contentBlockControlTop: function (value) {
            this._contentBlockControlTop = value;
        },
      
        // Bottom Content
        get_contentBlockControlBottom: function () {
            return this._contentBlockControlBottom;
        },
        set_contentBlockControlBottom: function (value) {
            this._contentBlockControlBottom = value;
        },
      
        /* ----------------------------- Public Mthods ----------------------------- */
      
        // Refreshes the UI overrides the base interface
        refreshUI: function () {
            this._refreshMode = true;
            var data = this.get_controlData();
              
            // set values....
            if (data.DetailsPageURL != null) {
                $("#DetailsPageURL").val(data.DetailsPageURL);
            }
            this.get_contentBlockControlTop()._setEditorHtml(data.ContentTop);
            this.get_contentBlockControlBottom()._setEditorHtml(data.ContentBottom);
        },
      
        // Forces the designer to apply the changes on UI to the cotnrol Data buth
        applyChanges: function () {
            var data = this.get_controlData();
              
            // Get values....
            data.DetailsPageURL = $("#DetailsPageURL").val();
            data.ContentTop = this.get_contentBlockControlTop().get_value();
            data.ContentBottom = this.get_contentBlockControlBottom().get_value();
        }
    }
      
    Samples.ControlDesigners.CertifiedAgents.CertifiedAgentsDesigner.registerClass('Samples.ControlDesigners.CertifiedAgents.CertifiedAgentsDesigner', Telerik.Sitefinity.Web.UI.ControlDesign.ControlDesignerBase);
      
    if (typeof (Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();

    And in the designer you need to register the ID's for the content controls as follows.

    /// <summary>
            /// Gets script descriptors.
            /// </summary>
            /// <returns>ScriptDescriptor.</returns>
            public override IEnumerable<ScriptDescriptor> GetScriptDescriptors()
            {
                var scriptDescriptors = new List<ScriptDescriptor>(base.GetScriptDescriptors());
                var desc = (ScriptControlDescriptor)scriptDescriptors.Last();
      
                var contentBlockControlTop = this.ContentBlockTop;
                var contentBlockControlBottom = this.ContentBlockBottom;
      
                desc.AddComponentProperty("contentBlockControlTop", contentBlockControlTop.ClientID);
                desc.AddComponentProperty("contentBlockControlBottom", contentBlockControlBottom.ClientID);
      
                return scriptDescriptors.ToArray();
            }
      
    /// <summary>
            /// Gets the top content block control instance.
            /// </summary>
            protected virtual HtmlField ContentBlockTop
            {
                get
                {
                    return this.Container.GetControl<HtmlField>("htmlEditorTop", true);
                }
            }
      
            /// <summary>
            /// Gets the bottom content block control instance.
            /// </summary>
            protected virtual HtmlField ContentBlockBottom
            {
                get
                {
                    return this.Container.GetControl<HtmlField>("htmlEditorBottom", true);
                }
            }

    Let me know If you have any other questions,

    Cheers!
    Duneel

  7. Jerami Tainter
    Jerami Tainter avatar
    27 posts
    Registered:
    29 Oct 2009
    14 Mar 2011
    Link to this post
    Thanks I got it working now...i was missing the GetScriptDescriptors() method.

    public override IEnumerable<ScriptDescriptor> GetScriptDescriptors()


  8. Connections Academy Developer
    Connections Academy Developer avatar
    151 posts
    Registered:
    04 May 2005
    14 Apr 2011
    Link to this post
    Hi Duneel, 

    Your code has been very helpful. Could you answer two questions for me?

    1. What do ContentTop and ContentBottom correspond to? I tried switching this for the ID of the HtmlField in my designer template, the control name, and anything else I can think of, and nothing worked.

    2. The line below threw an error... is it correct?
    var desc = (ScriptControlDescriptor)scriptDescriptors.Last();

    Thanks!

    Michael Snyder
  9. Duneel
    Duneel avatar
    166 posts
    Registered:
    08 Dec 2010
    14 Apr 2011
    Link to this post
    Hi Michael,

    ContentBlockTop and ContentBlockBottom corresponds to two HTMLField controls available in my designer template (.ascx). In designer.cs file I need to register the ClientIDs of the two controls so they are available to the javascript file.

    This is what I have in my designer.cs file for the two fields.

    /// <summary>
            /// Gets the top content block control instance.
            /// </summary>
            protected virtual HtmlField ContentBlockTop
            {
                get
                {
                    return this.Container.GetControl<HtmlField>("htmlEditorTop", true);
                }
            }
      
            /// <summary>
            /// Gets the bottom content block control instance.
            /// </summary>
            protected virtual HtmlField ContentBlockBottom
            {
                get
                {
                    return this.Container.GetControl<HtmlField>("htmlEditorBottom", true);
                }
            }
      
    /// <summary>
            /// Gets script descriptors.
            /// </summary>
            /// <returns>ScriptDescriptor.</returns>
            public override IEnumerable<ScriptDescriptor> GetScriptDescriptors()
            {
                var scriptDescriptors = new List<ScriptDescriptor>(base.GetScriptDescriptors());
                var desc = (ScriptControlDescriptor)scriptDescriptors.Last();
      
                var contentBlockControlTop = this.ContentBlockTop;
                var contentBlockControlBottom = this.ContentBlockBottom;
      
                desc.AddComponentProperty("contentBlockControlTop", contentBlockControlTop.ClientID);
                desc.AddComponentProperty("contentBlockControlBottom", contentBlockControlBottom.ClientID);
      
                return scriptDescriptors.ToArray();
            }


    Cheers,
    Duneel
  10. Abhinav
    Abhinav avatar
    7 posts
    Registered:
    05 Feb 2014
    15 Oct 2015
    Link to this post
    How to create dynamic tab in the sitefinity custom widget and put the content for there respective tab. Please suggest
10 posts, 0 answered