我想在我的 kendoUI 网格中创建一个自动完成字段。但我在网上找不到任何合适的方法。
这是我的观点:
@(Html.Kendo().Grid<SamuraiListing.Data.Company>()
// Grid Name
.Name("CompanyGrid")
// Declare grid column
.Columns(columns =>
{
// Cretae all the columns base on Model
columns.Bound(r => r.Name);
columns.Bound(r => r.Telephone);
columns.Bound(r => r.Email);
columns.Bound(r => r.GPS);
// Edit and Delete button column
columns.Command(command =>
{
command.Edit();
command.Destroy();
}).Width(200);
})
// Declare ajax datasource.
// CRUD operation are wired back to ASP MVC Controller/Action e.g. HomeController, GetAll
// Set the model Id
.DataSource(datasoure => datasoure.Ajax()
.Model(model => model.Id(record => record.Id))
.Read(read => read.Action("GetAll", "Home"))
.Create(create => create.Action("Add", "Home"))
.Update(update => update.Action("Update", "Home"))
.Destroy(delete => delete.Action("Delete", "Home"))
.PageSize(10)
)
// Add tool bar with Create button
.ToolBar(toolbar => toolbar.Create())
// Set grid editable.
.Editable(editable => editable.Mode(GridEditMode.InLine))
// Set grid sortable.
.Sortable()
// Set grid selectable.
.Selectable()
.Navigatable()
// Set grid pagable.
.Pageable(pageable =>
{
pageable.Refresh(true);
pageable.PageSizes(true);
})
)
假设我想以自动完成的方式显示姓名列表,我可以在哪里添加我的代码? 我在网上阅读了大量主题和帖子,但没有一个指向 asp.net 包装器。
最佳答案
你可以尝试这样做:
选项 #1:
如果您希望从 Web 服务器自动完成控件加载数据
columns.Bound(r => r.Name)
.EditorTemplateName("NamesAutoCompleteTemplate");
然后您将不得不创建与模板名称具有相同文件名的模板。在此示例中,它是 NameAutoCompleteTemplate.cshtml 并向其添加以下代码:
@model string
@(Html.Kendo().AutoCompleteFor(m => m)
.DataTextField("Name")
.Filter(FilterType.StartsWith)
.Suggest(true)
.DataSource(source => {
source.Read(read =>
{
read.Action("GetNames", "Home");
})
.ServerFiltering(false);
})
)
其中“Home”是您的 HomeController 的名称,“GetNames”是您 Controller 上的 Action 的名称。确保在 Views\Shared\EditorTemplates 目录下添加“NameAutoCompleteTemplate.cshtlm”
选项 #2:
如果您希望通过 razor 引擎加载自动完成的数据源,那么您不必使用单独的服务来加载自动完成的数据。在这种情况下,您可以将 Name 设置为您的 ViewModel,或者在我的示例中,我将其设置为 ViewBag 并将其传递给模板。
columns.Bound(r => r.Name)
.EditorViewData(new {ViewBag.Names})
.EditorTemplateName("NamesAutoCompleteTemplate");
在您的 NameAutoCompleteTemplate.cshtml 文件中,您必须以这种方式编写代码:
@model string
@(Html.Kendo().AutoCompleteFor(m => m)
.DataTextField("Name")
.Filter(FilterType.StartsWith)
.Suggest(true)
.BindTo(ViewBag.Names)
})
)
希望这对您有所帮助。
关于c# - 如何使用 asp.net mvc 包装器在 kendoUI 网格中有一个自动完成字段,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23864249/