1

I have a Kendo Grid where every bound column is using a client template. I'm currently passing data to the client template, in addition to that how can I pass the currently bound column name to the client template?

@(Html.Kendo().Grid<dynamic>()
    .Name("myGrid")
    .HtmlAttributes(new { @class = "mt-grid" })
    .Columns(columns =>
    {
        for (int i = 0; i < Model.UserDefineFields.Count; i++)
        {
            columns.Bound(Model.UserDefineFields[i].ColumnName)
                .ClientTemplate("#=compiledColumnTemplate(data)#") // is it possible to pass column name here
                .Title(Model.UserDefineFields[i].DisplayName);
        }

        columns.Command(command => command.Destroy()).Width(100);
    })
    .ToolBar(toolbar =>
    {
        toolbar.Create();
        toolbar.Save();
    })
    .Editable(editable => editable.Mode(GridEditMode.InCell))
    .Pageable()
    .Navigatable()
    .Sortable()
    .Scrollable()
    .Filterable()
    .AutoBind(false)
    .DataSource(dataSource => dataSource
        .Ajax()
        .Batch(true)
        .PageSize(20)
        .ServerOperation(false)     
        .Model(model =>
        {
            model.Id("Id");
            var f = model.Field("Id", typeof(int));
            f.Editable(false);
        })
        .Create("Create", "Test")
        .Read("Get", "Test")
        .Update("Update", "Test")
        .Destroy("Delete", "Test")
    ))

I want to use the bound column name in columnTemplate below:

<script id="columTemplate" type="text/x-kendo-template">    
    # console.log(data); #
</script>

<script>
    var compiledColumnTemplate = kendo.template($('#columTemplate').html());    
</script>
CarenRose
  • 1,266
  • 1
  • 12
  • 24
LP13
  • 30,567
  • 53
  • 217
  • 400
  • That is one thing that sucks in kendo: it lacks of flexibility. That is so silly to have in the template but they don't adds it. You only have `data` object inside a template, nothing more. So in your case I would suggest you pass the column name in your template, something like `$"#=compiledColumnTemplate(data, '{Model.UserDefineFields[i].DisplayName}')#"`. Then your template will get two params, the `data` object will be `arguments[1]`, and `data` (or `arguments[0]`) will be your column name. Didn't tested it, but should work. – DontVoteMeDown Mar 13 '20 at 18:47

0 Answers0