剑道ui网格多次添加记录

kendo ui grid add the record more than once

本文关键字:添加 加记录 ui 网格 剑道      更新时间:2023-09-26

我有一个kendo ui网格,在更改行事件时,我获取行id并将其传递给另一个加载其他网格的函数。我试着简化操作来找出这样的错误。

HTML代码

<input type="button" id="load-first" value="Load 108" />    
<input type="button" id="load-second" value="Load 92" />

Javascript

$("#load-first").click(function(){
    loadEmailGrid(108);
});
$("#load-second").click(function(){
    loadEmailGrid(92);
});
  function loadEmailGrid(salesRepsId) {
      dataSource = new kendo.data.DataSource({
          transport: {
              read: {
                  url: "operations/get_emails_sales_reps.php?salesRepsId=" + salesRepsId,
                  type: "GET"
              },
              update: {
                  url: "operations/edit_email.php?salesRepsId=" + salesRepsId,
                  type: "POST",
                  complete: function (e) {
                      $("#email-grid").data("kendoGrid").dataSource.read();
                  }
              },
              destroy: {
                  url: "operations/delete_email.php",
                  type: "POST",
                  complete: function (e) {
                      $("#email-grid").data("kendoGrid").dataSource.read();
                  }
              },
              create: {
                  url: "operations/add_email.php?salesRepsId=" + salesRepsId,
                  type: "POST",
                  complete: function (e) {
                      $("#email-grid").data("kendoGrid").dataSource.read();
                  }
              },
          },
          schema: {
              data: "data",
              total: "data.length", //total amount of records
              model: {
                  id: "EmailId",
                  fields: {
                      EmailType: {
                          defaultValue: {
                              EmailTypeId: 2,
                              EmailTypeName: "Home"
                          }
                      },
                      EmailText: {
                          type: "string"
                      },
                      IsMainEmail: {
                          type: "boolean"
                      },
                  }
              }
          },
          pageSize: 5,
      });
      //dataSource.sync();
      $("#email-grid").kendoGrid({
          dataSource: dataSource,
          height: 250,
          filterable: true,
          sortable: true,
          pageable: true,
          reorderable: false,
          groupable: false,
          batch: true,
          navigatable: true,
          toolbar: ["create", "save", "cancel"],
          editable: true,
          columns: [{
              field: "EmailType",
              title: "Type",
              editor: EmailTypeDropDownEditor,
              template: "#=EmailType.EmailTypeName#",
              filterable: {
                  extra: false,
                  field: "EmailType.EmailTypeName",
                  operators: {
                      string: {
                          startswith: "Starts with",
                          eq: "Is equal to",
                          neq: "Is not equal to"
                      }
                  }
              }
          }, {
              field: "EmailText",
              title: "Email",
          }, {
              field: "IsMainEmail",
              title: "Main?",
              width: 65,
              template: function (e) {
                  if (e.IsMainEmail == true) {
                      return '<img align="center" src ="images/check-icon.png" />';
                  } else {
                      return '';
                  }
              }
              // hidden: true
          }, {
              command: "destroy",
              title: "&nbsp;",
              width: 90
          },
          ]
      });
  }

return add_email.php 的示例

〔{"EmailId":200}〕

例如,如果我用一个id加载网格,我会单击"加载108"按钮。添加操作非常有效。但当我点击并在两个按钮之间混合时。即用不同的id加载网格add函数调用了很多次,一次是使用先前的id,另一次是用单击的按钮id。按钮之间的混合单击越多,调用的add函数就越多。

这是一个显示问题的链接。

求你了,我该怎么修?我尝试了很多没有运气的事情

您使用全局变量,因此会混淆数据源。

更改

dataSource = new kendo.data.DataSource({...

var dataSource = new kendo.data.DataSource({...

然后再试一次。

编辑:

尝试将其作为脚本代码。

http://jsfiddle.net/blackjim/9LHW5

您必须做的主要事情是将网格的初始化与传输选项的更改分开。

例如:

function loadDatasourceWithId(salesRepsId){
    var dataSourceOptions = dataSource.options; // find somehow the dataSource options
    dataSourceOptions.transport.read.url = "operations/get_emails_sales_reps.php?salesRepsId="+salesRepsId;
    dataSourceOptions.transport.update.url = "operations/edit_email.php?salesRepsId="+salesRepsId;
    dataSourceOptions.transport.create.url = "operations/add_email.php?salesRepsId="+salesRepsId
    datasource.read(); // read again to get new values to your dataSource
}