如何在Kendo UI MVC中设置和获取网格中下拉列表的值？

Question

如何在Kendo UI MVC中设置和获取网格中下拉列表的值？

10

我正在使用KendoUI MVC在MVC3中工作。

我成功地在网格列中放置了一个下拉菜单。但是我不知道如何设置选定的值，当我保存时它也不会保存我的选定值。

这是网格：

@using Perseus.Areas.Communication.Models
@using Perseus.Common.BusinessEntities;


<div class="gridWrapper">
    @(Html.Kendo().Grid<CommunicationModel>()
        .Name("grid")
        .Columns(colums =>
        {
            colums.Bound(o => o.communication_type_id)
                .EditorTemplateName("_communicationDropDown")
                .ClientTemplate("#: communication_type #")
                .Title("Type")
                .Width(180);
            colums.Bound(o => o.sequence).Width(180);
            colums.Bound(o => o.remarks);
            colums.Command(command => command.Edit()).Width(50);
        })
        .Pageable()
        .Sortable()
        .Filterable()
        .Groupable()
        .Editable(edit => edit.Mode(GridEditMode.InLine))
        .DataSource(dataSource => dataSource
            .Ajax()
            .ServerOperation(false)
            .Model(model => model.Id(o => o.communication_id))
                .Read(read => read.Action("AjaxBinding", "Communication", new { id = @ViewBag.addressId }))
                .Update(update => update.Action("Update", "Communication"))
            .Sort(sort => { sort.Add(o => o.sequence).Ascending(); })
            .PageSize(20)
        )
    )
</div>

编辑器模板"_communicationDropDown"

@model Perseus.Areas.Communication.Models.CommunicationModel


@(Html.Kendo().DropDownListFor(c => c.communication_type_id)
        .Name("DropDownListCommunication")
            .DataTextField("description1")
            .DataValueField("communication_type_id")
            .BindTo(ViewBag.CommunicationTypes))

- bjornruysen

1

你有找到解决方案吗？我也遇到了同样的问题。我能够在下拉列表中显示文本，但是如何设置值呢？ - Systematix Infotech

问题似乎已经解决了，您能否澄清一下您的clientTemplate中“communication_type”字段是什么？ - Gyuzal

你在哪里定义了 .ClientTemplate("#: communication_type #")？能否请您发布整个网格的控制器。 - user5472027

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Igorrious · Accepted Answer

我认为需要指出的重要一点是DropDownList名称应该与列名属性匹配。HTML属性名称是“name =”，而不是列标题。这些名称必须匹配才能正常工作，因为在编辑操作期间，您正在用来自编辑模板的另一个控件替换默认编辑器控件。如果在将DOM序列化回更新操作的模型时名称不匹配，则会忽略来自编辑模板控件的值。默认情况下，它是出现在模型类中的属性变量名称，除非在标记中覆盖。

（答案已编辑以包括插入记录操作）。

以下是一个可行的示例：

Model Class:

public class Employee
{
    public int EmployeeId { get; set; }
    public string Name { get; set; }
    public string Department { get; set; }
}

视图：

@(Html.Kendo().Grid<Employee>()
     .Name("Grid")
     .Columns(columns =>
     {
         columns.Bound(p => p.Name).Width(50);
         columns.Bound(p => p.Department).Width(50).EditorTemplateName("DepartmentDropDownList");
         columns.Command(command => command.Edit()).Width(50);
     })
     .ToolBar(commands => commands.Create())
     .Editable(editable => editable.Mode(GridEditMode.InLine))
     .DataSource(dataSource => dataSource
         .Ajax() 
         .Model(model => model.Id(p => p.EmployeeId))
         .Read(read => read.Action("GetEmployees", "Home")) 
         .Update(update => update.Action("UpdateEmployees", "Home"))
         .Create(create => create.Action("CreateEmployee", "Home"))
     )
)

局部视图编辑器模板，文件名为“DepartmentDropDownList”，位于特定于此视图的EditorTemplates文件夹中。即Home \ Views \ EditorTemplates \ DepartmentDropDownList.cshtml。

@model string

@(Html.Kendo().DropDownList()
    .Name("Department")  //Important, must match the column's name
    .Value(Model)
    .SelectedIndex(0)
    .BindTo(new string[] { "IT", "Sales", "Finance" }))  //Static list of departments, can bind this to anything else. ie. the contents in the ViewBag

读取操作的控制器：

public ActionResult GetEmployees([DataSourceRequest]DataSourceRequest request)
{
    List<Employee> list = new List<Employee>();
    Employee employee = new Employee() { EmployeeId = 1, Name = "John Smith", Department = "Sales" };
    list.Add(employee);
    employee = new Employee() { EmployeeId = 2, Name = "Ted Teller", Department = "Finance" };
    list.Add(employee);

    return Json(list.ToDataSourceResult(request));
}

更新操作的控制器：

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult UpdateEmployees([DataSourceRequest] DataSourceRequest request, Employee employee)
{
    return Json(new[] { employee }.ToDataSourceResult(request, ModelState));
}

创建操作的控制器：

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult CreateEmployee([DataSourceRequest] DataSourceRequest request, Employee employee)
{
    employee.EmployeeId = (new Random()).Next(1000);  
    return Json(new[] { employee }.ToDataSourceResult(request, ModelState));
}