Rangevalidator does not work when mindate and maxdate is set

13 posts, 2 answers
  1. Jomey
    Jomey avatar
    60 posts
    Member since:
    Jan 2008

    Posted 30 Mar 2008 Link to this post

    If I set the mindate and maxdate values in the RadDatePicker, then the rangevalidator control does not work.  It uses the built in validation and highlights the box red.  I can set ClientEvents-OnError="OnError", but I don't want it to call that event everytime there's an error.  I mean I need to display to the user the correct error message in a alert box.  If it calls OnError everytime there is a error, then what if it's an invalid date (alpha characters) vs invalid date range entered vs required field.

    The user has to know which error he committed.  The proper alert has to be displayed.

    If I don't set the mindate and maxdate, the rangevalidator works. 
  2. Giuseppe
    Admin
    Giuseppe avatar
    2363 posts

    Posted 31 Mar 2008 Link to this post

    Hi Jomey,

    Besides the visible input field that the user can type into, the RadDatePicker registers a hidden input field that is used for validation by the respective validation controls. When you set MinDate / MaxDate for the datepicker control and enter an invalid date (out-of-range), you can still see the erroneous output in the visible input field but the validation field (used by the validator controls) remains empty (after all there is NO valid selected date at the moment). Therefore RangeValidator is not activated as the only control that validates empty string is the RequiredFieldValidator.

    You can detect the actual error reason on DateInput OnError client-side event like this:

    <script type="text/javascript"
    function OnError(sender, args) 
        if (args.get_reason() == Telerik.Web.UI.InputErrorReason.ParseError) 
        { 
            alert("parse error"); 
        } 
        else if (args.get_reason() == Telerik.Web.UI.InputErrorReason.OutOfRange) 
        { 
            alert("out of range"); 
        } 
    </script> 
     
    <telerik:RadDatePicker ID="RadDatePicker1" runat="server" MinDate="2008/3/1" MaxDate="2008/3/31"
        <DateInput> 
            <ClientEvents OnError="OnError" /> 
        </DateInput> 
    </telerik:RadDatePicker> 



    Best wishes,
    Manuel
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. Jomey
    Jomey avatar
    60 posts
    Member since:
    Jan 2008

    Posted 31 Mar 2008 Link to this post

    I followed what you have and it worked, but if I put it in a usercontrol.  Then put both 2 usercontrols on my aspx page.  The customvalidate function fires twice for each date. 

    Because it skips the OnError function- on the valid datepicker - it calls the CustomValidate directly (the invalidInput is automatically true).  It got this value from the 1st datepicker that was invalid.

    So it thinks both datepicker controls are invalid.  Instead of just 1.

    Any way around this:

    Javascript code posted

    <

    script type="text/javascript">

     

    var

    invalidInput = false;

     

    var

    errmessage = "";

     

    function

    OnDateSelected(sender, args)

    {

    invalidInput =

    false;

    }

     

    function

    OnError(sender, args)

    {

    var picker = $find("<%= RadDatePicker1.ClientID %>");

    var textBox = picker.get_textBox();

    alert(sender.get_textBoxValue());

     

    if (args.get_reason() == Telerik.Web.UI.InputErrorReason.ParseError)

    {

    errmessage=

    "Date parse error";

    invalidInput =

    true;

    }

    else if (args.get_reason() == Telerik.Web.UI.InputErrorReason.OutOfRange)

    {

    errmessage=

    "Date out of range";

    invalidInput =

    true;

    }

    alert(errmessage);

    }

     

    function

    CustomValidate(sender, args)

    {

    var customVal = document.all ? document.all["<%= CustomValidator1.ClientID %>"] : document.getElementById("<%= CustomValidator1.ClientID %>");

    customVal.errormessage = errmessage;

    if (invalidInput)

    args.IsValid =

    false;

    }

     

    </

    script>

  4. Giuseppe
    Admin
    Giuseppe avatar
    2363 posts

    Posted 01 Apr 2008 Link to this post

    Hi Jomey,

    We are not quite sure whether we understand you correctly but if you are registering the JavaScript functions OnDateSelected / OnError / CustomValidate in the user control, and you place two user control instances on the page, you will be effectively overwriting the functions as their names are the same -- we would suggest you in such case to prefix them with the user control ID like this UserControl1_OnDateSelected, UserControl2_OnDateSelected, etc.

    If you still experience problems, please open a formal support ticket and send us a runnable sample application that we can investigate locally.


    Kind regards,
    Manuel
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  5. Jomey
    Jomey avatar
    60 posts
    Member since:
    Jan 2008

    Posted 01 Apr 2008 Link to this post

    Exactly I have the functions and the calendar in the usercontrol.

    The only thing I have in the aspx page is this:

    <uc1:TelerikCalendar ID="TelerikCalendar2" runat="server" DateRequired="false" DateFrom="01/01/2008" DateTo="03/31/2008" RaiseEvent=false ValidationGroupName="1"/>

    Not sure what you mean by this:
    we would suggest you in such case to prefix them with the user control ID like this UserControl1_OnDateSelected, UserControl2_OnDateSelected, etc

  6. Jomey
    Jomey avatar
    60 posts
    Member since:
    Jan 2008

    Posted 01 Apr 2008 Link to this post

    "we would suggest you in such case to prefix them with the user control ID like this UserControl1_OnDateSelected, UserControl2_OnDateSelected, etc."

    How would I change the name of the javascript function inside the usercontrol?
  7. Answer
    Giuseppe
    Admin
    Giuseppe avatar
    2363 posts

    Posted 02 Apr 2008 Link to this post

    Hi Jomey,

    You can do this like this:

    ASCX
    <script type="text/javascript">  
    function <%= this.ClientID %>_OnError(sender, args)  
    {  
        if (args.get_reason() == Telerik.Web.UI.InputErrorReason.ParseError)  
        {  
            alert("parse error");  
        }  
        else if (args.get_reason() == Telerik.Web.UI.InputErrorReason.OutOfRange)  
        {  
            alert("out of range");  
        }  
    }  
    </script>  
      
    <telerik:RadDatePicker ID="RadDatePicker1" runat="server" MinDate="2008/3/1" MaxDate="2008/3/31">  
    </telerik:RadDatePicker>  

    Code-behind
    protected void Page_Load(object sender, EventArgs e) 
        RadDatePicker1.DateInput.ClientEvents.OnError = string.Format("{0}_OnError", this.ClientID); 


    Hope this helps.


    Best wishes,
    Manuel
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  8. Jomey
    Jomey avatar
    60 posts
    Member since:
    Jan 2008

    Posted 03 Apr 2008 Link to this post

    Instead of this in the html source, I want to write the function on the codebehind and call it.  But when I did it - it said the object was undefined.  When I have the jscript function in the html source it works, but if I put it in the codebehind instead it doesn't work.  It's like it doesn't recognize the object.

    This works in html source
    <
    script type="text/javascript">

    var

    <%= this.ClientID %>invalidInput = false;

    var

    <%= this.ClientID %>errmessage = "";

    function

    <%= this.ClientID %>_OnDateSelected(sender, args)

    {

    <%=

    this.ClientID %>invalidInput = false;

    }

    </

    script>


    I want to do it on the codebehind like this, instead of the html source on the usercontrol load:

    String scriptString = "<script language=JavaScript> var " + this.ClientID + "invalidInput = false;";

    scriptString += "var " + this.ClientID + "errmessage = '';";

    scriptString += "function " + this.ClientID + "_OnDateSelected(sender, args) { " + this.ClientID + "invalidInput=false; }";

    scriptString += "</script>";

    this.Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "clientScript", scriptString);

    then call 

    RadDatePicker1.ClientEvents.OnDateSelected =

    string.Format("{0}_OnDateSelected", this.ClientID);

  9. Jomey
    Jomey avatar
    60 posts
    Member since:
    Jan 2008

    Posted 03 Apr 2008 Link to this post

    It's erroring out here:

    function Sys$_Application$add_init(handler) {

    /// <summary locid="E:J#Sys._Application.init" />

    var e = Function._validateParams(arguments, [{name: "handler", type: Function}]);

    if (e) throw e;

    if (this._initialized) {

    handler(

    this, Sys.EventArgs.Empty);

    }

    else {

    this.get_events().addHandler("init", handler);

    }

    }

  10. Jomey
    Jomey avatar
    60 posts
    Member since:
    Jan 2008

    Posted 03 Apr 2008 Link to this post

    When I try to dynamically load the usercontrol - i get the same error:

    When I load the usercontrol using (LoadControl).  It has to do with the javascript functions on the top.  OnError, etc...

    function Sys$_Application$add_init(handler) {

    ///

    <summary locid="E:J#Sys._Application.init" />

    var e = Function._validateParams(arguments, [{name: "handler", type: Function}]);

    if (e) throw e;

    if (this._initialized) {

    handler(this, Sys.EventArgs.Empty);

    }

    else {

    this.get_events().addHandler("init", handler);

    }

    }

  11. Answer
    Giuseppe
    Admin
    Giuseppe avatar
    2363 posts

    Posted 04 Apr 2008 Link to this post

    Hello Jomey,

    We are unable to reproduce any problems when registering the client script block from the server-side. Please review the attached sample application and let us know how it goes.


    Regards,
    Manuel
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  12. Jomey
    Jomey avatar
    60 posts
    Member since:
    Jan 2008

    Posted 04 Apr 2008 Link to this post

    If you load the usercontrol dynamically OR set a parameter property to not load the control on startup.  AND if you put the usercontrols or panels on the aspx page inside a UpdatePanel.  It fails.

    After the page loads.  I click on Button2.  This loads the usercontrols that u created on the aspx page.  Or sets the property to true so that the user control page load executes.

    aspx page

    <asp:UpdatePanel ID="UpdatePanel2" runat="server" UpdateMode="Conditional">

    <Triggers>

    <asp:AsyncPostBackTrigger ControlID="Button1" EventName="Click" />

    <asp:AsyncPostBackTrigger ControlID="Button2" EventName="Click" />

    </Triggers>

    <contenttemplate>

    <asp:Panel ID="pnlWebUserControl1" runat="server">

    </asp:Panel>

    <asp:Panel ID="pnlWebUserControl2" runat="server">

    </asp:Panel>

    </contenttemplate>

    </asp:UpdatePanel> 

    <asp:Button ID="Button1" runat="server" Text="Button" />

     

    <asp:Button ID="Button2" runat="server" Text="Show Calendars"

    onclick="Button2_Click" />

    ASPX PAGE CODE BEHIND

    protected void Button2_Click(object sender, EventArgs e)

    {

    //WebUserControl1.LoadUserControl();

     

    //WebUserControl2.LoadUserControl();

     

    loadcalendarcontrol(

    "WebUserControl1", pnlWebUserControl1);

    loadcalendarcontrol(

    "WebUserControl1", pnlWebUserControl2);

    }

    public void loadcalendarcontrol(string strname, Panel pnlDate)

    {

    ASP.

    webusercontrol_ascx ucTelerik;

    ucTelerik = (ASP.

    webusercontrol_ascx)LoadControl("WebUserControl.ascx");

    ucTelerik.ID = strname;

    ucTelerik.Visible =

    true;

    ucTelerik.DontLoadControl =

    false;

    pnlDate.Controls.Add(ucTelerik);

    }

  13. Jomey
    Jomey avatar
    60 posts
    Member since:
    Jan 2008

    Posted 04 Apr 2008 Link to this post

    Fixed I had to use ScriptManager.RegisterClientScriptBlock that got rid of any errors.

    Thanks for all your help.
Back to Top