0

我正在使用 asp.net 开发 mvc 4，我想验证出生日期，因此用户无法选择未来的日期，我该怎么做？

<script>
    $(document).ready(function () {
        $("#DOB").datepicker({
            dateFormat: "m/d/yy",
        });
    });
</script>
@Html.TextBox("DOB", Model.DOB.ToString("MM/dd/yyyy"), new { @class = "cssClass" })

我不想要服务器端验证我想在客户端验证。我可以用正则表达式验证它吗？

解决方案：

$(document).ready(function () {
        $("#DOB").datepicker({
            dateFormat: "m/d/yy",
        }).change(function () {
            var date = new Date($("#DOB").val());
            var now = new Date();
            if (date > now) {
                alert("Please enter valid date.");
            }
        });
    });
4

1 回答 1

0

像几乎任何在线网站一样，为日、月和年创建 3 个字段。
用值填充字段。
然后，您可以根据自己的意愿填充年份下拉列表。
您可以简单地使用更改事件来验证其他字段。
另外，您可以简单地使用日 + 月 + 年，生成日期值，然后与 your_date <= new date() 进行比较，
否则，您将不得不担心字符串可能具有的所有不同日期格式，这使得无法验证它.

请参阅此处：
使用 HTML/PHP 的生日表单

像这样的东西：

<!doctype html>
<html itemscope="itemscope" itemtype="http://schema.org/WebPage">

<head>

    <title>Hello</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>


    <script type="text/javascript">


        function isLeapYear(iYear)
        {
            return (new Date(iYear, 1, 29).getMonth() == 1);
        }

        function getMonthLength(month, year)
        {
            month = month - 1;

            var monthStart = new Date(year, month, 1);
            var monthEnd = new Date(year, month + 1, 1);
            var monthLength = (monthEnd - monthStart) / (1000 * 60 * 60 * 24);

            return monthLength;
        }


        function PopulateDayDropdown(iMonth, iYear)
        {
            for (i = 1; i < getMonthLength(iMonth, iYear) + 1; i++)
            {
                $('<option/>').val(i).html(i).appendTo('#selDay');
            }


        }

        function PopulateMonthDropdown()
        {

            var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];



            for (i = 0; i < months.length; i++)
            {
                $('<option/>').val(i + 1).html(months[i]).appendTo('#selMonth');
            }

        }


        function PopulateYearDropdown()
        {

            var iCurYear = new Date().getFullYear();

            for (i = iCurYear - 100; i <= iCurYear; i++)
            {
                $('<option/>').val(i).html(i).appendTo('#selYear');
            }

            //$('select option[value="' + iCurYear + '"]').html();
            $('#selYear option[value="' + iCurYear + '"]').attr("selected", "selected")

        }



        $(document).ready(function ()
        {
            // Handler for .ready() called.
            PopulateDayDropdown(1, new Date().getFullYear());
            PopulateMonthDropdown();
            PopulateYearDropdown();



            //$('select[name="month"]').change(function()
            $('select').change(function ()
            {
                //alert("2012 leap year? " + isLeapYear(2012) + "\n" + "2013 leap year? " + );

                var iDay = $("#selDay").val();
                var iMonth = $("#selMonth").val();
                var iYear = $("#selYear").val();

                if (this.id == "selMonth" || this.id == "selYear")
                {
                    $('#selDay').empty();
                    PopulateDayDropdown(iMonth, iYear);
                    $('#selDay option[value="' + iDay + '"]').attr("selected", "selected")
                }


                if (iDay > getMonthLength(iMonth, iYear))
                {
                    var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
                    alert("There is no " + iDay + "th " + months[iMonth - 1] + ".");

                }



                var d = new Date(iYear, iMonth - 1, iDay, 0, 0, 0, 0);


                if (d > new Date())
                {
                    $('#selDay option[value="' + 1 + '"]').attr("selected", "selected")
                    $('#selMonth option[value="' + 1 + '"]').attr("selected", "selected")
                    alert("Future dates are not allowed (values have been reset to January 1st).");
                    return;
                }


                alert("New date of birth: " + d);

            });


        });

    </script>


</head>


<body>


<form action="registration.php" method="post">

    <p>Select date:</p>


    <select id="selDay" name="day">
    </select>



    <select id="selMonth" name="month">
    <!--
    <option value="January">January</option>
    <option value="February">February</option>
    <option value="Mars">Mars</option>
    <option value="April">April</option>
    <option value="May">May</option>
    <option value="June">June</option>
    <option value="July">July</option>
    <option value="September">September</option>
    <option value="October">October</option>
    <option value="November">November</option>
    <option value="December">December</option>
    -->
    </select>

    <select id="selYear" name="year">

    </select>

    <br/><br/>

    <input type="submit" value="Submit" />

</form>

</body>
</html>
于 2013-06-18T10:37:08.020 回答