动态创建的 kendo 日期选择器不工作

Question

这是我的 html,

            <div id="replicate">
               <div id="student">
                    <div class="col-md-3">
                        <div class="form-group ">
                            <label class="control-label" for="">Name</label>
                            <textarea id="" name="" class="form-control" col="3"></textarea>
                        </div>
                    </div>
                    <div class="col-md-2">
                        <div class="form-group ">
                            <label class="control-label" for="">Date</label>
                            <input id="" name="" class="form-control kendo_datepicker" value="" placeholder="" type="text">
                        </div>
                    </div>
                </div>
               </div>

单击按钮时将添加到#replicate div.Datepicker 不适用于动态添加的控件。这是我的功能

    function add(student, count) {
    var dat = $('#' + student).html();
    $('#replicate').append('')  // my logic

    var datepicker = $("input.kendo_datepicker").data("kendoDatePicker");
    datepicker.setOptions({
        min: new Date()
    });
}

如何解决？

Answer 1

要启动 kendo datePicker，试试这个：

$("input.kendo_datepicker").kendoDatePicker({});

这对我有用，希望对你有用！

Answer 2

您可以使用 Kendo 模板来放置您想要复制的 HTML。

<script id="datepicker-template" type="text/x-kendo-template">
    <div id="student">
    <!--More HTML to be duplicated-->
</script>

每次单击时，您可以将 HTML 附加到您的 #replicate div 元素，并在最后创建的日期选择器控件上调用 kendoDatePicker() 函数。

以下是您如何做到这一点的一个示例： http://jsfiddle.net/1yje5u9n/

动态创建的 kendo 日期选择器不工作

Dynamically created kendo datepicker is not working

jquery

datepicker

telerik

kendo-ui

kendo-datepicker