如何使用jQuery向kendo-grid的数据源添加新对象?

时间:2019-06-27 14:01:56

标签: javascript jquery kendo-ui kendo-grid

我试图将新对象添加到jQuery的kendo-grid中,但是如果我通过弹出窗口添加对象,则该对象将被替换。在这段代码中,我尝试从此变量gridData1推送数据,但它未反映在剑道网格中。

<script>
  $(function() {
    var gridData = [];
    var gridDataNextID = gridData.length + 1;
    var gridDataSource = new kendo.data.DataSource({
      transport: {
        read: function(options) {
          options.success(gridData);
        },
        update: function(options) {
          options.success();
        },
        create: function(options) {
          console.log("options: ", options);
          var gridData1 = {
            Column: {
              FieldsID: 1003667,
              FieldsName: "Control Number"
            },
            Condition: {
              textName: "==",
              valueN: "Is"
            },
            ID: 2,
            LogicalOperator: {
              operator: "||",
              operatorValue: "OR"
            },
            enterValueTxt: "mnb"
          };
          grid.dataSource.data(gridData1);
          grid.options.columns = columns;
          options.data.ID = gridDataNextID++;
          gridData.push(options.data);
          options.success(options.data);
          grid.refresh();
        }
      },
      schema: {
        model: {
          id: "ID",
          fields: {
            ID: {
              type: "number",
              editable: false
            },
            Column: {
              defaultValue: {
                "FieldsID": 1003667,
                "FieldsName": "Control Number"
              }
            },
            Condition: {
              defaultValue: {
                textName: "==",
                valueN: "Is"
              }
            },
            enterValueTxt: {
              defaultValue: null
            },
            LogicalOperator: {
              defaultValue: {
                operator: "||",
                operatorValue: "OR"
              }
            }
          }
        }
      }
    });
    $("#grid").kendoGrid({
      columns: [{
          field: "Column",
          title: "Column Name",
          template: "#: Column.FieldsName #"
        },
        {
          field: "Condition",
          title: "Condition Name",
          template: "#: Condition.textName #"
        },
        {
          field: "enterValueTxt",
          title: "Value",
          template: "#: enterValueTxt #"
        },
        {
          field: "LogicalOperator",
          title: "Logical Operator",
          template: "#:LogicalOperator.operatorValue #"
        },
        {
          command: ["edit", "destroy"]
        }
      ],
      toolbar: [{
        name: "create",
        text: "Add / Edit Record"
      }],
      editable: {
        mode: "popup",
        window: {
          width: 415,
          title: "Add / Edit",
        },
        template: $("#popupTemplate").html()
      },
      edit: function(e) {
        initDropDownLists();
      },
      autoBind: true,
      dataSource: gridDataSource
    });
    $('#grid').data('kendoGrid').refresh();
  });
</script>

0 个答案:

没有答案