We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Grid custom template not rendering asp net core tag helpers

Hi there,

I'm trying to use a custom template for a grid column which contains ASP.NET Core tag helpers like this:

<e-grid-column field="Name" headerText="Name" template="#nameAnchor"/>

<script id="nameAnchor" type="text/template">
    <div>
        <a asp-page="./Detail" asp-route-id="${Id}">${Name}</a>
    </div>
</script>

The asp tags are not rendered to html when using type="text/template",  and the ${} tags are not rendered to html when using type="text/html".

Could you please assist?

Thanks!


4 Replies

D D November 25, 2019 03:34 AM UTC

Just to give some more context:

Rendered html when using type="text/template": <a asp-page="./Detail" asp-route-id="001">SomeName</a>
Rendered html when using type="text/html": <a rel='nofollow' href="/Detail?id=$%7BId%7D">SomeName</a>

Expected html: <a rel='nofollow' href="/Detail?id=001">SomeName</a>

Using:
.Net Core 3.0
Syncfusion.EJ2.AspNet.Core Version=17.3.0.28


SS Seeni Sakthi Kumar Seeni Raj Syncfusion Team November 25, 2019 10:15 AM UTC

Hi Customer, 

Thanks contacting Syncfusion support, 

We have checked your query and ASP.Net Core Anchor Tag Helper cannot use template literals like ${Id}. So we have achieved your requirement  by using html Anchor tag instead of asp Achor tag. Please refer the below code example and sample for more information. 

[index.cshtml] 

<ejs-grid id="Grid" dataSource=" ViewBag.DataSource" allowPaging="true">     
    <e-grid-columns> 
        <e-grid-column field="OrderID" width="110" isPrimaryKey=true></e-grid-column> 
        <e-grid-column field="CustomerID" headerText="CustomerID" width="110" template="#nameAnchor"></e-grid-column> 
    .   .    .    . 
    </e-grid-columns> 
</ejs-grid> 
<script id="nameAnchor" type="text/x-template"> 
    <div> 
        <a rel='nofollow' href="/Detail?id=${EmployeeID}" class='btn btn-primary'>${CustomerID}</a> 
    </div> 
</script> 


Please get back to us, if you need further assistance. 

Regards, 
Seeni Sakthi Kumar S 



D D November 25, 2019 01:32 PM UTC

Hi,

That's what I ended up doing.
Thanks for confirming.




SS Seeni Sakthi Kumar Seeni Raj Syncfusion Team November 25, 2019 01:43 PM UTC

Hi Customer,

Thanks for the update. Please get back to us, if you require further assistance on this.

Regards,  
Seeni Sakthi Kumar S 


Loader.
Live Chat Icon For mobile
Up arrow icon