Javascript 单击“取消”后，剑道网格弹出编辑器不再打开

我有一个剑道网格与自定义弹出编辑器。我已经使用mvvm绑定将编辑主体定义为剑道模板，但我认为我肯定遗漏了一些东西，因为弹出窗口的行为不符合预期

单击编辑时，弹出编辑器会出现，但如果我使用取消按钮关闭弹出窗口，然后再次单击同一行上的编辑，则编辑器不会出现

此外，使用下拉菜单

measureStatusId

，字段似乎没有发生预期的更改，除非它开始时不是null

我更喜欢在这里使用mvvm，我不认为这种情况是不寻常的，需要滚动我自己的编辑弹出窗口吗

看这个

---

我认为问题在于您为数据源创建的可观察对象

请检查这个

一些变化：

• 将

  measureStatusId

  设置为

  model

  和网格模式中的一个数字
• 将网格

  status

  列从

  measureStatus

  更改为

  measureStatusId

• 更改下拉列表的html声明以包括

  数据值primitive=“true”

• 更改observable以包含

  度量值

  作为数据源，并更新网格声明以直接使用它，而不是创建新的数据源

我认为这里的关键变化是使网格和弹出窗口都指向一个对象，而不是两个单独的对象。其余的问题似乎源于不匹配的数据类型配置

可观测对象的变化如下所示

  PNCC.viewModel = new kendo.observable({
    measures: new kendo.data.DataSource({
      data: model.measures,
      schema: {
        model: {
          id: "measureId",
          fields: {
            measureId: { type: "number", editable: false },
            target: { type: "string", editable: false },
            measureStatusId: { type: "number" },
            progress: { type: "string" }
          }
        }
      },
      sort: { field: "target", dir: "asc" }
    }),
    measureStatuses: model.measureStatuses
  });

---

在您的示例中，尽管弹出窗口现在始终按预期显示，但dropdownlist中没有数据。

  PNCC.viewModel = new kendo.observable(model);

  $("#Measures").kendoGrid({
    dataSource: {
      data: model.measures,
      schema: {
        model: {
          id: "measureId",
          fields: {
            measureId: { type: "number", editable: false },
            target: { type: "string", editable: false },
            completed: { type: "boolean" },
            measureStatusId: { type: "string" },
            measureStatus: { type: "string" },
            progress: { type: "string" }
          }
        }
      },
      sort: { field: "target", dir: "asc" }
    },
    "columns": [
      {
        "title": "Performance Measures & Targets",
        "field": "target",
        width: "150px"
      },
      {
        "title": "Year to date progress and next steps",
        "field": "progress",
        width: "150px"
      },
      {
        "title": "Status",
        "field": "measureStatus",
        width: "150px"
      },
      {
        "title": "Complete?",
        "field": "completed",
        width: "150px"
      },
      { command: ["edit"], title: " ", width: "75px" }
    ],
    filterable: false,
    scrollable: true,
    editable: {
      mode: "popup",
      template: kendo.template($("#popup_editor").html())
    }
  });

  PNCC.viewModel = new kendo.observable({
    measures: new kendo.data.DataSource({
      data: model.measures,
      schema: {
        model: {
          id: "measureId",
          fields: {
            measureId: { type: "number", editable: false },
            target: { type: "string", editable: false },
            measureStatusId: { type: "number" },
            progress: { type: "string" }
          }
        }
      },
      sort: { field: "target", dir: "asc" }
    }),
    measureStatuses: model.measureStatuses
  });