Question

我希望用户只能通过其按钮更改Kendo UI Datepicker值，并从弹出窗口中选择日期。如何阻止用户在Datepicker文本框中输入内容？我可以在不禁用整个控件的情况下禁用文本框吗？

Answer 1

在输入元素上添加此属性和值...

onkeydown="return false;"

这将禁用键入输入并仍允许使用日历控件输入。

Answer 2

使用以下控件 -

@(Html.Kendo().DatePicker()
.Name("FromDate")
.HtmlAttributes(onkeydown="javascript:return false;" })
      )

它将禁用键盘输入。同样可以处理其他条件。

Answer 3

找到您的输入元素，并将其禁用

$('#datepicker').attr('disabled','disabled');

（在剑道演示网站http://demos.kendoui.com/web/datepicker/index.html上尝试过）

Answer 4

你可以通过两种方式做到这一点

  //disable kendo ui  datapicker click event
    $(".k-datepicker input").bind('click dblclick',function () {
         return false;
    });

    //make it readonly
   $(".k-datepicker input").prop("readonly", true);

Answer 5

如果您想阻止用户在日期选择器中输入日期，并且只从弹出窗口中选择日期，请尝试使用此代码

$(".k-datepicker").find('span').find('input').attr("readonly", "readonly");

Answer 6

当然，日期和时间选择器小部件应该可以选择仅使用UI而不是键盘强制输入...否则它是真正的DateTime“形成”噩梦的秘诀！我很惊讶框架没有为这个明显的用例提供任何东西。

我有同样的需求，并使用以下逻辑使其工作：

$("#date").kendoDatePicker({
    format: "dd MMMM yyyy"
});
$("#date").attr("readonly","readonly");

这样，用户无法通过键盘输入值，只能使用下拉日期选择窗口输入格式良好的日期。

Answer 7

实际上，小部件在输入时不会限制用户。这种行为的原因在这里解释： Why widget does not restrict typing

与此线程中共享的所有其他解决方案一起，可以创建自定义Masked DatePicker，这将限制用户使用特定的日期格式。有关详细信息，请查看此操作演示：

Create Date Masking

**请注意，Kendo UI不支持此功能作为内置功能，因此您需要自担风险使用它。好消息是它没有已知的副作用，效果很好。

Answer 8

Justin的答案有效，但是并不能防止右键单击粘贴错误的值。您可以使用oncontextmenu来防止右键单击

oncontextmenu="return false;"

这也将防止复制日历中的数字。

Answer 9

对于tagHelpers，只需使用以下内容

output.Attributes.Add("onkeydown", "javascript:return false;");

Answer 10

.HtmlAttributes(new { onkeydown="return false" })

Kendo UI Datepicker禁用键入

10 个答案: