Datepicker 控件在 kendo ui 模板中未正确显示

Question

我有一个 kendo ui 带有日期选择器控件的模板

<script type="text/x-kendo-template" id="tmplStep1">     
 <form>
    Date: <input id="datepicker" maxlength="10"/>  
    <i>(mm/dd/yyyy)</i><br />  
 </form>  
</script>

我正在使用 Windows 弹出窗口以这种方式显示模板

var detailsTemplate = kendo.template($("#tmplStep1").html());
dataItem = this.dataItem(e);
var wnd = $("#winDate")
           .kendoWindow({
                 title: "Form",
                  modal: true,
                  visible: false,
                  resizable: false,
                  width: 100,
                  appendTo: "form#frm"                     
              }).data("kendoWindow");

         wnd.content(detailsTemplate(dataItem));            
         wnd.center().open();

我知道，我需要初始化日期选择器，但我不知道该怎么做。我将下面的指令放在模板之外，但显然它不起作用，显示的控件是一个简单的文本框。

<script>
      $("#datepicker").kendoDatePicker();
</script>

有人知道怎么解决吗？

Answer 1

在将模板设置为 window 内容后立即调用 $("#datepicker").kendoDatePicker();，因为在此之前该模板不是 DOM 年的一部分：

...
wnd.content(detailsTemplate(dataItem));
$("#datepicker").kendoDatePicker();
wnd.center().open();

Datepicker 控件在 kendo ui 模板中未正确显示

Datepicker control is not displayed correctly inside of kendo ui template

kendo-ui

kendo-template

kendo-datepicker