Dynamic hyperlink in grid control using column template or Custom command

[Muhammad Tassadaque Zia]

HI

I am trying to add dynamic hyperlink column either by column template or custom command but it doesn't working. 

For Column Template

@foreach (var item in ViewBag.actions)

            {

            <e-grid-column field="OrderID" headerText="Manage" template="<a rel='nofollow' href='/EditBusinessPartner/masterdata/{{:OrderID}}'>test</a>" textAlign="Left" type="number" width="80"></e-grid-column>

            }

This code is not recognizing {{:OrderID}}

By Custom Command

I am following below documentation link

https://ej2.syncfusion.com/aspnetcore/documentation/grid/edit/#custom-command

How to add url in below code

@{
    List<object> commands = new List<object>();
    commands.Add(new { type = "userstatus", buttonOption = new { content = "Details", cssClass = "e-flat e-details" } }); // custom
}

[Thavasianand Sankaranarayanan]

Hi Muhammad, 

 

Greetings from Syncfusion. 

 

Query: I am trying to add dynamic hyperlink column either by column template or custom command but it doesn't working 

 

We have validated your query and you want to create a dynamic hyperlink by using column template. Here, we have prepared a sample based on your requirement by using column template. Please find the below code example and sample for your reference. 

 

[code example] 

 

<div> 

    <ejs-grid id="Grid" dataSource="ViewBag.DataSource" allowResizing="true" allowPaging="true" allowSorting="true" toolbar="@(new List<string>() {"Add", "Edit", "Delete", "Cancel", "Update"})"> 

        <e-grid-editSettings allowAdding="true" allowDeleting="true" allowEditing="true" mode="Normal"></e-grid-editSettings> 

        <e-grid-columns> 

            <e-grid-column field="OrderID" headerText="Order ID" isPrimaryKey="true" width="120"></e-grid-column> 

            <e-grid-column field="EmployeeID" headerText="Employee ID" width="120"></e-grid-column> 

            <e-grid-column field="Freight" headerText="Freight" format="C2" width="120"></e-grid-column> 

            <e-grid-column field="ShipCity" headerText="Ship City" template="#template" width="120"></e-grid-column> 

            <e-grid-column field="ShipCountry" headerText="Ship Country" width="120"></e-grid-column> 

        </e-grid-columns> 

 

    </ejs-grid> 

</div> 

 

<script id="template" type="text/x-template"> 

    <div> 

        <a rel='nofollow' href="#">${ShipCity}</a> 

    </div> 

</script> 

 

 

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/SampleColTemp-242834600  

 

Help Documentation: https://ej2.syncfusion.com/aspnetcore/documentation/grid/columns/#column-template  

Please get back to us if you need further assistance. 

Regards, 

Thavasianand S.