Rendering html in a row template

[Boone]

I have a column that is returning to my UI in HTML format like <a href="http://google.com">google</a>. I am using a row template to populate my grid but when my column outputs, it outputs the HTML like plain text. How do I get it to render like HTML?

<script id="rowTemplate" type="text/x-kendo-tmpl">

    <tr>

        <td>

            ${Phone}

        </td>

        <td>

            ${DetailUrl}

        </td>

    </tr>

 </script>

$("#grid").kendoGrid({

    columns: [

                { field: "Phone", title: "Phone" },

                { field: "DetailUrl", title: "Detail" }

            ],

    rowTemplate: kendo.template($("#rowTemplate").html())

});

[Alexander Valchev]

Hi Boone,

The ${foo} syntax is encoding the HTML, try using #=foo# instead.
You can find detailed examples of the available expressions in the template's demos.

I hope this will help you to solve the problem.

Regards,
Alexander Valchev
the Telerik team

[Jasmin]

Hi Alexander,

this solution worked for me.

For the first time I used also the ${fieldName } syntax and it doesn't worked.
In the detail row template I changed the syntax to #= fieldName # and its working.

Thank you for your post, it helped me.

Regads,
Jasmin

[Tsvetomir]

Hi Jasmin,

I am glad to hear that you have managed to resolve your issue.

Kendo UI Templates use hash templates and there are three ways to render a template:

1. Render values as HTML: #= #.
2. Use HTML encoding to display values: #: #.
3. Execute arbitrary JavaScript code: # if (true) { # ... non-script content here ... # } #.

More details on the Kendo UI Templates: 

https://docs.telerik.com/kendo-ui/framework/templates/overview#templates-overview

Let me know if you have additional questions.

Kind regards,
Tsvetomir
Progress Telerik