代码之家 › 专栏 › 技术社区 › Richard Griffiths

剑道网格内联编辑删除我的下拉列表当前值

kendo-grid jquery

Richard Griffiths · 技术社区 · 9 年前

问题:我有一个剑道网格,使用内联编辑和下拉列表。当我选择下拉菜单时,我得到我的项目,当我更新值时,得到设置-一切都好!然而,当我最初编辑该项时,网格中显示的当前值从下拉框中消失(如果我不更新该字段,值仍然保持不变-只是编辑时不会显示)。

schema: {
    model: {
       id: "Id",
       fields: {
          Id: { type: "number" },
          ...
          Relationship: { type: "string" },
          ...
       }
    }
 }


columns: 
[
  { field: "Firstname", title: "Firstname" },
  ....
  { field: "RelationValue", title: "Relationship", editor: GetRelationships, 
  template: function (data) { return "<span title='" + data.Relationship + "'>" 
  + data.Relationship + "</span>" } },
  ...
  { command: ["edit"], title: "&nbsp;", width: "110px" }
],
editable: "inline"




function GetRelationships(container, options) {
        $('<input data-text-field="RelationValue" data-value-field="RelationId" data-bind="value:' + options.field + '"/>')
            .appendTo(container)
            .kendoDropDownList({
                dataTextField: "RelationValue",
                dataValueField: "RelationId",
                dataSource: {
                    transport: {
                        read: {
                            dataType: "jsonp",
                            url: "http://localhost:55719//HouseholdMembers/_GetRelationships",
                        }
                    }
                },
                change: function (e) {
                    var dataItem = e.sender.dataItem();
                    options.model.set("Relationship", dataItem.RelationValue);
                }
            });
    }

下拉列表布局

public JsonResult _GetRelationships()
{
    List<Relations> Relationships = new List<Relations>();
    Relationships.Add(new Relations() { RelationId = 1, RelationValue = "Partner" });

    return this.Jsonp(Relationships);
}

1 回复 | 直到 9 年前

Zeeshan 9 年前

GetRelationships 在JS脚本中,使用以下代码:

function GetRelationships(container, options) {
        $('<input data-text-field="RelationValue" data-value-field="RelationId" data-bind="value:' + options.field + '"/>')
            .appendTo(container)
            .kendoDropDownList({
                dataTextField: "RelationValue",
                dataValueField: "RelationId",
                value: options.model.RelationId, // THIS IS THE CHANGE I MADE
                dataSource: {
                    transport: {
                        read: {
                            dataType: "jsonp",
                            url: "http://localhost:55719//HouseholdMembers/_GetRelationships",
                        }
                    }
                },
                change: function (e) {
                    var dataItem = e.sender.dataItem();
                    options.model.set("Relationship", dataItem.RelationValue);
                }
            });
    }

为了便于参考,我创建了用于网格内联编辑的工作DOJO,其中下拉菜单作为编辑器。你可以在这里找到小提琴 Inline Grid Editing with Dropdown As editor template

如果这不起作用,请告诉我。否则,请不要忘记将其标记为已接受的解决方案。