Question

我正在使用ASP.NET MVC3，Jquery和＆amp; Kendo UI。

以下是我的网格设置方式的剪辑（我删除了所有不相关的字段）：

Html.Kendo()
    .Grid<MyProject.Models.Domain.Students>()
    .Name("Students")
    .Sortable(settings => settings.Enabled(false))
    .Filterable(settings => settings.Enabled(false))
    .Resizable(resizing => resizing.Columns(true))
    .Scrollable(settings => settings.Enabled(true))     
    .HtmlAttributes(new { style = "font-size: 85%;" })
    .Columns(columns =>
        {
            columns.Bound(o => o.StudentId).Title("StudentId").Hidden();
            columns.Bound(o => o.Name).Title("Student Name").Width(200);
            columns.Bound(o => o.teacher).Title("Teacher")
                 .ClientTemplate("#=data.teacher ? teacher.teacherName : ''#").Width(150).Filterable(false);
        })
        .DataSource(dataSource => dataSource.Ajax()
                                            .Batch(true)
                                            .ServerOperation(false)
                                            .Model(model =>
                                                {
                                                    model.Id(c => c.StudentId);
                                                    model.Field(c => c.teacher);                                                       
                                                })
                                                .Events(events => events.Error("Field_onError"))
                                                .Read(read => read.Action("_AjaxGetFields", "Student"))
                                                .Update("_AjaxUpdateFields", "Student")
                                                .Destroy("_AjaxDelFields", "Student"))
        .Events(events => events.DataBound("Fields_onDataBound")
                                .Change("onFieldSelect")
                                .Edit("onFieldEdit")
                                )
        .ToolBar(commands =>
            {
                commands.Save().HtmlAttributes(new { id = "saveField" }); 
            })
        .Scrollable(scrollable => scrollable.Height("375px"))
        .Selectable()
        .Editable(editing => editing.Mode(Kendo.Mvc.UI.GridEditMode.InCell)).Render();

以下是教师下拉菜单的模板：

@(Html.Kendo().DropDownList()
    .Name(ViewData.TemplateInfo.GetFullHtmlFieldName(string.Empty))
    .DataValueField("TeacherId")       
    .DataTextField("TeacherName")
    .DataSource(source =>
    {
        source.Read(read =>
        {
            read.Action("_SelectTeacherList", "Teacher").Data("onTeacherDataBinding");
        }).ServerFiltering(true);
    })
    .Events(e => e           
        .Change("dropdownlist_change")
        )
)

我在网格上没有另一个下拉菜单。我有一个jquery函数，每次下拉更改时都会执行该函数。下拉列表是教师名单。当它发生变化时，我想将网格每一行的教师列设置为在下拉列表中选择的相同值和文本对。

这是我到目前为止，您可以看到我需要放置一些代码的评论。我不知道该怎么做：

function teachers_change()
{
    var teacherDL = $("#allTeach").data("kendoDropDownList");
    teachid = teacherDL.value();
    teachName = teacherDL.text();

    $("#Students tr").each(function ()
    {
        var tr = this;
        var cells = tr.cells;
        //RIGHT HERE IS WHERE I WANT TO GET A REFERENCE TO THE DROP DOWN 
        //AND SET THE VALUE TO teachid AND THE TEXT TO teachName
    });
}

Answer 1

这应该自动完成，如果生成的DropDownList的名称被称为您的属性，那么它们应该通过data-bind属性绑定。

在您的情况下，DropDownList名称应为“teacher”。休息应该自动完成，Grid使用的整个dataItem应该用DropDownList的DataItem替换。

Answer 2

经过这么多小时后，它可能不是很漂亮，但是它可以完成这项任务。

如果有人有更好的解决方案，请发帖!!!

grid.dataSource._data[this.rowIndex].teacher.teacherId = teachid ;
grid.dataSource._data[this.rowIndex].teacher.teacherName = teachName;
grid.dataSource._data[this.rowIndex].dirty = true;
TDIndex = (this.rowIndex * 17) +3;
grid.table[0].cells[TDIndex].innerHTML = '<span class="k-dirty"></span>' + teachName;
grid._data[this.rowIndex].teacher.teacherId = teachid;
grid._data[this.rowIndex].teacher.teacherName = teachName;

前两行和后两行直接修改下拉列表正在使用的数据源。中间的行设置实际的网格字段，以便在下拉列表未打开时在网格中看到所选的值。

使用DropDown的Kendo网格，迭代网格设置下拉值

2 个答案: