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

Forums / Developing with Sitefinity / How to make an Image widget with navigation url

How to make an Image widget with navigation url

5 posts, 0 answered
  1. Shafiqul
    Shafiqul avatar
    4 posts
    Registered:
    06 May 2013
    06 May 2013
    Link to this post
    I already know how to create new widget. But, I can't figure out how to make another
    widget with the same functionality of image selector widget in addition
    with another filed called navigation url (similar to asp .net ImageButton). This navigation url will be
    used to redirect to on click of the image. Attached file contains the
    view that I am after.

    I have tried by inheriting "ImageSettingsDesigner"  but getting following error :



    Exception Details: System.NullReferenceException: Object reference not set to an instance of an object.

    Stack Trace:

    [NullReferenceException: Object reference not set to an instance of an object.]

    Telerik.Sitefinity.Modules.Libraries.Web.UI.Designers.ImageSettingsDesigner.OnInit(EventArgs e) +67".

    System.Web.UI.Control.InitRecursive(Control namingContainer) +185

    System.Web.UI.Control.InitRecursive(Control namingContainer) +420

    System.Web.UI.Control.InitRecursive(Control namingContainer) +420

    System.Web.UI.Control.InitRecursive(Control namingContainer) +420

    System.Web.UI.Control.InitRecursive(Control namingContainer) +420

    System.Web.UI.Control.AddedControl(Control control, Int32 index) +188

    Telerik.Sitefinity.Web.UI.DialogBase.CreateChildControls() +121

    System.Web.UI.Control.EnsureChildControls() +188

    System.Web.UI.WebControls.CompositeControl.get_Controls() +23

    Telerik.Sitefinity.Web.UI.PropertyEditor.OnInit(EventArgs e) +60

    System.Web.UI.Control.InitRecursive(Control namingContainer) +185

    System.Web.UI.Control.AddedControl(Control control, Int32 index) +188

    Telerik.Sitefinity.Web.DialogRouteHandler.InitializeContent(Page handler, RequestContext requestContext) +413

    System.Web.UI.Control.LoadRecursive() +70

    System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +3177



    Moreover, I am not sure what method to override and how. Any sample code will be much appreciated.

    Shafiq
  2. Martin Gebov
    Martin Gebov  avatar
    15 posts
    Registered:
    03 Nov 2016
    08 May 2013
    Link to this post
    Hi,

    Thank you for contacting Telerik Support.

    Here are the steps to achieving the functionality that you are looking for.

    1.       Inherit from the ImageControl class and add a custom public property named NavigateUrl. Note that this property will automatically be added to the designer of the widget because it is public.

    2.       Create a template (a new .ascx file )for the new image control that has the following markup(see attached file)

    3.       Add a control reference for the anchor tag.

    protected internal virtual HtmlAnchor OriginalImageLink

    { get { return this.Container.GetControl<HtmlAnchor>("navigateUrl", true); } }

    4.       Override to LayoutTemplatePath property to return the following- > ControlUtilities.ToVppPath("SitefinityWebApp.ImageControl.ascx");

    a.       Note that the path depends on where you place the ascx file.

    b.      Make sure that the .ascx file has its build action set to Embedded Resource.

    5.       Register the new control with Sitefinity ( you can use Sitefinity Thunder ) or the Default way

    Kind regards,
    Martin Gebov
    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. Shafiqul
    Shafiqul avatar
    4 posts
    Registered:
    06 May 2013
    09 May 2013 in reply to Martin Gebov
    Link to this post
    Thanks Martin, I will give a try. I forgot to tell you that I am using MVC framework. Hope that will not make any change. If you think any special action needs to be done for this then pls let me know.

    Regards
    Shafiq
  4. Martin Gebov
    Martin Gebov  avatar
    15 posts
    Registered:
    03 Nov 2016
    10 May 2013
    Link to this post
    Hi,

    Thank you for getting back to me.

    If you are using MVC framework, then you might find the following video useful:
    http://www.sitefinity.com/developer-network/videos/creating-sitefinity-mvc-widgets-with-public-properties
    Note that you will have to adapt your widget for the MVC framework.

    Please inform me if I could provide further assistance.

    Greetings,
    Martin Gebov
    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
  5. Shafiqul
    Shafiqul avatar
    4 posts
    Registered:
    06 May 2013
    23 May 2013 in reply to Martin Gebov
    Link to this post
    Hi Martin,

    I was busy with other stuff. Hence coming back to this issue after a while.

    Anyway, I gave a try the way you mentioned without considering MVC framework for the moment. Unfortunately the template is not loading correctly. Please see attachment how it looks now.

    I am not sure whether I have followed your steps correctly. I created a "ImageButton.ascx" file and put the html you have provided. I put the following codes in the "ImageButton.ascx.cs" file.

    public partial class ImageButton : ImageControl
        {
            public string NavigateUrl { get; set; }

            private string _layoutTemplatePath = "~/MVC/Designers/ImageButton/ImageButton.ascx";

            protected void Page_Load(object sender, EventArgs e)     {   }

            protected internal virtual HtmlAnchor OriginalImageLink
            {
                get
                {
                    return this.Container.GetControl<HtmlAnchor>("navigateUrl", true);
                }
            }
           public override string LayoutTemplatePath
            {
                get
                {
                    return ControlUtilities.ToVppPath(_layoutTemplatePath);
                }
                set
                {
                    _layoutTemplatePath = value;
                }
            }       
        }

    Please point me where have I made the mistake.

    Thanks
    Shafiq
5 posts, 0 answered