jquery - 如何获取剑道日历的所有值

Question

https://demos.telerik.com/kendo-ui/calendar/selection

我使用了上面网址中的日历。

我无法通过拖动选择值来获取值。我尝试了以下代码。

http://jsfiddle.net/j0qpdox3/

在此 fiddle 中，您可以看到第一列值显示开始日期字段，最后一列值显示结束日期。

例如将日期 9 拖动到 15。

其他值不起作用。例如(10 到 14)。

var cal = $("#calendar").kendoCalendar({
  selectable: "multiple",
  change: function() {

    $(".k-state-selected").each(function(){
  var textVal = $('.k-state-selected:first-child a').attr("data-value");
  var textVal1 = $('.k-state-selected:last-child a').attr("data-value");

          $("#startdate").val(textVal);
         $("#enddate").val(textVal1);


  });


  }
});

我可以获得第一个子元素和最后一个子元素的值吗？

Answer 1

由于您启用了selectable: "multiple"，您可以使用kendo ui的selectDates()，它将返回所选的array日期。

尝试以下操作。

var cal = $("#calendar").kendoCalendar({
    selectable: "multiple",
    change: function() {
        //var textVal = this.value();
        var seldataes = this.selectDates(); // newly added
        var textVal = kendo.toString(new Date(seldataes[0]), "yyyy/MM/dd"); // newly added
        var textVal1 = kendo.toString(new Date(seldataes[seldataes.length - 1]), "yyyy/MM/dd"); // newly added
        console.log(textVal);
        $("#startdate").val(textVal);
        $("#enddate").val(textVal1);


    }
});

希望这有帮助。

DEMO HERE