如何将模板添加到 Kendo 网格工具栏 [英] How to add a template to a Kendo grid toolbar

问题描述

我正在尝试向 Kendo MVC 网格添加自定义模板.我的模板应该包含两件事

1. 创建按钮以将新记录添加到网格
2. 自动完成框过滤网格中的数据.

我正在尝试以下代码:

.ToolBar(toolbar =>{工具栏.模板(@<文本><div class="工具栏"><label class="category-label" for="category">按名称过滤:</label>@(Html.Kendo().AutoComplete().Name("员工").DataTextField("empName").Filter("包含").MinLength(3).Events(e => e.Change("nameChange")).DataSource(ds =>{ds.Read("FilteringList", "Employee");}))

</text>);toolbar.Create().Text("新记录");})

但这不起作用.我只能看到自动完成框.

关于如何实现我的要求有什么想法吗?

解决方案

删除下面一行

toolbar.Create().Text("新记录");

从工具栏部分并在模板内添加按钮.请看下面的代码:

.ToolBar(toolbar =>{工具栏.模板(@<文本><div class="工具栏"><a class="k-button k-button-icontext k-grid-add" href="/YourControllerName/YouCreateActionResultJsonName?grdSearch-mode=insert">新记录</a><label class="category-label" for="category">按名称过滤:</label>@(Html.Kendo().AutoComplete().Name("员工").DataTextField("empName").Filter("包含").MinLength(3).Events(e => e.Change("nameChange")).DataSource(ds =>{ds.Read("FilteringList", "Employee");}))

</text>);})

I am trying to add a custom template to Kendo MVC grid. My template should contain 2 things

1. Create button to add new record to the grid
2. Autocomplete box to filter the data in the grid.

I am trying the following code :

.ToolBar(toolbar =>
{
    toolbar.Template(@<text>
                <div class="toolbar">
                    <label class="category-label" for="category">Filter by name:</label>
                    @(Html.Kendo().AutoComplete()
                            .Name("employees")
                            .DataTextField("empName")
                                      .Filter("contains")
          .MinLength(3)
          .Events(e => e.Change("nameChange"))
                            .DataSource(ds =>
                            {
                                ds.Read("FilteringList", "Employee");
                            })

                        )
                </div>
                </text>);
    toolbar.Create().Text("New Record");

})

but this is not working. I can only see the autocomplete box.

Any ideas on how I can accomplish my requirements?

解决方案

Remove the below line

toolbar.Create().Text("New Record");

from the ToolBar Section and add the button inside the template. Please see below code:

.ToolBar(toolbar =>
{
toolbar.Template(@<text>
            <div class="toolbar">
                <a class="k-button k-button-icontext k-grid-add" href="/YourControllerName/YouCreateActionResultJsonName?grdSearch-mode=insert">New Record</a>
                <label class="category-label" for="category">Filter by name:</label>
                @(Html.Kendo().AutoComplete()
                        .Name("employees")
                        .DataTextField("empName")
                                  .Filter("contains")
      .MinLength(3)
      .Events(e => e.Change("nameChange"))
                        .DataSource(ds =>
                        {
                            ds.Read("FilteringList", "Employee");
                        })

                    )
            </div>
            </text>);
})

这篇关于如何将模板添加到 Kendo 网格工具栏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！