RadDateTimePicker and Required Field Validation

8 posts, 0 answers
  1. Marco
    Marco avatar
    8 posts
    Member since:
    Feb 2011

    Posted 13 Apr 2011 Link to this post

    Hi,

    Obviously, it is not possible to use the RadInputManager with telerik controls. In addition to that, components like RadDateTimePicker do not have a Required="True|False" attribute. Therefore, I have to deal with an ordinary asp:RequiredFieldValidator.

    But how is it possible that I have the same look and feel across all my controls. I want this little warning triangle and a red border instead of an error message next to the field that is controlled by the required field validator.

    Thanks in advance for any solution.
  2. Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 18 Apr 2011 Link to this post

    Hello Marco,

    In order to apply the required functionality I would suggest you to use CustomValidator instead of RequiredFieldValidator. In this case in the ClientValidationFunction of the validator you can check if the input is empty and if it is you can apply "riError" style to the input component.

    I hope this helps.

    Best wishes,
    Maria Ilieva
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Marco
    Marco avatar
    8 posts
    Member since:
    Feb 2011

    Posted 18 Apr 2011 Link to this post

    Hello Maria,

    When I put a breakpoint into the javascript function, I can see that the style class is applied and the red border along with the warning traingle is shown. But when my custom validation method has returned, one of your methods seem to overwrite my className because the style disappears.

    When I add an alert('Hello') to my custom code, I can see the wanted style class. But when I click the alert dialog, the warning sign disappears.

    Regards.
  5. Marco
    Marco avatar
    8 posts
    Member since:
    Feb 2011

    Posted 18 Apr 2011 Link to this post

    Hello once again,

    Finally, I made it without assigning the riError class explicitly. I just marked the appropriate dateInput field as invalid so that the riError class was assigned as usual. All I have to take care of is to follow a naming convention for the customValidator and the control to be validated.

    Can you please tell me if this solution might have some drawbacks that I do not see currently?

    /* Checks whether a required DateTimePicker provides an input
    */
    function CheckDateRequired(source, arguments) {
     
        // Uses this scenario:
        //  <telerik:RadDateTimePicker ID="StartDate" runat="server" DateFormat="g" />
        //
        //  <asp:CustomValidator ID="StartDate_Required"
        //   ClientValidationFunction="CheckDateRequired" ControlToValidate="StartDate"
        //   runat="server" ValidateEmptyText="true"  />
        var controlToValidateId = source.id.replace(/_Required/g, "");
        if (arguments.Value.trim() == "") {
            $find(controlToValidateId).get_dateInput()._invalid = true;
            $find(controlToValidateId).get_dateInput().updateCssClass();
            arguments.IsValid = false;
        }
        else {
            $find(controlToValidateId).get_dateInput()._invalid = false;
            arguments.IsValid = true;
        }
    }

    Thank you very much in advance.
    Marco
  6. Maria Ilieva
    Admin
    Maria Ilieva avatar
    4017 posts

    Posted 20 Apr 2011 Link to this post

    Hi Marco,

    Thank you for the update on this issue.

    I also tested the provided suggestion on my side and it works correct for me. The code looks ok and there shouldn’t be any issues when using it in your application. I will continue testing it on my side and will let you know if any problems appear. Please do let us know if you also face some problems with it in future


    Greetings,
    Maria Ilieva
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  7. Mark Kucera
    Mark Kucera avatar
    84 posts
    Member since:
    Sep 2009

    Posted 13 Dec 2013 Link to this post

    Just wanted to say that i just found this solution tonight and it seems to work great.  This is exactly what i was looking for!

    -Mark
  8. Rahul
    Rahul avatar
    39 posts
    Member since:
    Jan 2014

    Posted 08 Jan 2014 Link to this post

    Hi Maria,
                          How use CustomeValidator on Date picker when date picker is empty show error message please provide sample code.

    Thanks,
    Rahul
  9. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 09 Jan 2014 Link to this post

    Hi Rahul,

    Please have a look into the following code snippet to achieve your scenario.

    ASPX:
    <telerik:RadDatePicker ID="RadDatePicker1" runat="server">
    </telerik:RadDatePicker>
    <asp:CustomValidator ID="CustomValidator1" runat="server" ClientValidationFunction="Validate"
        ErrorMessage="Required">
    </asp:CustomValidator>
    <telerik:RadButton ID="RadButton1" runat="server" Text="Validate" AutoPostBack="false">
    </telerik:RadButton>

    JS:
    <script type="text/javascript">
        function Validate(sender, args) {
            var date = $find("<%=RadDatePicker1.ClientID %>");
            if (date.get_textBox().value == "")
                args.IsValid = false;
            else
                args.IsValid = true;
        }
    </script>

    Thanks,
    Princy.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017