columns.template not working when using ajax

[Tim]

I've made a Grid that formerly got his data from the Model.
I also had a custom collumn here that i created using columns.template which worked properly.

For sorting and search reasons a changed the datasource to a json from a viewmodel.
When i used this method my data also loaded but the template only displayed an empty column.

This is my code of the Grid:

                        @(Html.Kendo().Grid<KdG.ProjectPortofolio.IntranetApp.ViewModels.Projects.ListProjectViewModel>() 
                              .Name("Grid")
                                        .DataSource(ds => ds.Ajax()
                                                          .Read(r => r.Action("Read", "Project"))
                                        )
                              .EnableCustomBinding(false)
                              .ToolBar(toolBar => toolBar.Custom()
                                    .Text("Exporteer naar Excel")
                                    .HtmlAttributes(new { @class = "export",@id="test" })
                                    .Url(Url.Action("ExportToExcel", "Project",new { page = 1, pageSize = "~", filter = "~", sort = "~" }))
                                    

                              )
                              .Columns(columns =>
                              {
                                  columns.Bound(p => p.Name).Filterable(filterable => filterable.UI("nameFilter")).Title("Naam");
                                  columns.Bound(p => p.Status).Filterable(filterable => filterable.UI("statusFilter")).Title("Status");
                                  columns.Bound(p => p.Category).Title("Categorie");
                                  columns.Bound(p => p.StartDate).Title("Start");
                                  columns.Bound(p => p.EndDate).Title("Einde");
                                  columns.Bound(p => p.AreaOfStudy).Title("Studiegebied");
                                  columns.Bound(p => p.ProjectLeader).Title("Projectleider");
                                  columns.Template(

                                      @<text>
                                        @Html.IconActionLink("glyphicon glyphicon-info-sign", null, "Details", "Project", new { id = item.Id }, new { @class = "btn btn-default btn-xs float FloatLeft" })
                                      </text>);
                              })
                              .Filterable(f => f.Extra(false).Operators(o => o.ForString(s => s
                                  .Clear()
                                  .Contains("Bevat")
                                  .DoesNotContain("Bevat Niet")
                                  .EndsWith("Eindigd met")
                                  )))
                             
                             .Pageable()
                             .Groupable()
                             .Sortable()//Enable paging
)

Thanks in advance

[Dimiter Madjarov]

Hello Tim,


In an Ajax bound Grid you should use the ClientTemplate method and pass a Kendo Template as a value. This topic is discussed in the Grid's FAQ section.

I hope this information helps. Have a great day!

Regards,
Dimiter Madjarov
Telerik

[Tim]

Hello Dimiter,

Thank you very much for the reply.
I have one question about your suggested sollution.
Is it possible to add an actionlink inside this "collumns.Bound(p => p.Id).Template" like 
"@Html.IconActionLink("glyphicon glyphicon-info-sign", null, "Details", "Project", new { id = item.Id }, new { @class = "btn btn-default btn-xs float FloatLeft" })'

Thanks,

Tim

[Dimiter Madjarov]

Hi Tim,


This topic about building action links is also covered in the FAQ Section. In a client template you should add the <a> tag directly and use the Url.Action helper to generate the URL. The html classes could be added directly to the tag and the additional parameters should be concatenated to the URL.

Regards,
Dimiter Madjarov
Telerik

[Tim]

Hi Dimiter,

Thank for your instructions i managed to fix with your help.
This is my final code for the template:

                                      columns.Bound(p => p.Id).ClientTemplate(
                                            "<a href='" + 
                                            Url.Action("Details","Project") + 
                                            "/#= Id #'" +
                                            "><i class= 'glyphicon glyphicon-info-sign'></i></a>" +
                                            "#if(ProjectLeaderId ==" + Html.GetLoggedInPerson(Context).Id + ") {#" +
                                            "<a href='" +
                                            Url.Action("EditProject", "Project") +
                                            "/#= Id #'" +
                                            "> <i class= 'glyphicon glyphicon-pencil'></i></a>" +
                                            "# } #"
                                     ).Sortable(false).Title("").Filterable(false);

Kind Regards,

Tim

[Dimiter Madjarov]

Hello Tim,


Thank you for the update. Do not hesitate to contact us again if you need further assistance.
Have a great day!

Regards,
Dimiter Madjarov
Telerik