ValidatorCalloutExtender Doesn't Show for RadDatePicker

6 posts, 0 answers
  1. Sam
    Sam avatar
    3 posts
    Member since:
    Apr 2013

    Posted 28 Oct 2015 Link to this post

    Hello

    I am validating a RadDatePicker control using a RequiredFieldValidator and a ValidatorCalloutExtender.

    The control is being validated successfully but the ValidatorCalloutExtender is not showing/popping up when the input date is invalid/empty. It also doesn't highlight the RadDateTime input box yellow when its empty/invalid.

    Any ideas why this would be failing to display when other widgets (regular TextBoxes, etc.) have their ValidatorCalloutExtender's working?

    <telerik:RadDatePicker ID="Expiry" runat="server" ClientIDMode="Static"> ... </telerik:RadDatePicker>
    <asp:RequiredFieldValidator ID="rfvExpiry" runat="server" ErrorMessage="Expiry is a required field" SetFocusOnError="true"
        ControlToValidate="Expiry" Text="*"  ClientIDMode="Static" />
    <ajaxtoolkit:ValidatorCalloutExtender ID="vcerfvExpiry" runat="Server" TargetControlID="rfvExpiry" Width="350px" HighlightCssClass="highlight"
        WarningIconImageUrl="warning.gif" CloseImageUrl="close.gif" />

  2. Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 30 Oct 2015 Link to this post

    Hi Sam,

    I tested the described scenario on my end and it appears to work correctly. Find attached my tests applictaion and verify what the difference in your case is.


    Regards,
    Maria Ilieva
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Sam
    Sam avatar
    3 posts
    Member since:
    Apr 2013

    Posted 01 Nov 2015 in reply to Maria Ilieva Link to this post

    Hi Maria

     Thanks for your response. Below is a simple example that demonstrates the error. There are multiple RadDatePickers (RDP). The first RDP's Callout Extender works fine but if I fill in the top/first picker then click 'Next' in the wizard the ValidatorCalloutExtender for the others does not appear (sometimes the 4th one will). In this case the second ValidatorCalloutExtender should show but it doesn't.

    If I put the focus in the second picker then click 'Next' sometimes the ValidatorCalloutExtender will show.

     Any ideas how to fix this?

     

    <%@ Page Title="" Language="VB" MasterPageFile="~/MasterPage.master" AutoEventWireup="false" CodeFile="Debug.aspx.vb" Inherits="D_Debug" %>
     
    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
    <%@ Register Namespace="AjaxControlToolkit" TagPrefix="ajaxtoolkit" Assembly="AjaxControlToolkit" %>
     
    <asp:Content ID="Content2" ContentPlaceHolderID="cphBody" runat="Server">
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
            <Scripts>
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
            </Scripts>
        </telerik:RadScriptManager>
        <telerik:RadAjaxManager runat="server" ID="RadAjaxManager1"> </telerik:RadAjaxManager>
     
        <div id="checkApp">
     
            <telerik:RadTabStrip ID="rtsReports" runat="server" Skin="Outlook" MultiPageID="rnpReports" SelectedIndex="3">
                <Tabs>
                    <telerik:RadTab Text="Start" SelectedCssClass="SelectedTab" />
                    <telerik:RadTab Text="Middle" Enabled="false" SelectedCssClass="SelectedTab" />
                    <telerik:RadTab Text="Finish" Enabled="false" SelectedCssClass="SelectedTab" />
                </Tabs>
            </telerik:RadTabStrip>
     
            <div id="body">
                <asp:Wizard ID="wzdRegister" runat="server" DisplaySideBar="False" FinishCompleteButtonText="Submit" ActiveStepIndex="0">
     
                    <WizardSteps>
                        <asp:WizardStep ID="wzsIdentification" runat="server" Title="Identification">
     
                            <telerik:RadDatePicker ID="Expiry" runat="server" ClientIDMode="Static"></telerik:RadDatePicker>
                            <asp:RequiredFieldValidator ID="rfvExpiry" runat="server" ErrorMessage="Expiry is a required field" SetFocusOnError="true"
                                ControlToValidate="Expiry" Text="*"  ClientIDMode="Static" />
                            <ajaxtoolkit:ValidatorCalloutExtender ID="vcerfvExpiry" runat="Server" TargetControlID="rfvExpiry" Width="350px" HighlightCssClass="highlight"
                                WarningIconImageUrl="warning.gif" CloseImageUrl="close.gif" />
                            <br />
     
                            <telerik:RadDatePicker ID="RadDatePicker1" runat="server" ClientIDMode="Static"></telerik:RadDatePicker>
                            <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="Expiry is a required field" SetFocusOnError="true"
                                ControlToValidate="RadDatePicker1" Text="*"  ClientIDMode="Static" />
                            <ajaxtoolkit:ValidatorCalloutExtender ID="ValidatorCalloutExtender1" runat="Server" TargetControlID="RequiredFieldValidator1" Width="350px" HighlightCssClass="highlight"
                                WarningIconImageUrl="warning.gif" CloseImageUrl="close.gif" />
                            <br />
     
                            <telerik:RadDatePicker ID="RadDatePicker2" runat="server" ClientIDMode="Static"></telerik:RadDatePicker>
                            <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="Expiry is a required field" SetFocusOnError="true"
                                ControlToValidate="RadDatePicker2" Text="*"  ClientIDMode="Static" />
                            <ajaxtoolkit:ValidatorCalloutExtender ID="ValidatorCalloutExtender2" runat="Server" TargetControlID="RequiredFieldValidator2" Width="350px" HighlightCssClass="highlight"
                                WarningIconImageUrl="warning.gif" CloseImageUrl="close.gif" />
                            <br />
     
                            <telerik:RadDatePicker ID="RadDatePicker3" runat="server" ClientIDMode="Static"></telerik:RadDatePicker>
                            <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ErrorMessage="Expiry is a required field" SetFocusOnError="true"
                                ControlToValidate="RadDatePicker3" Text="*"  ClientIDMode="Static" />
                            <ajaxtoolkit:ValidatorCalloutExtender ID="ValidatorCalloutExtender3" runat="Server" TargetControlID="RequiredFieldValidator3" Width="350px" HighlightCssClass="highlight"
                                WarningIconImageUrl="warning.gif" CloseImageUrl="close.gif" />
                            <br />
                        </asp:WizardStep>
     
                        <asp:WizardStep ID="WizardStep1" runat="server" Title="Identification">
                            Step 2
                        </asp:WizardStep>
     
                        <asp:WizardStep ID="WizardStep2" runat="server" Title="Identification">
                            Final Step
                        </asp:WizardStep>
     
                    </WizardSteps>
     
                    <StartNavigationTemplate>
                        <input type="button" id="btnAccept" class="hidden" title="Accept" value="Accept" onclick="return false;" class="btn" />
                        <asp:Button ID="btnNext" runat="server" CommandName="MoveNext" Text="Next" class=" btnNext" />
                        <asp:Button ID="btnCancel" runat="server" Text="Cancel" OnClick="btnCancel_Click" Visible="false" class="btn" CausesValidation="false" />
                        <asp:Button ID="btnSave" runat="server" Text="Submit" OnClick="btnSave_Click" Visible="false" class="btn" />
                    </StartNavigationTemplate>
     
                    <StepNavigationTemplate>
                        <asp:Button ID="btnPrevious" runat="server" CommandName="MovePrevious" Text="Previous" CausesValidation="false" class="btn" />
                        <asp:Button ID="btnNext" runat="server" CommandName="MoveNext" Text="Next" class="btn" />
                        <asp:Button ID="btnCancel" runat="server" Text="Cancel" OnClick="btnCancel_Click" Visible="false" class="btn" CausesValidation="false" />
                        <asp:Button ID="btnSave" runat="server" Text="Submit" OnClick="btnSave_Click" Visible="false" class="btn" />
                    </StepNavigationTemplate>
     
                    <FinishNavigationTemplate>
                        <asp:Button ID="btnSubmit" runat="server" CommandName="MoveComplete" Text="Submit" class="btnNext" />
                    </FinishNavigationTemplate>
                </asp:Wizard>
     
            </div>
        </div>
    </asp:Content>

  5. Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 02 Nov 2015 Link to this post

    Hi,

    Please remove the ClienIDMode that is set to Static from the controls on the page and see how it goes.

    Regards,
    Maria Ilieva
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  6. Sam
    Sam avatar
    3 posts
    Member since:
    Apr 2013

    Posted 02 Nov 2015 in reply to Maria Ilieva Link to this post

    Hi Maria,

    I tried this but it doesn't work - see code below. Have you been able to replicate the error aswell? Its a funny thing where the 2nd, 3rd and 4th ValidatorCalloutExtender's dont show.

     

    <%@ Page Title="" Language="VB" MasterPageFile="~/MasterPage.master" AutoEventWireup="false" CodeFile="Debug.aspx.vb" Inherits="D_Debug" %>
     
    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
    <%@ Register Namespace="AjaxControlToolkit" TagPrefix="ajaxtoolkit" Assembly="AjaxControlToolkit" %>
     
    <asp:Content ID="Content1" ContentPlaceHolderID="cphBody" runat="Server">
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
            <Scripts>
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
            </Scripts>
        </telerik:RadScriptManager>
        <telerik:RadAjaxManager runat="server" ID="RadAjaxManager1"> </telerik:RadAjaxManager>
     
        <div id="checkApp">
     
            <telerik:RadTabStrip ID="rtsReports" runat="server" Skin="Outlook" MultiPageID="rnpReports" SelectedIndex="3">
                <Tabs>
                    <telerik:RadTab Text="Start" SelectedCssClass="SelectedTab" />
                    <telerik:RadTab Text="Middle" Enabled="false" SelectedCssClass="SelectedTab" />
                    <telerik:RadTab Text="Finish" Enabled="false" SelectedCssClass="SelectedTab" />
                </Tabs>
            </telerik:RadTabStrip>
     
            <div id="body">
                <asp:Wizard ID="wzdRegister" runat="server" DisplaySideBar="False" FinishCompleteButtonText="Submit" ActiveStepIndex="0">
     
                    <WizardSteps>
                        <asp:WizardStep ID="wzsIdentification" runat="server" Title="Identification">
     
                            <telerik:RadDatePicker ID="Expiry" runat="server" ></telerik:RadDatePicker>
                            <asp:RequiredFieldValidator ID="rfvExpiry" runat="server" ErrorMessage="Expiry is a required field"
                                ControlToValidate="Expiry" Text="*"   />
                            <ajaxtoolkit:ValidatorCalloutExtender ID="vcerfvExpiry" runat="Server" TargetControlID="rfvExpiry" Width="350px" HighlightCssClass="highlight"
                                WarningIconImageUrl="warning.gif" CloseImageUrl="close.gif" />
                            <br />
     
                            <telerik:RadDatePicker ID="RadDatePicker1" runat="server" ></telerik:RadDatePicker>
                            <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="Expiry is a required field"
                                ControlToValidate="RadDatePicker1" Text="*"   />
                            <ajaxtoolkit:ValidatorCalloutExtender ID="ValidatorCalloutExtender1" runat="Server" TargetControlID="RequiredFieldValidator1" Width="350px" HighlightCssClass="highlight"
                                WarningIconImageUrl="warning.gif" CloseImageUrl="close.gif" />
                            <br />
     
                            <telerik:RadDatePicker ID="RadDatePicker2" runat="server" ></telerik:RadDatePicker>
                            <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="Expiry is a required field"
                                ControlToValidate="RadDatePicker2" Text="*"   />
                            <ajaxtoolkit:ValidatorCalloutExtender ID="ValidatorCalloutExtender2" runat="Server" TargetControlID="RequiredFieldValidator2" Width="350px" HighlightCssClass="highlight"
                                WarningIconImageUrl="warning.gif" CloseImageUrl="close.gif" />
                            <br />
     
                            <telerik:RadDatePicker ID="RadDatePicker3" runat="server" ></telerik:RadDatePicker>
                            <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ErrorMessage="Expiry is a required field"
                                ControlToValidate="RadDatePicker3" Text="*"   />
                            <ajaxtoolkit:ValidatorCalloutExtender ID="ValidatorCalloutExtender3" runat="Server" TargetControlID="RequiredFieldValidator3" Width="350px" HighlightCssClass="highlight"
                                WarningIconImageUrl="warning.gif" CloseImageUrl="close.gif" />
                            <br />
                        </asp:WizardStep>
     
                        <asp:WizardStep ID="WizardStep1" runat="server" Title="Identification">
                            Step 2
                        </asp:WizardStep>
     
                        <asp:WizardStep ID="WizardStep2" runat="server" Title="Identification">
                            Final Step
                        </asp:WizardStep>
     
                    </WizardSteps>
     
                    <StartNavigationTemplate>
                        <input type="button" id="btnAccept" class="hidden" title="Accept" value="Accept" onclick="return false;" class="btn" />
                        <asp:Button ID="btnNext" runat="server" CommandName="MoveNext" Text="Next" class=" btnNext" />
                        <asp:Button ID="btnCancel" runat="server" Text="Cancel" OnClick="btnCancel_Click" Visible="false" class="btn" CausesValidation="false" />
                        <asp:Button ID="btnSave" runat="server" Text="Submit" OnClick="btnSave_Click" Visible="false" class="btn" />
                    </StartNavigationTemplate>
     
                    <StepNavigationTemplate>
                        <asp:Button ID="btnPrevious" runat="server" CommandName="MovePrevious" Text="Previous" CausesValidation="false" class="btn" />
                        <asp:Button ID="btnNext" runat="server" CommandName="MoveNext" Text="Next" class="btn" />
                        <asp:Button ID="btnCancel" runat="server" Text="Cancel" OnClick="btnCancel_Click" Visible="false" class="btn" CausesValidation="false" />
                        <asp:Button ID="btnSave" runat="server" Text="Submit" OnClick="btnSave_Click" Visible="false" class="btn" />
                    </StepNavigationTemplate>
     
                    <FinishNavigationTemplate>
                        <asp:Button ID="btnSubmit" runat="server" CommandName="MoveComplete" Text="Submit" class="btnNext" />
                    </FinishNavigationTemplate>
                </asp:Wizard>
     
            </div>
        </div>
    </asp:Content>

  7. Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 03 Nov 2015 Link to this post

    Hi,

    I tested the code on my end and actually showing the extended message on the first picker only when next button is clicked is the expected behavior. You can see that after selecting a date for it the extender appears for the second one and the same is done for all pickers one by one till they become valid.

    Do let me know if you are expecting different behavior.

    Regards,
    Maria Ilieva
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017