Page selector implementation error
I am implementing page selector function in my custom control following this post:
www.sitefinity.com/.../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: odlum-brown.gssiwebs.com/Telerik.Web.UI.WebResource.axd
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) 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
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.
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>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; 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
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 www.sitefinity.com/.../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.
Does anyone know why the values of all properties in my custom control cannot be saved and reloaded?
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