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

Forums / General Discussions / Page selector implementation error

Page selector implementation error

8 posts, 0 answered
  1. MJia
    MJia avatar
    44 posts
    Registered:
    09 Jun 2009
    18 Jan 2011
    Link to this post
    I am implementing page selector function in my custom control following this post:
    http://www.sitefinity.com/devnet/forums/sitefinity-4-x/sdk/how-to-add-page-selector-button-in-sitefinity-4-0-rc.aspx

    I got a javascript error when clicking the 'edit' button of my control:
    Error: a is null
    Source File: http://odlum-brown.gssiwebs.com/Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=ctl01_TSM&compress=1&_TSM_CombinedScripts_=%3b%3bSystem.Web.Extensions%2c+Version%3d4.0.0.0%2c+Culture%3dneutral%2c+PublicKeyToken%3d31bf3856ad364e35%3aen-US%3a1f68db6e-ab92-4c56-8744-13e09bf43565%3aea597d4b%3ab25378d2%3bTelerik.Sitefinity.Resources%3aen-US%3a110590a8-1007-4236-953e-f68c83688736%3a5fd29111%3a7ee0bb1f%3a83eb063b%3a64dcfe0a%3a1154458f%3a2232f901%3a24e33f3%3bTelerik.Sitefinity%3aen-US%3add66d247-ba3e-4019-8322-2a9066e7bd83%3a993d8e92%3a5b182b17%3afa91e8b7%3afe4b1370%3ad0257175%3bTelerik.Web.UI%2c+Version%3d2010.3.1109.40%2c+Culture%3dneutral%2c+PublicKeyToken%3d121fae78165ba3d4%3aen-US%3a6955197e-6bcc-48a0-9bff-1fd043726dc6%3a16e4e7cd%3a6a6d718d%3bTelerik.Sitefinity%2c+Version%3d4.0.1030.0%2c+Culture%3dneutral%2c+PublicKeyToken%3db28c218413bdf563%3aen-US%3add66d247-ba3e-4019-8322-2a9066e7bd83%3aa67f29d6%3a798214d1%3bTestControlProject%2c+Version%3d1.0.4034.26661%2c+Culture%3dneutral%2c+PublicKeyToken%3dnull%3aen-US%3a92186418-f615-4b80-87b0-e413a63e9a81%3ab5252877%3bTelerik.Web.UI%2c+Version%3d2010.3.1109.40%2c+Culture%3dneutral%2c+PublicKeyToken%3d121fae78165ba3d4%3aen-US%3a6955197e-6bcc-48a0-9bff-1fd043726dc6%3a874f8ea2%3af7645509%3a24ee1bba%3af46195d3%3a19620875%3a490a9d4e%3abd8f85e4%3bTelerik.Sitefinity%2c+Version%3d4.0.1030.0%2c+Culture%3dneutral%2c+PublicKeyToken%3db28c218413bdf563%3aen-US%3add66d247-ba3e-4019-8322-2a9066e7bd83%3ad3fef87b%3bTelerik.Web.UI%2c+Version%3d2010.3.1109.40%2c+Culture%3dneutral%2c+PublicKeyToken%3d121fae78165ba3d4%3aen-US%3a6955197e-6bcc-48a0-9bff-1fd043726dc6%3a1e771326%3ae524c98b%3bTelerik.Sitefinity%2c+Version%3d4.0.1030.0%2c+Culture%3dneutral%2c+PublicKeyToken%3db28c218413bdf563%3aen-US%3add66d247-ba3e-4019-8322-2a9066e7bd83%3a29ad74ff%3a5053a0f8%3bTelerik.Web.UI%2c+Version%3d2010.3.1109.40%2c+Culture%3dneutral%2c+PublicKeyToken%3d121fae78165ba3d4%3aen-US%3a6955197e-6bcc-48a0-9bff-1fd043726dc6%3aa7e79140
    Line: 2943

    I checked the source code and the error is here:

    Sys.UI.DomEvent.registerClass("Sys.UI.DomEvent"); $addHandler = Sys.UI.DomEvent.addHandler = function(a, e, f, g) {
                if (!a._events) a._events = {};
                var d = a._events[e];
                if (!d) a._events[e] = d = [];
                var b; if (a.addEventListener) {
                    b = function(b) {
                        return f.call(a, new Sys.UI.DomEvent(b))
                    };
                    a.addEventListener(e, b, c)
                }

  2. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    18 Jan 2011
    Link to this post
    Hello MJia,

    Most probably you have not registered the javascript properly, there is not implemented javascript or you have added some additional code which breaks the selector.

    Could you tell us which code of the post you use and have you made any changes to it?

    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. MJia
    MJia avatar
    44 posts
    Registered:
    09 Jun 2009
    18 Jan 2011
    Link to this post
    Thanks.
    I've checked the javascript code and found the error happens when running into this code:

    $addHandler(this._pageSelectButton, "click", this._showPageSelectorDelegate);

    (in prototype --> initialize function)

    And I tried to output values, I found this._pageSelectButton is null at this point.
    And I put trace code into set_pageSelectButton function but it has never been called.

    Do you have any idea where the problem possibly is?

    Thanks.
  4. MJia
    MJia avatar
    44 posts
    Registered:
    09 Jun 2009
    18 Jan 2011
    Link to this post
    In addition, the this._pageSelector is also null all the time.

    My template file is as the following:  (\Resourses\TestControlDesigner.ascx)

    <%@ Register Assembly="Telerik.Sitefinity" TagPrefix="designers" Namespace="Telerik.Sitefinity.Web.UI.ControlDesign" %>
    <%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" TagPrefix="sitefinity" %>
     
    <telerik:RadWindowManager ID="windowManager" runat="server"
        Height="100%"
        Width="100%"
        Behaviors="None"
        Skin="Sitefinity"
        ShowContentDuringLoad="false"
        VisibleStatusBar="false">
        <Windows>
            <telerik:RadWindow ID="widgetEditorDialog" runat="server" Height="100" Width="100" ReloadOnShow="true" Behaviors="Close" Modal="true" />
        </Windows>
    </telerik:RadWindowManager>
      
    <div id="selectorTag" style="display: none;" class="sfDesignerSelector">
        <designers:PageSelector runat="server" id="selector"/>
    </div>
     
    <label for="RotatorNewsImageFolder" class="sfTxtLbl">Folder Name</label>
    <input type="text" id="RotatorNewsImageFolder" class="sfTxt" />
    <asp:LinkButton runat="server" ID="pageSelectButton" OnClientClick="return false;" CssClass="sfLinkBtnIn">Select Page
    </asp:LinkButton>

    My designer class file is as the following:  (TestControlDesigner.cs)

    namespace TestControlProject
    {
        using System;
        using System.Collections.Generic;
        using System.Web.UI;
        using System.Web.UI.WebControls;
        using Telerik.Sitefinity.Web.UI;
        using Telerik.Sitefinity.Web.UI.ControlDesign;
        using Telerik.Sitefinity.Web.UI.Fields;
        using Telerik.Web.UI;
         
        /// Summary description for ServerControl1
        /// </summary>
        ///[Telerik.Sitefinity.Web.UI.ControlDesign.ControlDesigner(typeof(TestControlDesigner))]
        public class TestControlDesigner : ControlDesignerBase
        {
            protected override string LayoutTemplateName
            {
                get
                {
                    return "TestControlProject.Resources.TestControlDesigner.ascx";
                }
            }
     
            /// <summary>
            /// Gets a type from the resource assembly.
            /// Resource assembly is an assembly that contains embedded resources such as templates, images, CSS files and etc.
            /// By default this is Telerik.Sitefinity.Resources.dll.
            /// </summary>
            /// <value>The resources assembly info.</value>
            protected override Type ResourcesAssemblyInfo
            {
                get
                {
                    return this.GetType();
                }
            }
     
            protected LinkButton PageSelectButton
            {
                get
                {
                    return Container.GetControl<LinkButton>("pageSelectButton", true);
                }
            }
     
            /// <summary>
            /// Gets a reference to the page selector
            /// </summary>
            protected PageSelector PageSelector
            {
                get
                {
                    return Container.GetControl<PageSelector>("selector", true);
                }
            }
     
            /// <summary>
            /// Gets the correct instance of the RadWindowManager class
            /// </summary>
            protected virtual RadWindowManager RadWindowManager
            {
                get
                {
                    return this.Container.GetControl<RadWindowManager>("windowManager", true);
                }
            }
             
            //protected override HtmlTextWriterTag TagKey
            //{
            //    get
            //    {
            //        //Use div wrapper tag to make easier common styling. This will surround the layout template with a div tag.
            //        return HtmlTextWriterTag.Div;
            //    }
            //}
     
            /// <summary>
            /// Gets a collection of <see cref="T:System.Web.UI.ScriptReference"/> objects that define script resources that the control requires.
            /// </summary>
            /// <returns>
            /// An <see cref="T:System.Collections.IEnumerable"/> collection of <see cref="T:System.Web.UI.ScriptReference"/> objects.
            /// </returns>
            public override IEnumerable<System.Web.UI.ScriptReference> GetScriptReferences()
            {
                var res = new List<ScriptReference>(base.GetScriptReferences());
                var assemblyName = this.GetType().Assembly.GetName().ToString();
                res.Add(new ScriptReference("TestControlProject.Resources.TestControlDesigner.js", assemblyName));
                return res.ToArray();
            }
     
            public override IEnumerable<ScriptDescriptor> GetScriptDescriptors()
            {
                ScriptControlDescriptor desc = new ScriptControlDescriptor(this.GetType().FullName, this.ClientID);
                Dictionary<string, string> fieldControlsMap = new Dictionary<string, string>();
     
                foreach (FieldControl fieldControl in this.Container.GetControls<FieldControl>().Values)
                {
                    desc.AddElementProperty("pageSelectButton", this.PageSelectButton.ClientID);
                    desc.AddComponentProperty("pageSelector", this.PageSelector.ClientID);
                    desc.AddComponentProperty("radWindowManager", this.RadWindowManager.ClientID);
                }
                return new[] { desc };
     
            }
     
            protected override void InitializeControls(GenericContainer controlContainer)
            {
                base.DesignerMode = ControlDesignerModes.Simple;
            }
        }
    }
  5. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    19 Jan 2011
    Link to this post
    Hi MJia,

    Please follow the steps outlined in the initial post to get the selector working. We also attached a sample project which you can download and install locally.

    Kind regards,
    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
  6. MJia
    MJia avatar
    44 posts
    Registered:
    09 Jun 2009
    20 Jan 2011
    Link to this post
    Yeah, I followed the steps in the post and now the page selector is working except one thing:
    the values of all fields cannot be persist.

    I tried the sample NewsRotator project in the post, the link is http://www.sitefinity.com/ClientsFiles/237452_NewsRotator.zip
    I didn't change anything, just compiled it and registered in Sitefinity.

    But the values of all properties cannot be saved and reloaded.  Do you know why?

    Thanks.
  7. MJia
    MJia avatar
    44 posts
    Registered:
    09 Jun 2009
    21 Jan 2011
    Link to this post
    Does anyone know why the values of all properties in my custom control cannot be saved and reloaded?
  8. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    02 Feb 2011
    Link to this post
    Hi MJia,

    You need to hook the pages selector. You need to implement the following on the client

    1. get/set client component


        get_pagesSelector: function () {
            return this._pagesSelector;
        },

        set_pagesSelector: function (val) {
        this._pagesSelector = val;

    2. You need pages selector delegate

    this._pagesSelectedDelegate = Function.createDelegate(this, this._pagesSelected);
    this.get_pagesSelector().add_doneClientSelection(this._pagesSelectedDelegate);

    3. Inside _pagesSelected you should get array of the selected pages

    var selectedItem = this.get_pageSelector().getSelectedItems()[0];

    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
8 posts, 0 answered