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

Forums / Sitefinity SDK / Forms validation on control designers

Forms validation on control designers

8 posts, 0 answered
  1. Joseph Smith
    Joseph Smith avatar
    10 posts
    Registered:
    08 Oct 2009
    28 Oct 2010
    Link to this post
    Hi,

    I am using the RadRotator control designer, which was included with the NewsRotator Custom Control widget. If I want to make width a mandatory field, how can I do that? Is there a save method I should override and test if a value is null?
  2. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    19 Sep 2016
    28 Oct 2010
    Link to this post
    Hello Joseph,

    You have to use client side validation in the template of your designer or try validating the field you want inside your designer script. In Sitefinity 4.0 the ControlDesigner works with script reference to ContentViewDesignerBase.js. There are two public methods that you can use.

    refreshUI -  forces the designer to refresh the UI from the cotnrol Data
    applyChanges -  forces the designer to apply the changes on UI to the cotnrol Data


    All the best,
    Ivan Dimitrov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. Phil
    Phil avatar
    89 posts
    Registered:
    19 Oct 2010
    04 Feb 2011
    Link to this post
    Thanks Ivan and Team.

    We are making quite a few custom widgets so we are very familiar w the applyChanges and refreshUI methods.

    I want to do form validation on the user's entries in the designer.  Obviously, if the designer does not pass the validation, I want to return the user to the designer*.  What do I do in applyChanges() to achieve this?  For everything I have tried so far, the app still goes to the edit-a-page screen.

    Thanks


    *giving the user guidance on how to correct the problems
  4. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    19 Sep 2016
    04 Feb 2011
    Link to this post
    Hello Phil,

    The easiest way is using FieldControls like TextField

    <sitefinity:TextField ID="txtFieldName" runat="server" DisplayMode="Write" Title="Test" CssClass="sfFormCtrl">
                    <ValidatorDefinition Required="true"
                                         ExpectedFormat="Custom"
                                         RegularExpression="^[a-zA-Z]+[\w#@]{0,127}"
                                         MessageCssClass="sfError" />
                </sitefinity:TextField>

    Best wishes,
    Ivan Dimitrov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  5. Phil
    Phil avatar
    89 posts
    Registered:
    19 Oct 2010
    04 Feb 2011
    Link to this post
    When I try to wire up the validator the way that you most recently recommended I get an error, to the effect that, a FormManager is required on the page.  I think there are some missing pieces to your advice; maybe quite a few missing pieces.

    Could you please do one of these:
    1.) provide a complete example using the <ValidatorDefinition ... />  approach, or
    2.) provide an example using a <asp:RequiredFieldValidator .../>*  or
    3.) show me where the js function is that I can hijack.


    *I wired up an asp:RequiredFieldValidator and it throws the error text onto the designer screen the way that it should but it does not stop the postback.  So this is kinda close but I have no where to put the if(Page.IsValid)

  6. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    19 Sep 2016
    11 Feb 2011
    Link to this post
    Hello Phil,


    FormsManager is required when the TextField is set in write mode. The problem here is that forcing "CausesValidation" over Save button. So here is what you have to do

    - create delegate that is added on page load and cancel the changes before saving. You should read the value from the field you want to validate so you can return true or false inside
    cancelEventArgs.set_cancel(true)

       _beforeSaveChangesHandler: function (sender, cancelEventArgs) {
            cancelEventArgs.set_cancel(true);


    Type.registerNamespace("Telerik.Sitefinity.Samples");
     
    Telerik.Sitefinity.Samples.SimpleViewCustomDesigner = function (element) {
     
        // element
     
        this._pageLoadDelegate = null;
        this._beforeSaveChangesDelegate = null;
        Telerik.Sitefinity.Samples.SimpleViewCustomDesigner.initializeBase(this, [element]);
     
    }
     
    Telerik.Sitefinity.Samples.SimpleViewCustomDesigner.prototype = {
     
        initialize: function () {
            Telerik.Sitefinity.Samples.SimpleViewCustomDesigner.callBaseMethod(this, 'initialize');
     
            this._pageLoadDelegate = Function.createDelegate(this, this._pageLoadHandler);
              Sys.Application.add_load(this._pageLoadDelegate);
     
     
           
     
        },
     
        dispose: function () {
            Telerik.Sitefinity.Samples.SimpleViewCustomDesigner.callBaseMethod(this, 'dispose');
     
            // ! here dispose the delegate
     
        },
     
        /* --------------------------------- event handlers --------------------------------- */
     
        // Handles the page load event
        _pageLoadHandler: function () {
     
            this._beforeSaveChangesDelegate = Function.createDelegate(this, this._beforeSaveChangesHandler);
            this.get_propertyEditor().add_beforeSaveChanges(this._beforeSaveChangesDelegate);
     
        },
     
            // the event is fired when the user choses save, before the data processing
          _beforeSaveChangesHandler: function (sender, cancelEventArgs) {
            cancelEventArgs.set_cancel(true);
        },
     
     
     
        /* ----------------------------- public methods ----------------------------- */
     
         
        refreshUI: function () {
             
        },
     
        // forces the designer to apply the changes on UI to the cotnrol Data
        applyChanges: function () {
          
        }
     
    }
     
    Telerik.Sitefinity.Samples.SimpleViewCustomDesigner.registerClass('Telerik.Sitefinity.Samples.SimpleViewCustomDesigner', Telerik.Sitefinity.Web.UI.ControlDesign.ControlDesignerBase);
     
    if (typeof (Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();



    We are going to prepare a blog post or documentation article about validation in the control designer.

    Best wishes,
    Ivan Dimitrov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  7. Andrei
    Andrei avatar
    553 posts
    Registered:
    27 Nov 2008
    14 Apr 2011
    Link to this post
    Hi,

    I am trying to edit some of the font-sizes in one of the News List / Item templates, but keep
    getting: 

    asp:Literal ('System.Web.UI.WebControls.Literal'): cannot set attribute with name 'Font' to 'Medium'

    When tracking the CSS, it seems to be embedded so can change the CSS. What's the best way for me to
    mess around with the Font-Sizes?

    Many thanks,
    Andrei

  8. Andrei
    Andrei avatar
    553 posts
    Registered:
    27 Nov 2008
    14 Apr 2011
    Link to this post
    sorry, figured it out. thanks
8 posts, 0 answered