इनलाइन केंडो ग्रिड में अद्यतन को रद्द करें पंक्ति

Question

हटाएं मैं दो केंडो इनलाइन ग्रिड माता-पिता और बच्चे का उपयोग कर रहा हूं। बाल ग्रिड में उत्पादों की सूची होती है, जब उपयोगकर्ता बाल ग्रिड से उत्पादों (एकाधिक चयन) का चयन करते हैं और बटन को सहेजने के लिए क्लिक करते हैं, तो यह एक अभिभावक ग्रिड में डाला जाता है।

बाल ग्रिड:

var selectedIds = {}; 

var ctlGrid = $("#KendoWebDataGrid3"); 
ctlGrid.kendoGrid({ 
    dataSource: { 
     data:data1, 
     schema: { 
      model: { 
       id: 'id', 
       fields: { 
        select: { 
         type: "string", 
         editable: false 
        }, 

        Qty: { 
         editable: true, 
         type: "number", 
         validation: { min: 1, required: true } 
        }, 
        Unit: { 
         editable: false, 
         type: "string" 
        }, 
        StyleNumber: { 
         editable: false, 
         type: "string" 
        }, 
        Description: { 
         editable: false, 
         type: "string" 
        } 


       } 
      } 
     }, 
     pageSize: 5 
    }, 
    editable: 'inline', 
    selectable: "multiple", 
    sortable: { 
     mode: 'single', 
     allowUnsort: false 
    }, 
    pageable: true, 
    columns: [{ 
     field: "select", 
     title: " ", 
     template: '<input type=\'checkbox\' />', 
     sortable: false, 
     width: 35}, 
    { 

     title: 'Qty', 
     field: "Qty", 
     width:90}, 
    { 
     field: 'Unit', 
     title: 'Unit', 
     width: 80}, 
    { 
     field: 'StyleNumber', 
     title: 'Style Number', 
     }, 
    { 
     field: 'Description', 
     width: 230}, 

    {command: [<!---{text:"Select" ,class : "k-button",click: selectProduct},--->"edit" ], title: "Command", width: 100 } 

    ], 
    dataBound: function() { 
     var grid = this;    
     //handle checkbox change 
     grid.table.find("tr").find("td:first input")   
      .change(function(e) {     
       var checkbox = $(this);  
       var selected = grid.table.find("tr").find("td:first input:checked").closest("tr"); 

       grid.clearSelection();  

       //persist selection per page 
       var ids = selectedIds[grid.dataSource.page()] = []; 

       if (selected.length) { 
        grid.select(selected); 
        selected.each(function(idx, item) { 
         ids.push($(item).data("id")); 
        });      
       } 

      }) 
      .end() 
      .mousedown(function(e) { 
       e.stopPropagation(); 
      }) 

     //select persisted rows 
     var selected = $(); 
     var ids = selectedIds[grid.dataSource.page()] || []; 

     for (var idx = 0, length = ids.length; idx < length; idx++) { 
      selected = selected.add(grid.table.find("tr[data-id=" + ids[idx] + "]")     ); 
     } 

     selected 
      .find("td:first input") 
      .attr("checked", true) 
      .trigger("change"); 


    } 
}); 

var grid = ctlGrid.data("kendoGrid"); 

grid.thead.find("th:first") 
    .append($('<input class="selectAll" type="checkbox"/>')) 
    .delegate(".selectAll", "click", function() { 
     var checkbox = $(this);    

     grid.table.find("tr") 
      .find("td:first input") 
      .attr("checked", checkbox.is(":checked")) 
      .trigger("change"); 
    }); 

सहेजें बटन क्लिक किया इवेंट

 function selectProduct() 
    { 

     //Selecting child Grid 
     var gview = $("#KendoWebDataGrid3").data("kendoGrid"); 
     //Getting selected rows 
     var rows = gview.select(); 

      //Selecting parent Grid 
     var parentdatasource=$("#grid11").data("kendoGrid").dataSource;       
     var parentData=parentdatasource.data(); 


      //Iterate through all selected rows 
      rows.each(function (index, row) 
      { 
       var selectedItem = gview.dataItem(row); 
       var selItemJson={id: ''+selectedItem.id+'', Qty:''+selectedItem.Qty+'',Unit:''+selectedItem.Unit+'',StyleNumber:''+selectedItem.StyleNumber+'',Description:''+selectedItem.Description+''}; 


       //parentdatasource.insert(selItemJson); 
      var productsGrid = $('#grid11').data('kendoGrid'); 
      var dataSource = productsGrid.dataSource; 
      dataSource.add(selItemJson); 
      dataSource.sync(); 



      }); 

     closeWindow(); 

    } 

