More in this section

Forums / Developing with Sitefinity / Page Selector Field pulling from PagesService

Page Selector Field pulling from PagesService

5 posts, 1 answered
  1. Miles
    Miles avatar
    32 posts
    Registered:
    23 Nov 2011
    26 Jan 2012
    Link to this post
    I'm trying to create a page selector field so a user can browse for a page instead of having to type in the URL. I've looked at the Simple Image Field example and I've set up my selector in the same manor but I'm unable to get any information from the PagesService (I'm really not even sure how to correctly pull the information).

    Below is the code to the pages I'm thinking aren't working (I tried to upload the files but it wouldn't let me for some reason...)

    SimplePageSelector.ascx
    <%@ Control Language="C#" AutoEventWireup="true" %>
    <%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" TagPrefix="sf" %>
    <sf:ResourceLinks ID="resourcesLinks" runat="server">
        <sf:ResourceFile JavaScriptLibrary="JQuery">
        </sf:ResourceFile>
    </sf:ResourceLinks>
    <div id="control-wrapper">
        <ul id="pageList" runat="server">
        </ul>
    </div>
     
    <sf:GenericCollectionBinder ID="pageListBinder" runat="server" TargetId="pageList" ServiceUrl="~/Sitefinity/Services/Pages/PagesService.svc/" BindOnLoad="false" DataKeyNames="Id" DataMembers="PageLiveUrl, Title">
        <containers>
            <sf:BinderContainer ID="pageTitleContainer" runat="server" RenderContainer="true" ContainerTag="li">
                <a href="javascript:void(0);" class="sf_binderCommand_selectImage">
                    {{Title}}
                </a>
            </sf:BinderContainer>
        </containers>
    </sf:GenericCollectionBinder>


    SimplePageSelector.js
    Type.registerNamespace("SandboxSitefinity.PageSelector");
     
    SandboxSitefinity.PageSelector.SimplePageSelector = function (element)
    {
        SandboxSitefinity.PageSelector.SimplePageSelector.initializeBase(this, [element]);
     
        this._binder = null;
        this._onLoadDelegate = null;
        this._onUnloadDelegate = null;
        this._binderCommandDelegate = null;
        this._selectedPageUrl = null;
        this._originalServiceBaseUrl = null;
    }
     
    SandboxSitefinity.PageSelector.SimplePageSelector.prototype =
    {
        initialize: function ()
        {
            SandboxSitefinity.PageSelector.SimplePageSelector.callBaseMethod(this, "initialize");
     
            this._onLoadDelegate = Function.createDelegate(this, this._onLoad);
            Sys.Application.add_load(this._onLoadDelegate);
     
            this._onUnloadDelegate = Function.createDelegate(this, this._onUnload);
            Sys.Application.add_unload(this._onUnloadDelegate);
     
            this._binderCommandDelegate = Function.createDelegate(this, this._binderCommand);
        },
     
        dispose: function ()
        {
            SandboxSitefinity.PageSelector.SimplePageSelector.callBaseMethod(this, "dispose");
     
            Sys.Application.remove_load(this._onLoadDelegate);
            if (this._onLoadDelegate)
                delete this._onLoadDelegate;
            //
     
            Sys.Application.remove_load(this._onUnloadDelegate);
            if (this._onUnloadDelegate)
                delete this._onUnloadDelegate;
            //
     
            if (this._binderCommandDelegate != null)
                delete this._binderCommandDelegate;
        },
     
        _onLoad: function (sender, args)
        {
            this._originalServiceBaseUrl = this.get_binder().get_serviceBaseUrl();
            this.get_binder().add_onItemCommand(this._binderCommandDelegate);
            this.get_binder().DataBind();
        },
     
        _onUnload: function (sender, args)
        {
            this.get_binder().remove_onItemCommand(this._binderCommandDelegate);
        },
     
        _binderCommand: function (sender, args)
        {
            alert(args.get_commandName());
     
            if (args.get_commandName() == "selectPage")
            {
                var pageUrl = args.get_dataItem().PageLiveUrl;
                var pageTitle = args.get_dataItem().Title;
     
                this.set_selectedPageUrl(pageUrl);
                this.set_selectedPageTitle(pageTitle);
     
                // remove class from previously selected pages
                var selected = jQuery(args.get_itemElement().parentNode).find(".sf_selectedPage").each(function (index, element)
                {
                    jQuery(element).removeClass("sf_selectedPage");
                });
     
                // set class to currently selected page
                jQuery(args.get_itemElement()).addClass("sf_selectedPage");
            }
        },
     
        /* -------------------- private methods ----------- */
     
        /* -------------------- properties ---------------- */
     
        get_binder: function ()
        {
            return this._binder;
        },
     
        set_binder: function (value)
        {
            this._binder = value;
        },
     
        get_selectedPageTitle: function()
        {
            return this._selectedPageTitle;
        },
     
        set_selectedPageTitle: function (value)
        {
            this._selectedPageTitle = value;
        },
     
        get_selectedPageUrl: function ()
        {
            return this._selectedPageUrl;
        },
     
        set_selectedPageUrl: function (value)
        {
            this._selectedPageUrl = value;
        },
    };
     
    SandboxSitefinity.PageSelector.SimplePageSelector.registerClass("SandboxSitefinity.PageSelector.SimplePageSelector", Sys.UI.Control);


    Here's the error that's being generated in the Error.log file:

    Type : System.Web.HttpException, System.Web, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a
    Message : This is an invalid webresource request.
    Source : System.Web
    Help link :
    WebEventCode : 0
    ErrorCode : -2147467259
    Data : System.Collections.ListDictionaryInternal
    TargetSite : Void System.Web.IHttpHandler.ProcessRequest(System.Web.HttpContext)
    Stack Trace :    at System.Web.Handlers.AssemblyResourceLoader.System.Web.IHttpHandler.ProcessRequest(HttpContext context)
       at System.Web.HttpApplication.CallHandlerExecutionStep.System.Web.HttpApplication.IExecutionStep.Execute()
       at System.Web.HttpApplication.ExecuteStep(IExecutionStep step, Boolean& completedSynchronously)
     
    Additional Info:
    MachineName :
    TimeStamp : 26/01/2012 20:32:32
    FullName : Telerik.Sitefinity.Utilities, Version=4.4.2117.0, Culture=neutral, PublicKeyToken=b28c218413bdf563
    AppDomainName : 7d4a8850-1-129720835026875677
    ThreadIdentity : admin
    WindowsIdentity :
    Requested URL : http://localhost:60877/WebResource.axd?d=6fVoQP6PwW0WPuXQ1HmkTyq-h5mkFzArID-BxWhMRcvy5VvHHEdVuavwxyEz0_tIROgEaKOaQiTU4CMZdTRtridpl6fQio035kyPpcBQuz2Up3m3Z8llWlf4U_nnkVHI9eGk4aROta3Ej45jmR1sa31ua85Vx63oLiPkXitHgk6WDf2QRpQAsBPSsETNdILy0&t=634631887012115677
     
     
    Category: ErrorLog
    Priority: 0
    EventId: 90000
    Severity: Error
    Title:Enterprise Library Exception Handling
    Machine:
    App Domain: 7d4a8850-1-129720835026875677
    ProcessId: 1236
    Process Name: C:\Program Files (x86)\Common Files\Microsoft Shared\DevServer\10.0\WebDev.WebServer40.exe
    Thread Name:
    Win32 ThreadId:3320
    Extended Properties:

  2. Svetoslav Petsov
    Svetoslav Petsov avatar
    456 posts
    Registered:
    24 Sep 2012
    31 Jan 2012
    Link to this post
    Hello,

     It would be easier to just use our PageField to select pages. Here's a very good example by Josh Morales that includes PageField inside a designer:
    http://www.sitefinity.com/blogs/joshmorales/posts/11-10-05/selecting_sitefinity_4_content_inside_widget_designers.aspx 
    You can download the source and look through it. If you have any questions or difficulties, do not hesitate to write back.

    All the best,
    Svetoslav Petsov
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. Miles
    Miles avatar
    32 posts
    Registered:
    23 Nov 2011
    31 Jan 2012
    Link to this post
    Ya, I'm having some difficulty following the code.  I'm just not understanding how to set up my field to use the PageField that already exists...

    Looking at the code example, I see that there is a Widget and a Designer (which I believe that I'm wanting to use the designer since I'm going to be using it as a field and a dialog for when a user modifies a list item).

    So how do I continue from there and what do I need to use? Will I be creating a field object (I've been calling it PageSelectorField ascx, cs, and js) that will contain a Telerik.Sitefinity.Web.UI.Fields.PageField item on it? Then, create the CS class to inherit from PageField as well? I've tried using the code shown below and I keep getting an error in the GetScriptDescriptors method when it attempts to get it's base descriptors (error of value cannot be null, the virtual path). Here's my code setting everything up so far:

    And I have restarted the application (I'm doing this in debug mode on my local machine so every time I recompile, it restarts the application).

    ASCX
    <%@ Control Language="C#" AutoEventWireup="true" %>
    <%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI.Fields" TagPrefix="sf" %>
    <%@ Register Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" TagPrefix="sitefinity" %>
    <sf:FormManager ID="formManager" runat="server" />
    <asp:Label ID="titleLabel" runat="server" Text="Title Test" />
    <asp:Label ID="descriptionLabel" runat="server" Text="Description Test" CssClass="sfSelectedItem" />
    <asp:Label ID="exampleLabel" runat="server" Text="Example Test" CssClass="sfSelectedItem" />
     
    <sitefinity:SitefinityLabel id="pageUrl" runat="server" />
     
    <telerik:RadWindowManager ID="windowManager" runat="server" Skin="Sitefinity">
        <Windows>
            <telerik:RadWindow ID="selectorWindow" Width="600" Height="400" NavigateUrl="~/Sitefinity/Dialog/PageSelectorFieldDialog" runat="server" ReloadOnShow="true" Modal="true" VisibleStatusbar="false" Behaviors="Close">
            </telerik:RadWindow>
        </Windows>
    </telerik:RadWindowManager>
     
    <asp:LinkButton ID="openSelector" runat="server" class="sfLinkBtn sfChange">
        <strong class="sfLinkBtnIn">
            Change
        </strong>
    </asp:LinkButton>
     
    <sf:PageField ID="PageSelector" runat="server" WebServiceUrl="~/Sitefinity/Services/Pages/PagesService.svc/" DisplayMode="Write" />

    CS
    [FieldDefinitionElement(typeof(PageSelectorFieldElement))]
    public class PageSelectorField : PageField
    {
        #region Properties
     
        /// <summary>
        /// Gets the name of the layout template.
        /// </summary>
        /// <value>The name of the layout template.</value>
        protected override string LayoutTemplateName
        {
            get
            {
                return String.Empty;
            }
        }
     
        /// <summary>
        /// Gets or sets the layout template path.
        /// </summary>
        /// <value>The layout template path.</value>
        public override string LayoutTemplatePath
        {
            get
            {
                return "~/SandboxSitefinity/SandboxSitefinity.PageSelectorField.PageSelectorField.ascx";
            }
            set
            {
                base.LayoutTemplatePath = value;
            }
        }
     
        #endregion
     
        #region Overrides
     
        public override IEnumerable<ScriptDescriptor> GetScriptDescriptors()
        {
            var descriptors = new List<ScriptDescriptor>();
            var scriptDescriptor = (ScriptControlDescriptor)base.GetScriptDescriptors().Last();
            descriptors.Add(scriptDescriptor);
     
            return descriptors.ToArray();
        }
     
        public override IEnumerable<ScriptReference> GetScriptReferences()
        {
            string assemblyName = typeof(PageSelectorField).Assembly.FullName;
            var scripts = new List<ScriptReference>(base.GetScriptReferences())
            {
                new ScriptReference(PageSelectorField._pageSelectorFieldScript, assemblyName)
            };
     
            return scripts.ToArray();
        }
     
        #endregion
     
        #region Fields
     
        private const string _pageSelectorFieldScript = "SandboxSitefinity.PageSelectorField.PageSelectorField.js";
     
        #endregion
    }

    Global.asax.cs
    protected void Application_Start(object sender, EventArgs e)
    {
        Bootstrapper.Initialized +=new EventHandler<Telerik.Sitefinity.Data.ExecutedEventArgs>(Bootstrapper_Initialized);
    }
      
    protected void Bootstrapper_Initialized(object sender, Telerik.Sitefinity.Data.ExecutedEventArgs e)
    {
        this.InstallCustomVirtualPaths();
    }
      
      
    private void InstallCustomVirtualPaths()
    {
        ConfigManager manager = ConfigManager.GetManager();
        var virtualPathConfig = manager.GetSection<VirtualPathSettingsConfig>();
        ConfigManager.Executed += new EventHandler<Telerik.Sitefinity.Data.ExecutedEventArgs>(ConfigManager_Executed);
      
        #region Sandbox Sitefinity Virtual Path
                  
        var sandboxVirtualPathConfig = new VirtualPathElement(virtualPathConfig.VirtualPaths)
        {
            VirtualPath = "~/SandboxSitefinity/*",
            ResolverName = "EmbeddedResourceResolver",
            ResourceLocation = "SandboxSitefinity"
        };
      
        if (!virtualPathConfig.VirtualPaths.ContainsKey("~/SandboxSitefinity/*"))
        {
            virtualPathConfig.VirtualPaths.Add(sandboxVirtualPathConfig);
            manager.SaveSection(virtualPathConfig);
        }
      
        #endregion
    }

  4. Svetoslav Petsov
    Svetoslav Petsov avatar
    456 posts
    Registered:
    24 Sep 2012
    03 Feb 2012
    Link to this post
    Hello Miles,

     I attached a sample for a field control with a page selector. Please look through it and let me know if you have any questions on the implementation.
    Please note that you need to register the virtual paths, used by the control and also register the dialogue in your Global.asax:

    protected void Application_Start(object sender, EventArgs e)
            {
                Bootstrapper.Initialized += new EventHandler<Telerik.Sitefinity.Data.ExecutedEventArgs>(Bootstrapper_Initialized);
            }
     
            void Bootstrapper_Initialized(object sender, Telerik.Sitefinity.Data.ExecutedEventArgs e)
            {
                Telerik.Sitefinity.Web.UI.Dialogs.RegisterDialog<PageSelectorDialog>();
            }

    Greetings,
    Svetoslav Petsov
    the Telerik team
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
    Answered
  5. Miles
    Miles avatar
    32 posts
    Registered:
    23 Nov 2011
    03 Feb 2012
    Link to this post
    Awesome. Thanks a bunch.

5 posts, 1 answered