Template with Kendo Button issues

[Bob]

Hi, when adding a Kendo button to a notification template, the generated <script> tags are overlapping and causing the notification window to fail.  Am I missing something or is this a bug?  I'm about to give up and try the Kendo window control.

HTML

<script id="reportTemplate" type="text/x-kendo-template">
    <div style="height:100px; width:300px;border:thin solid black;">
        <h3><img src="/Content/Images/SuccessfulSaveTickMark.png" alt="" />#= title #</h3>
        <p>
            @Html.LabelFor(m => m.NotificationText)
        </p>
        <p>
            @(Html.Kendo().Button()
                .Name("viewNowButton")
                .HtmlAttributes(new { type = "button", onclick = "javascript:validateSession()" })
                .Content("View Now")
            )
            @(Html.Kendo().Button()
                .Name("viewLaterButton")
                        .HtmlAttributes(new { type = "button", onclick = "javascript:validateSession()" })
                .Content("View Later")
            )
            @(Html.Kendo().Button()
                .Name("downloadButton")
                        .HtmlAttributes(new { type = "button", onclick = "javascript:validateSession()" })
                .Content("Download")
            )
        </p>
        <p>
            @(Html.Kendo().Button()
                .Name("redirectToReportPickupButton")
                .HtmlAttributes(new { type = "button", onclick = "javascript:validateSession()" })
                .Content("Go to Report Pick Up Page")
            )
        </p>
    </div>
</script>

Output
​

<script id="reportTemplate" type="text/x-kendo-template">
    <div style="height:100px; width:300px;border:thin solid black;">
        <h3><img src="/Content/Images/SuccessfulSaveTickMark.png" alt="" />#= title #</h3>
        <p>
            <label for="NotificationText">NotificationText</label>
        </p>
        <p>
            <button id="viewNowButton" onclick="javascript:validateSession()" type="button">View Now</button><script>
    jQuery(function(){jQuery("#viewNowButton").kendoButton({});});
</script>
            <button id="viewLaterButton" onclick="javascript:validateSession()" type="button">View Later</button><script>
    jQuery(function(){jQuery("#viewLaterButton").kendoButton({});});
</script>
            <button id="downloadButton" onclick="javascript:validateSession()" type="button">Download</button><script>
    jQuery(function(){jQuery("#downloadButton").kendoButton({});});
</script>
        </p>
        <p>
            <button id="redirectToReportPickupButton" onclick="javascript:validateSession()" type="button">Go to Report Pick Up Page</button><script>
    jQuery(function(){jQuery("#redirectToReportPickupButton").kendoButton({});});
</script>
        </p>
    </div>
</script>

[Dimo]

Hi Bob,

Please refer to the following documentation section.

http://docs.telerik.com/kendo-ui/getting-started/using-kendo-with/aspnet-mvc/fundamentals#client-templates

Regards,
Dimo
Telerik