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

Forums / Developing with Sitefinity / Use WebEditors In Custom Modules

Use WebEditors In Custom Modules

9 posts, 0 answered
  1. Kevin
    Kevin avatar
    42 posts
    Registered:
    15 Mar 2005
    27 Jun 2009
    Link to this post
    I just finished making a few custom modules for sitefinity, and rather than expecting people to type in relative URLs in a textbox on the form, I would like for them to be able to select a URL from a popup.  This is easy to do if you have a user control with some properties, such as

     [Telerik.Cms.Web.UI.WebEditor("Telerik.Cms.Web.UI.CmsUrlWebEditor, Telerik.Cms")]
    public string MyUrl
    {
        get; set;
    }

    However, in the edit view for the admnistration part of my module, I am simply definining some textboxes in the html code, and I'm not sure how I can use WebEditors?  For example, how could I attach a CmsUrlWebEditor to the following textbox, since it has no user-generated code behind?:

     

    <asp:Label ID="lblProductPage" runat="server" Text="Product Page *" AssociatedControlID="productPage"></asp:Label>
    <asp:TextBox ID="productPage" runat="server" ValidationGroup="contactEditor"></asp:TextBox>

     

     

     

  2. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    27 Jun 2009
    Link to this post
    Hi Kevin,

    You can add LinkButton control to the backend view template. Then use CommandArgument property to trigger the WebEditor.

    <asp:Label ID="Label1" AssociatedControlID="Selector" runat="server"
    <asp:TextBox ID="Selector" Text="" runat="server" MaxLength="250"></asp:TextBox> 
    <asp:LinkButton ID="lbutton1" runat="server" OnClientClick="javascript:needToConfirm=false;callAjaxFunc=false;" Text="Select" CommandName="Pick" CommandArgument="Selector:Telerik.Cms.Web.UI.CmsUrlWebEditor, TelerikCms"></asp:LinkButton>  


    Greetings,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  3. Kevin
    Kevin avatar
    42 posts
    Registered:
    15 Mar 2005
    28 Jun 2009
    Link to this post
    Ivan:

    Thanks for your reply.  I'm able to wire up the event easily enough:

     

    protected void lbutton1_Command(object sender, CommandEventArgs e)

     

    {

     

    string s = e.CommandArgument.ToString();

     

    }


    But that doesn't really get me where I was hoping.  When I make a user control for the front-end, obviously Sitefinity is taking care of all the background work and I just need to add the appropriate attributes to my property to specify which WebEditor to use.  In the case of a back-end module, though, it's easy enough to know that a user wants to see a specific dialogue (for example CmsUrlWebEditor) via the CommandArgument, but I still don't really see a straight-forward way to make that window 'popup' once the initial postback (that determines which action to take) is finished, and then collect the response when the user is done with the dialogue (presumably after another postback)?  How do I bring the WebEditor up in server-side code?

    If you could point me to an example of existing code within Sitefinity, perhaps if I can see an example of how you did this yourself and it would make more sense to me.  The alternative is I can make a custom view, redirect to that, and then come back to the source view ... but that's reinventing the wheel when you've already done a great job yourself with your existing editors.
  4. Kevin
    Kevin avatar
    42 posts
    Registered:
    15 Mar 2005
    28 Jun 2009
    Link to this post
    I was able to get something working using a RadWindow, as follows:

    <

     

    SCRIPT language=JavaScript type=text/javascript>
    function CallBackFunction(radWindow, returnValue) {
    if (returnValue) alert(returnValue);
    else {
    alert(
    "No text was returned");
    }
    }
    </SCRIPT>
    <telerik:RadWindowManager ID="RadWindowManager1" runat="server" VisibleOnPageLoad="false">
    <Windows>
    <telerik:RadWindow ID="RadWindow1"
    runat="server"
    Width="750"
    Height="515"
    VisibleOnPageLoad="false"
    ClientCallBackFunction="CallBackFunction">
    </telerik:RadWindow>
    </Windows>
    </
    telerik:RadWindowManager>

     


    And adding the following to my code behind:

     

    protected void lbutton1_Command(object sender, CommandEventArgs e)
    {
    // Show popup window
    RadWindow1.NavigateUrl = "~/Sitefinity/UserControls/Dialogs/PagesSelector.aspx";
    RadWindow1.VisibleOnPageLoad =
    true;
    }

     


    The only part missing is that I'm not sure how to get the returned value from the dialogue (after selecting the appropriate page).  When I try to convert it to text, it simply says '[object Object]', but I'm not sure what the format of that object is or how to pull values out of it?

    Kevin.
  5. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    28 Jun 2009
    Link to this post
    Hi Kevin,

    I am not sure whether you have tried my approach. It will automatically set the value of the textbox once a page from the WebEditor is selected. I attached a sample video for your convenience. I am using products sample module - ProductsNewView template.
    If you are using RadWindow, you should have custom user control that inherits from ITextControl and in CallBackFunction you should return the "selected page" ID. Also you need to create a custom dialog and template. As I see from the code you are using the implementation from this KB article.

    Let me know how it goes.

    Kind regards,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  6. Kevin
    Kevin avatar
    42 posts
    Registered:
    15 Mar 2005
    28 Jun 2009
    Link to this post
    I tried your method, but didn't have any luck getting it working.  This is the code I have in the markup:

    <li>
    <asp:Label ID="lblCMSPage" AssociatedControlID="cmsPageSelector" runat="server" Text="Product Page *">
    </
    asp:Label>
    <asp:TextBox ID="cmsPageSelector" Text="" runat="server" MaxLength="250"></asp:TextBox>
    <asp:LinkButton ID="lbutton1" runat="server"
    OnClientClick="javascript:needToConfirm=false;callAjaxFunc=false;"
    Text="Select" CommandName="Pick"
    CommandArgument="cmsPageSelector:Telerik.Cms.Web.UI.CmsUrlWebEditor, TelerikCms"
    oncommand="lbutton1_Command"></asp:LinkButton>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ControlToValidate="cmsPageSelector"
    ErrorMessage="* required field" Display="Dynamic" CssClass="validMessage" ValidationGroup="productEditor">
    <strong>Product Page required!</strong>
    </asp:RequiredFieldValidator>
    </li>

    And this is the class definition (perhaps I need to be inheriting from a different base class?

    public

     

    partial class Custom_Modules_Store_Backend_Views_ProductsEditView : ViewModeUserControl<ProductsView>

     


    When I click the button I get a full postback, but nothing else happens?  I have a different solution working with RadWindow, but I'd prefer your own method since it seems far more elegant (fewer lines of code to maintain).

    Kevin.
  7. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    28 Jun 2009
    Link to this post
    Hi Kevin,

    Please change your code as below:

    <asp:Label ID="lblCMSPage" AssociatedControlID="cmsPageSelector" runat="server" Text="Product Page *"
    </asp:Label> 
    <asp:TextBox ID="cmsPageSelector" Text="" runat="server" MaxLength="250"></asp:TextBox> 
    <asp:LinkButton ID="lbutton1" runat="server" 
    OnClientClick="javascript:needToConfirm=false;callAjaxFunc=false;" 
    Text="Select" CommandName="Pick" 
    CommandArgument="cmsPageSelector:Telerik.Cms.Web.UI.CmsUrlWebEditor, TelerikCms"></asp:LinkButton> 
    <asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ControlToValidate="cmsPageSelector" 
    ErrorMessage="* required field" Display="Dynamic" CssClass="validMessage" ValidationGroup="productEditor"
    <strong>Product Page required!</strong> 
    </asp:RequiredFieldValidator> 
    </li> 

    I hope this will work.

    Regards,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  8. Kevin
    Kevin avatar
    42 posts
    Registered:
    15 Mar 2005
    28 Jun 2009
    Link to this post
    I adjusted the code, but still nothing.  When I click the linkbutton, I get a full postback, and there is no effect when the page reloads?  Do I need to manually add any AJAX controls, etc., to the ProductsEditView control hosting the textbox?

    Kevin.
  9. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    16 Jun 2017
    29 Jun 2009
    Link to this post
    Hi Kevin,

    The code from the previous post should work if you add it inside ContentMetaFields control of the view you are using. However, I prepared a custom module with implementation of page selector using PropertyEditorDialog and PropertyDescriptor classes. On button.CommandName  I am calling  "Telerik.Cms.Web.UI.UrlEditorWrapper, Telerik.Cms"; In PropertyValueChangedEventHandler I use a function that will set the value returned from the selector.
    To test the module you need to register it in your web.config <moodules> node. Then set LayoutTemplatePath of TestViewLink.cs to the location of TestView.ascx.

    Regards,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
Register for webinar
9 posts, 0 answered