剣道グリッドの別のセル値に基づいてセル値を更新するasp.net mvc

Question

私はこの問題を2日間苦労しており、どんな助力も非常に高く評価されています。私は剣道グリッドを持っています。グリッドには能力のように優れています。つまり、編集可能な列を入力すると強調表示され、値を入力してタブ上で次のセルに移動します。私は編集可能な外部量と呼ばれる列を持っています。つまり、ユーザーがセルに値を入力し、次の列は、ユーザーが外部金額列に値を入力してEnterキーを押すたびに計算されるべき相違点です。

差 - InternalLocalAmt- ExallallocalAmt。 InternalLocalAmtにはすでに値が設定されており、編集できません。

コードスニペット：

@(Html.Kendo().Grid(Model) 
    .Name("OutputCashGrid") 
    .Columns(columns => 
    { 

     columns.Bound(p => p.InternalLocalAmt).Width(130); 
     columns.Bound(p => p.ExternalLocalAmt).Width(130); 
    columns.Bound(p => p.LocalDifference).Title("Difference").Width(130).Format("{0:N}").HtmlAttributes(new{id="DifferenceVal"}); 
}) 
    .Sortable() 
    .ColumnMenu() 
    .Scrollable(scr => scr.Height(430)) 
    .Filterable() 
    .Navigatable() 
    .DataSource(dataSource => dataSource 
     .Ajax() 
     .PageSize(50) 
     .ServerOperation(false) 
      .Batch(true) // Enable batch updates. 
         .Model(model => 
          { 
           model.Id(p => p.OutputcashID); // Specify the property which is the unique identifier of the model. 
           //model.Field(p => p.OutputcashID).Editable(false); // Make the ProductID property not editable. 
           model.Field(p => p.OutputcashID).Editable(false); 
           model.Field(p => p.Level1).Editable(false); 
           model.Field(p => p.TotalRecitems).Editable(false); 
           model.Field(p => p.TotalReconcilingItems).Editable(false); 
           model.Field(p => p.AsOfDate).Editable(false); 
           model.Field(p => p.InternalLocalAmt).Editable(false); 

          }) 


      .Update("Editing_Update", "SaveRec") 
      ) 


      .Pageable(pageable => pageable 
       .Refresh(true) 
       .Input(true) 
       .Numeric(false) 
      ) 
         .Resizable(resize => resize.Columns(true)) 
         .Selectable() 
         .Events(ev => ev.Change("differenceValue")) 



     ) 


<script> 
$(document).ready(function() { 

     var gridOutput = $("#OutputCashGrid").data("kendoGrid"); 

     gridOutput.table.bind("keypress", function (e) { 
      if (e.which !== 0 && e.charCode !== 0 && !e.ctrlKey && !e.metaKey && !e.altKey) { 

       //get currently navigated cell, this id follows user's navigation 
       var activeCell = $("#OutputCashGrid_active_cell"); 

       //don't do anything if already editing cell   
       if (activeCell.hasClass("k-edit-cell")) return; 

       gridOutput.editCell(activeCell); 
       var input = activeCell.find("input"); 



       //number datatype editor loses key press character when entering edit 
       if (input.last().attr('data-type') === 'number') { 
        var a= input.val(String.fromCharCode(e.keyCode | e.charCode)); 
        var selectedItemRow = gridOutput.dataItem($(e.currentTarget).closest("tr")); 
       } else { 
        input.val(""); 
       } 
      } 
     }); 


     $("#OutputCashGrid table").on("keydown", "tr", function (e) { 
      var code = (e.keyCode ? e.keyCode : e.which); 
      if (code == 13) { //If key is ENTER 
       //find index of the td element 
       var activeCell = $("#OutputCashGrid_active_cell"); 
       var tdIndex = $(e.target).closest('td').index(); 
       var tdvalue = $(e.target).closest('td').val(); 
       var cellvalue = activeCell.val(); 
       var row = $(e).closest("tr"); 
       // var model = $("#OutputCashGrid").dataItem(row); 

       //var difference = selectedItemRow.LocalDifference 
       //var TotalInternalAmt = selectedItemRow.InternalLocalAmt 
       //var TotalExternalAmt = selectedItemRow.ExternalLocalAmt 
       //var updatedDifference = Math.abs(TotalInternalAmt) - Math.abs(TotalExternalAmt) 
       //selectedItemRow.set("Differnce", updatedDifference) 
       //get the next row's cell 
       var nextRow = $(e.target).closest('tr').next(); 
       var nextRowCell = $(nextRow).find('td:eq(' + tdIndex + ')'); 



       //focus the next cell on a different context 
       setTimeout(function() { 
        var grid = $("#OutputCashGrid").data("kendoGrid"); 
        grid.current(nextRowCell); 


       }, 0); 

      } 
     }); 

</script> 

私は、グリッドを表示するスクリーンショットを添付しています。

var nextRowCell = $(nextRow).find('td:eq(' + tdIndex + ')'); 

が代わりにこれを試してみてください：

Answer 1

あなたの質問にはすでに答えていますが、私は非常に最近の自分と似たようなものに苦労していました。私が思ったより効率的な解決策でした。

（Calculations関数を使用して）グリッドdataSource内のすべてのアイテムを更新する代わりに、changeイベントをデータソースに添付し、変更された行モデルのアイテムにアクセスし、必要に応じて更新できます。例えば

：絵で

var gridOutput = $("#OutputCashGrid").data("kendoGrid"); 
gridOutput.dataSource.bind("change", function(e) { 
    // checks to see if the action is a change and the column being changed is what is expected 
    if (e.action === "itemchange" && e.field === "ExternalLocalAmount") {   
     // here you can access model items using e.items[0].modelName; 
     e.items[0].Difference = e.items[0].InternalLocalAmount - e.items[0].ExternalLocalAmount; 
     // finally, refresh the grid to show the changes 
     gridOutput.refresh(); 
    } 
}); 

Answer 2

は多分次の行が実行中から残りを妨げているように見える

var nextRowCell = nextRow.find('td:eq(' + tdIndex + ')'); 

Answer 3

私は最終的に後に多くの場合には、ここでのコードを投稿し、しようとしてソリューションを得ました将来の参照のために誰かが必要になる可能性があります。

function Calculations() { 

     var grid = $("#StaggingCashExceptionsGridTest").data("kendoGrid"); 
     var TotalExternal = 0; 

     var gridData = grid.dataSource.view(); 
     for (var i = 0; i < gridData.length; i++) { 

      TotalExternal+=gridData[i].ExternalLocalAmount;//gridDaga[0].ExternalLocalAmount , takes the first row external local amount, till the number of rows in he grid. 
      TotalInternal += gridData[i].InternalLocalAmount; 
     difference=TotalExternal-TotalInternal; 
$("#SubDifference").html(difference)//to set the value of difference cell 
    }