格式化时,Kendo UI datepicker最初不显示值

Question

我对Kendo UI datepicker有一个问题,它没有通过value属性显示已经设置的值.这是标记:

<input data-kendoDatePicker="true" value="9/18/2013 12:00:00 AM"/>

<script>
    $(':input[data-kendoDatePicker=true]').kendoDatePicker({
        format: 'dd MMM yyyy'
    });
</script>

页面加载时,它不会显示任何值.但是,在DOM中查看为输入设置的值,它只是不需要它!选择新值后,将显示并格式化.如果我删除格式它按预期工作

Answer 1

@Bobby_D是对的,问题是你没有指定正确的日期格式:MM/dd/yyy.

顺便说一句:你知道你可以把它定义为:

<input data-role="datepicker" value="9/18/2013 12:34:56 AM" data-format="MM/dd/yyyy"/>
<script>
    kendo.init($("input"));
</script>   

基本上,如果你可以在HTML中设置所有属性,input你只需要调用一个来kendo.init初始化元素.所以,你甚至可以这样做kendo.init($("body"));.从HTML初始化大多数组件时,这非常有用.

编辑:Kendo DatePicker有两种不同的选项:

1. format:指定格式,用于格式化输入中显示的DatePicker的值.格式也将用于解析输入.
2. parseFormats:指定用于使用value()方法或直接用户输入解析值集的日期格式的lis.如果未设置,将使用格式的值.请注意,format选项始终用于解析过程.

在我看来,您希望以一种格式接收日期,然后将其显示在另一种格式中.然后你应该使用parseFormats你收到的可能的(可能不止一个)和format小部件中显示的那些.

你的代码是:

$(':input[data-kendoDatePicker=true]').kendoDatePicker({
    format:        "dd MMM yyyy",
    parseFormats : [ "MM/dd/yyyy" ]
});

代码在这里修改:http://jsfiddle.net/OnaBai/TQnny/1/

或者以替代格式:

<input id="datapicker" data-role="datepicker" value="9/18/2013 12:00:00 AM" data-format="dd MMM yyyy" data-parse-formats="MM/dd/yyyy"/>

和初始化它的JS:

kendo.init($("init"));

在这里修改的代码:http://jsfiddle.net/OnaBai/TQnny/2/