Problem rendering grid inside template

[Scott]

I have a grid where each row has a custom command that opens a details modal. The details modal is populated with the contents of a kendo template. I want to include a kendo grid inside of that template.

Data structure is Contract (main page)->CoveredEquipment (first grid)->WearableParts (grid on modal)

My problem is that I get a javascript "invalid template" error when the page is loaded. It seems to not like

#= kendo.render(kendo.template($("\#wearablePartsGridTemplate").html()), WearableParts); #

 in the modal template.

 

What am I doing wrong?

 

<script id="wearablePartsGridTemplate" type="x-kendo-template">

    @(Html.Kendo().Grid<FieldServiceWeb.Areas.Admin.Models.ServiceContract.WearablePartViewModel>()
    .Name("wearablePartsGrid")
    .DataSource(dataSource =>
        dataSource.Ajax()
            .Model(model => model.Id(p => p.PartNumber))
            .ServerOperation(false)
            .Update("Update", "ServiceContracts", new { area = "Admin" })
        .Destroy("Delete", "ServiceContracts", new { area = "Admin" })
        .Create("Create", "ServiceContracts", new { area = "Admin" })
    )
    .Columns(columns => {
        columns.Bound(c => c.PartNumber).Title("Part");
        columns.Bound(c => c.Description);
        columns.Bound(c => c.IsActive).Title("Active");
        columns.Command(c => c.Destroy().Text("Delete"));
    })
    .ToClientTemplate())

</script>

<script type="text/x-kendo-template" id="wearablePartsContent">
        <label>Wearable parts for <strong>#: CSPId # - #: Description #</strong></label>
        #= kendo.render(kendo.template($("\\#wearablePartsGridTemplate").html()), WearableParts); #       
    </script>

<script>

function openWearableParts(e) {
            e.preventDefault();

            var dataItem = this.dataItem($(e.currentTarget).closest("tr"));

            $("#wearablePartsModal").find(".modal-body").html(wearablePartsTemplate(dataItem));

            //createGrid();

            $("#wearablePartsModal").modal("show");
        }

</script>

[Daniel]

Hi,

You should remove the semi-colon:

#= kendo.render(kendo.template($("\#wearablePartsGridTemplate").html()), WearableParts) #

Also, I am not sure why is render used but unless you wish to render a grid template for each item in WearableParts, you should just evaluate the template.

#= kendo.template($("\#wearablePartsGridTemplate").html())({}) #

Regards,
Daniel
Telerik