kendo ui grid添加記錄不止一次

Question

我有一個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 
      }, 

      ] 
     }); 
    } 

返回add_email.php

[{ 「EMAILID」：200}]的一個例子

如果我加載g例如，用一個ID刪除我單擊加載108按鈕。添加操作完美。但是當我點擊並在兩個按鈕之間混合。即使用不同的ID加載網格 添加函數多次調用帶有以前的id和帶有單擊的按鈕id的其他函數。更多按鈕之間的混合點擊，更多的添加功能被調用。

這是顯示問題的link。

請問，我該如何解決這個問題？我嘗試了許多事情，但都沒有運氣

Answer 1

您使用全局變量，因此混淆了您的數據源。

變化

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 
}