Rangevalidator does not work when mindate and maxdate is set

[Jomey]

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. 

[Giuseppe]

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

[Jomey]

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>

[Giuseppe]

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

[Jomey]

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

[Jomey]

"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?

[Giuseppe]

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

[Jomey]

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);

[Jomey]

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);

}

}

[Jomey]

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);

}

}

[Giuseppe]

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

[Jomey]

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);

}

[Jomey]

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

Thanks for all your help.