This is a migrated thread and some comments may be shown as answers.

Problem rendering grid inside template

1 Answer 209 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Scott
Top achievements
Rank 1
Scott asked on 17 Apr 2015, 06:03 PM

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>

1 Answer, 1 is accepted

Sort by
0
Daniel
Telerik team
answered on 21 Apr 2015, 01:54 PM
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
 

See What's Next in App Development. Register for TelerikNEXT.

 
Tags
Grid
Asked by
Scott
Top achievements
Rank 1
Answers by
Daniel
Telerik team
Share this question
or