Template Columns not displaying data

[Uday]

Hi, 

I am trying to display the a hyperlink for one of the columns in my Grid. I added a template column as per the documentation and it is not displaying any content.

I check the server response. It does return the data. The column is disappearing on the client side once tied to the Grid.

Below is the snippet from MVC Grid examples (local-data-binding). I modified a bit to add a template column. You can easily reproduce this by adding the first column to the example at Grid at local-data-binding example.

@model IEnumerable<Kendo.Mvc.Examples.Models.ProductViewModel>

@(Html.Kendo().Grid(Model)
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Template(@<text>
            @Html.ActionLink(item.ProductName, "Local_Data_Binding", "Grid", new { id = item.ProductName }, null)
        </text>).Title("Company Name");
        columns.Bound(p => p.ProductName).Title("Product Name");
        columns.Bound(p => p.UnitPrice).Title("Unit Price").Width(130);
        columns.Bound(p => p.UnitsInStock).Title("Units In Stock").Width(130);
        columns.Bound(p => p.Discontinued).Width(130);
    })
    .Pageable()
    .Sortable()
    .Scrollable(scr=>scr.Height(430))
    .Filterable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(20)
        .ServerOperation(false)
     )
)

Any suggestions. Looks like this is working for some people.

Thank You,

[Dimiter Madjarov]

Hello Uday,


The reason for the issue is that the current Grid is using an Ajax Bound dataSource, which requires client templates, instead of server ones.
E.g.

columns.Template(@<text></text>).ClientTemplate("my template");

You could take a look at the following page for additional information about displaying an action link in a client template.

I wish you a great day!

Regards,
Dimiter Madjarov
Telerik

 

 

[Uday]

Thank You. It worked.

[Pawel Ch]

Hi Dimiter

Answer you provided is proper and it works in this case (Ajax binding). It helped me to solve small problem with client side binding. But example of Ajax binding on the page you refer to is misleading.

On the page there is a fragment relaed to AJAX as follows:

For ajax bound grids the ClientTemplate method should be used.

Example - action link in Ajax bound Grid column

columns.Bound(p => p.ProductID).ClientTemplate("<a href='" +Url.Action("ProductDetails", "Product") +"/#= ProductID #'" +">Show Product Details</a>");

but this code doesnt work.

For Ajax bound datagrid client template column code should be like below (I checked both ) :

columns.Template(@<text></text>).ClientTemplate(
"<a href='" +
    Url.Action("ProductDetails", "Product") +
    "/#= ProductID #'" +
">Show Product #= ProductID #</a>"
    ).Title("Action");

 

[Dimiter Madjarov]

Hello Pawel,

Both of the provided sample templates will work in an Ajax bound Grid. The first one is for a column bound to a model property. The second one is a pure template column, which is not bound to a property i.e. it cannot be filtered, sorted etc.

Regards,
Dimiter Madjarov
Telerik

[Franklin]

This one worked perfectly for me.

 columns.Bound(client => client.CompanyRow_Id).Title("View Contacts")
                            .ClientTemplate(Ajax.ActionLink("Industry", "Index", "Industry", new { myParam = "#=CompanyRow_Id#" }, new AjaxOptions() { OnSuccess = "myJSFunction" }).ToHtmlString());

 

function myJSFunction(response) {
        debugger;
        $("#updateTargetElement").html(response);
    }