0

私は剣道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
          },

          ]
      });
  }

add_email.php を返す例

[{"EmailId":200}]

たとえば、グリッドに 1 つの ID をロードすると、[Load 108] ボタンをクリックします。追加操作は完全に機能します。しかし、2つのボタンをクリックしてミックスすると。つまり、異なる ID でグリッドをロードします。 add 関数は、前の ID とクリックされたボタン ID で何度も呼び出されました。ボタン間のミックスクリックが増えると、追加機能が呼び出されます。

これは問題を示すリンクです。

どうすればこれを修正できますか? 私は運がなかった多くのことを試しました

4

1 に答える 1

2

グローバル変数を使用するため、データソースを混同します。

変化する

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
}
于 2013-06-27T18:48:22.767 に答える