Jquery Date Validation Example using Regular Expression in Asp.Net C# VB.Net

As a developer more often we need to validate input date. For better user experience we need to validate from client side first. That’s why in this article I will explain how to validate a date using Jquery in two most popular format. First one is “mm/dd/yyyy” date format & second one is “dd/mm/yyyy” date format. To do the example i have write the code to ensure proper & perfect date validation like:

1. Check empty value
2. Pass through the input to a Regular Expression
3. Spitted the input date into Day, Month, Year
4. Validate Day, Month & Year by getDate(), getMonth() & getFullYear() method for better accuracy.

Objective/Output:
Jquery Date Validation Example using Regular Expression in Asp.Net Csharp VB.Net

To do the example use below HTML Markup:

    <asp:Label ID="Label1" runat="server" Text="Enter Date (mm/dd/yyyy):"></asp:Label><br />
    <asp:TextBox ID="txtDate" runat="server"></asp:TextBox><br /><br />
    <asp:Button ID="cmdCheckDate" runat="server" Text="Check Date" />

Jquery Code to Validate Date User Input in “mm/dd/yyyy” Format:

        <script type="text/javascript">
            $(document).ready(function () {
                $('#<%=cmdCheckDate.ClientID %>').click(function () {
                    var inputDate = $('#<%=txtDate.ClientID %>').val();
                    var Reg_Expression = /^\d{1,2}\/\d{1,2}\/\d{4}$/;
                    if (Reg_Expression.test(inputDate)) {
                        var partitionedDate = inputDate.split('/');
                        var nMonth = parseInt(partitionedDate[0], 10);
                        var nDay = parseInt(partitionedDate[1], 10);
                        var nYear = parseInt(partitionedDate[2], 10);

                        var dDate = new Date(nYear, nMonth - 1, nDay);

                        if ((dDate.getFullYear() == nYear) && (dDate.getMonth() == nMonth - 1) && (dDate.getDate() == nDay))
                            alert('Correct Date Format..');
                        else
                            alert('Incorrect Date Format..');
                    }
                    else
                        alert('Incorrect Date Format..');
                });
            });  
    </script>

Jquery Code to Validate Date User Input in “dd/mm/yyyy” Format:

        <script type="text/javascript">
            $(document).ready(function () {
                $('#<%=cmdCheckDate.ClientID %>').click(function () {
                    var inputDate = $('#<%=txtDate.ClientID %>').val();
                    var Reg_Expression = /^\d{1,2}\/\d{1,2}\/\d{4}$/;
                    if (Reg_Expression.test(inputDate)) {
                        var partitionedDate = inputDate.split('/');
                        var nDay = parseInt(partitionedDate[0], 10);
                        var nMonth = parseInt(partitionedDate[1], 10);
                        var nYear = parseInt(partitionedDate[2], 10);

                        var dDate = new Date(nYear, nMonth - 1, nDay);

                        if ((dDate.getFullYear() == nYear) && (dDate.getMonth() == nMonth - 1) && (dDate.getDate() == nDay))
                            alert('Correct Date Format..');
                        else
                            alert('Incorrect Date Format..');
                    }
                    else
                        alert('Incorrect Date Format..');
                });
            });  
    </script>

Hope now you can validate date user input using Jquery with the help of regular expression in your Asp.Net application.

Download Code Example C#        Download Code Example VB.Net

Posted in .Net, Asp.net, C#, Client, JQuery, VB.Net

Leave a Reply

Your email address will not be published. Required fields are marked *

AlphaOmega Captcha Classica  –  Enter Security Code
     
 

*