JQuery DatePicker: проверить дату мм / дд / гггг - PullRequest
6 голосов
/ 26 апреля 2010

У меня есть текстовое поле и средство выбора даты рядом с ним, и я использую asp.net, и пользователь может ввести дату, а также выбрать дату из средства выбора даты.

Как бы вы проверили правильность введенной даты?

  <script type="text/javascript"> 
        $(document).ready(function () { 
            $('#<%=StartDate.ClientID%>').datepicker({ showOn: 'button', 
                    buttonImage: '../images/Calendar.png', 
                    buttonImageOnly: true, onSelect: function () { }, 
                    onClose: function () { $(this).focus(); } 
            }); 
        }); 
    </script> 

Ответы [ 4 ]

33 голосов
/ 22 июля 2010

Я использую этот обработчик для проверки ввода:

   onClose: function(dateText, inst) {
        try {
            $.datepicker.parseDate('dd/mm/yy', dateText);
        } catch (e) {
            alert(e);
        };

Надеюсь, кому-нибудь будет полезно

4 голосов
/ 21 октября 2010

Я использую сочетание подхода Katrin & Doc Holiday, используя метод утилиты parseDate элемента управления datepicker в пользовательском валидаторе, который я назвал isDate.

Просто измените аргумент формата в parseDate на соответствующее значение (ссылка: http://docs.jquery.com/UI/Datepicker/parseDate).

    $(document).ready(function()
    {
        $.validator.addMethod('isDate', function(value, element)
        {
            var isDate = false;
            try
            {
                $.datepicker.parseDate('dd/mm/yy', value);
                isDate = true;
            }
            catch (e)
            {

            }
            return isDate;
        });

        $("#form1").validate();

        $("#dateToValidate").rules("add", { isDate: true, messages: {isDate: "Date to Validate is invalid."} });
    });

Вероятно, для валидатора не рекомендуется ссылаться на элемент управления пользовательского интерфейса, но, черт возьми.:)

4 голосов
/ 26 апреля 2010

Если вы используете ASP.NET, вы можете использовать ASP.NET Compare Validator [ ASP.NET Date Validator ].

<asp:TextBox ID="tb" runat="server"></asp:TextBox>

<asp:CompareValidator ID="cv" runat="server" 
ControlToValidate="tb" ErrorMessage="* Please enter a valid date!" Text="*" 
Operator="DataTypeCheck" Type="Date"></asp:CompareValidator>

**** Обновление **

Я взял javascript, который был выполнен вышеуказанным средством проверки Validator, и обернул вокруг него собственный метод проверки JQuery:

<script type="text/javascript">
    $(document).ready(function () {

        $.validator.addMethod("truedate", function (value, element, params) {
            function GetFullYear(year, params) {
                var twoDigitCutoffYear = params.cutoffyear % 100;
                var cutoffYearCentury = params.cutoffyear - twoDigitCutoffYear;
                return ((year > twoDigitCutoffYear) ? (cutoffYearCentury - 100 + year) : (cutoffYearCentury + year));
            }

            var yearFirstExp = new RegExp("^\\s*((\\d{4})|(\\d{2}))([-/]|\\. ?)(\\d{1,2})\\4(\\d{1,2})\\.?\\s*$");
            try {
                m = value.match(yearFirstExp);
                var day, month, year;
                if (m != null && (m[2].length == 4 || params.dateorder == "ymd")) {
                    day = m[6];
                    month = m[5];
                    year = (m[2].length == 4) ? m[2] : GetFullYear(parseInt(m[3], 10));
                }
                else {
                    if (params.dateorder == "ymd") {
                        return null;
                    }
                    var yearLastExp = new RegExp("^\\s*(\\d{1,2})([-/]|\\. ?)(\\d{1,2})(?:\\s|\\2)((\\d{4})|(\\d{2}))(?:\\s\u0433\\.)?\\s*$");
                    m = value.match(yearLastExp);
                    if (m == null) {
                        return null;
                    }
                    if (params.dateorder == "mdy") {
                        day = m[3];
                        month = m[1];
                    }
                    else {
                        day = m[1];
                        month = m[3];
                    }
                    year = (m[5].length == 4) ? m[5] : GetFullYear(parseInt(m[6], 10));
                }
                month -= 1;
                var date = new Date(year, month, day);
                if (year < 100) {
                    date.setFullYear(year);
                }
                return (typeof (date) == "object" && year == date.getFullYear() && month == date.getMonth() && day == date.getDate()) ? date.valueOf() : null;
            }
            catch (err) {
                return null;
            }
        }, "Please enter an actual date.");

        $("#form1").validate();

        $("#one").rules('add',
        {
            truedate: {
                cutoffyear: '2029',
                dateorder: 'mdy'
            }
        });
    });

</script>

<input id="one" />
0 голосов
/ 26 апреля 2010

Поскольку вы уже используете jquery, вы можете проверить http://bassistance.de/jquery-plugins/jquery-plugin-validation/, который обладает большой гибкостью для проверок.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...