【问题标题】:Jquery date picker restrict dates like 2222222/33333/444444Jquery 日期选择器限制日期,例如 2222222/33333/444444
【发布时间】:2012-04-17 22:50:00
【问题描述】:

我在我的 MVC 3 + Razor 项目中使用 Jquery Date Picker。

我已经成功地使用它并将其与我的项目集成。

现在使用日期选择器我可以看到它不允许使用 a,b...@#,$,%.. 等字符。但它确实允许数字,理解我的意思看截图,

我认为我需要对 jquery 本身进行一些更改,但我不知道在哪里。请帮我解决这个问题。

在 marcolinux 的帮助下,我使用了 http://keith-wood.name/uiDatepickerValidation.html,现在我将它添加到我的脚本中

        $(form).validate({
        rules: {
        startDate: {
        dpDate: true
        }
        }
        });

并导入此链接

 <script src="../../Scripts/jquery.ui.datepicker.validation.js" type="text/javascript"></script>

我现在在这方面取得了更大的进步 在我的文本框中使用 class="dpDate" 现在我可以在我的文本框上获得一个红色边框以进行输入,例如 1212635245 111/12313/12313

现在我需要知道的最后一部分是如何在文本框旁边显示错误消息。

【问题讨论】:

    标签: jquery validation date datepicker jquery-ui-datepicker


    【解决方案1】:

    您似乎担心在文本框中“键入”的日期。您可以在 datepicker 触发的 onClose 事件中挂钩错误检查函数:

    允许您在日期选择器关闭时定义自己的事件, 是否选择日期。该函数接收选定的 日期作为文本('' 如果没有)和 datepicker 实例作为参数。 this 指的是关联的输入字段。

    当用户在文本框中输入内容时,日期选择器将打开。当用户选择日期(有效)或控件失去焦点(日期可能有效也可能无效)时,将触发 onClose 事件。然后您可以检查事件处理程序中的日期:

    $("#datepicker").datepicker({
        onClose: function(dateText, instance) {
            var date;
            try {
                date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, dateText, instance.settings);
            }
            catch (e) {
                alert("$.datepicker.parseDate failed");
            }
            if (!date) {
                alert("This date is not valid");
                $(this).val("");
            }
        }
    });
    

    Demo here

    【讨论】:

      【解决方案2】:

      放入一个属性 readonly="readonly" 应该解决问题:)

      【讨论】:

      • 我试过了,但使用它的问题是我无法删除一旦设置的日期:(
      • 我在keith-wood.name/datepick.html 显示的示例中使用只读,现在它可以工作了(跳舞!)
      【解决方案3】:

      这个插件会满足你的要求

      http://keith-wood.name/uiDatepickerValidation.html

      例子

      Validate date:   2222/22/222
      results :   Please enter a valid date
      

      【讨论】:

      • 这看起来很有帮助,让我试试这个
      【解决方案4】:

      在文本框的按键上试试,

      $('#ID').keypress(function (event) {
      if (event.charCode >= 48 && event.charCode <= 57 && this.value.length < 10 || event.charCode == 47 && (this.value.length == 2 || this.value.length == 5)) { if ((this.value.length == 2 || this.value.length == 5) && event.charCode != 47) {
      $(this).val(this.value + "/");
      } } else event.preventDefault(); });

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2012-09-09
        • 1970-01-01
        • 2017-08-11
        • 1970-01-01
        • 1970-01-01
        • 2020-01-04
        • 1970-01-01
        • 2012-05-05
        相关资源
        最近更新 更多