Alternate to using Script tags for Templates because Razor removes them

5 posts, 1 answers
  1. Jacques
    Jacques avatar
    135 posts
    Member since:
    Jun 2007

    Posted 20 Oct 2015 Link to this post

    What are the alternative approaches to using script tags to house templates?

    If you have a <script id="bla" type="text/x-kendo-template"> tag in a partial and try to render it in your main view with either Html.Partial or Html.RenderPartial, it seems that Razor messes around with those script tags somehow.

    It's that, or the browser doesn't like the fact that I'm embedding one script tag within another. The reason I'm doing this is because the outer script tag is used for a Kendo View template/content. The inner script tags are templates for a Grid.

     

    ?

  2. Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 22 Oct 2015 Link to this post

    Hello Jacques,

     

    nesting script tags is not necessary or recommended, although there are various workarounds discovered. I can't be certain on the specifics of your case - you may inspect the server response to verify if the server returns a malformed response or the browser does not handle them as expected.

     

    Regards,
    Petyo
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. Jacques
    Jacques avatar
    135 posts
    Member since:
    Jun 2007

    Posted 23 Oct 2015 in reply to Petyo Link to this post

    So what would you recommend in the a case where you're building a SPA app that does the following:

    <body>
     
    <div id="spa"></div>
     
    <script id="viewForMaster" type="x-kendo-template">
        @Html.Partial("MasterView");
    </script>
     
    <script>
        //add code here to load the SPA layout from the
        //viewForMaster view
    </script>
    </body>

    If that Razor view renders a Table that uses templates for the rows it's automatically going to be doing so in script tags which means you're going to get nested tags.

    Here's a simple example of what might be in that additional razor view:

    <script id="tableRow" type="x-kendo-template">
        <tr><td>#=data#</td></tr>
    </script>
     
    <table>
        <tbody data-template="tableRow" data-bind="source: Items"></tbody>
    </table>
     
     
  5. Answer
    Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 27 Oct 2015 Link to this post

    Hello Jacques,

     

    the easiest thing you can do is to move the script template tag in the partial and wrap only the view contents.

     

    Regards,
    Petyo
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  6. Jacques
    Jacques avatar
    135 posts
    Member since:
    Jun 2007

    Posted 03 Nov 2015 in reply to Petyo Link to this post

    Thanks that should do the trick. It's just slightly annoying because you would then have to go and look in the partial view to find the ID of the template, but a fix none-the-less.
Back to Top
Kendo UI is VS 2017 Ready