Chamith Saranga
Chamith Saranga

Reputation: 40

How to show kendo ui widget inside kendo ui template

How Can I Render Kendo widget Inside template. I was tried to create datePicker indide a template and show it on div. Is something wrong this code http://dojo.telerik.com/UMINe

<body>
  <div id="indider"> </div>
  <script id="template-student" type="text/x-kendo-template">
      <h1> #= a # </h1>
      <input id="datePicker" />
  </script>

<script>
    $(()=>{
        $('#datePicker').kendoDatePicker();

        var template = kendo.template($("#template-student").html());
        var result = template({a:'this is my template'});  
        alert(result);
        $('#indider').html(result);
    });
</script>
</body>

cheers

Upvotes: 0

Views: 373

Answers (1)

NigelK
NigelK

Reputation: 8490

This line converts the selected element to a kendo DatePicker widget:

$('#datePicker').kendoDatePicker();

However at that point the template has not yet been rendered and applied to the #insider element. As a result, #datePicker does not yet exist so nothing happens as you observe. Simply move the line to the end of your script block, since at that point the #dataPicker element will exist and the DatePicker widget will render:

...
alert(result);
$('#indider').html(result);
$('#datePicker').kendoDatePicker();

Upvotes: 2

Related Questions