जनक ग्रिड:

var data1=[]; 
    $("#grid11").kendoGrid({ 
      dataSource: { 
       data:data1, 

      schema: { 
        model: { id: "id" , 
         fields: { 

            Qty: { validation: { required: true } }, 
            Unit: { validation: { required: true } }, 
            StyleNumber: { validation: { required: true } }, 
            Description: { validation: { required: true } } 
           } 
          } 
        }, 
      pageSize: 5 
     }, 
     pageable: true, 
     height: 260, 
     sortable: true, 
     toolbar: [{name:"create",text:"Add"}], 
     editable: "inline", 
     columns: [ 

       {field: "Qty"}, 
       {field: "Unit"}, 
       {field: "StyleNumber"}, 
       {field: "Description"}, 
       { command: ["edit", "destroy"], title: " ", width: "172px" }] 

    }); 
    $('#grid11').data().kendoGrid.bind("change", function(e) { 
     $('#grid11').data().kendoGrid.refresh(); 
    }); 
    $('#grid11').data().kendoGrid.bind('edit',function(e){ 

     if(e.model.isNew()){ 
      e.container.find('.k-grid-update').click(function(){ 
       $('#grid11').data().kendoGrid.refresh(); 

      }), 
      e.container.find('.k-grid-cancel').click(function(){ 
       $('#grid11').data().kendoGrid.refresh(); 

      }) 

     } 

}) 

ऐड जी डेटा को पैरेंट ग्रिड में अच्छी तरह से काम करते हैं, कोई मुद्दा नहीं, लेकिन जब मैं पैरेंट ग्रिड का चयन करता हूं तो संपादित करने के लिए नई पंक्ति जोड़ें तो रद्द करें बटन पंक्ति को हटा दें।

मैं समस्या का पता लगाने में सक्षम नहीं हूं। कृपया मेरी मदद करें।

Answer 1

मैं एक ही समस्या होती है और जैसे मैं रद्द config:

... 
cancel: function(e) { 
      this.refresh(); 
     }, 
... 

मैं इसे सबसे अच्छा तरीका है नहीं लगता है, लेकिन यह काम कर रहा है।

आशा एक और लोग हमें एक बेहतर तरीका दे सकते हैं।

Answer 2

मुझे त्रुटि मिली, आशा आपकी मदद कर सकती है।

आप डेटा स्रोत विन्यास नहीं दिए थे: स्कीमा: मॉडल की "आईडी" क्षेत्र, एक और पंक्ति में जब क्लिक संपादित करें अद्यतन करने से पहले या रद्द करें क्लिक करें, यह पंक्ति को हटा देंगे। ।।

var dataSource = new kendo.data.DataSource({ 
     ... 
     schema: { 
      model: { 
       id:"id", // Look here, if you did not config it, issue will happen 
       fields: {... 
         ...} 
      } 
     } 

     ... 
}) 

Answer 3

बचत मैं $ ('# ग्रिड') को डेटा ('kendoGrid') dataSource.read() फोन के बाद;

जो संपादन पंक्ति को रद्द करता है और किसी भी परिवर्तन को पढ़ता है।

Answer 4

अभी भी ठीक नहीं लग रहा है। मैं इसे 'preventDefault()' से संबोधित कर रहा हूं। इसके परिणामस्वरूप विंडो के स्पष्ट समापन की आवश्यकता हो सकती है।

cancel: function (e) { 
     // Not sure why this is needed but otherwise removes row... 
     e.preventDefault(); 
     e.container.data("kendoWindow").close(); 
    }, 

Answer 5

schema: { 
    model: { id: "StyleNumber" // "Any ID Field from the Fields list" , 
     fields: { 

      Qty: { validation: { required: true } }, 
      Unit: { validation: { required: true } }, 
      StyleNumber: { validation: { required: true } }, 
      Description: { validation: { required: true } } 
     } 
    } 
} 

यह आपकी समस्या का समाधान होगा।