2017-09-11 13 views
2

私はある編集可能な列を持つ剣道グリッドを持っています。特定のJavaScript関数を実行すると、現在選択されているセルの編集を有効にします。要点は、これはプログラムで発生し、セルをクリックすることではないということです。現在のコードでは、編集モードに設定する必要があるセルを選択しますが、編集モード自体は使用できません。kendogridの選択されたセルの編集モード

編集(修正):

行選択は、(ヘッダがセルか何かとしてカウントされ、おそらくので)同じ滞在しながら、私は1に、セル選択にインデックスを変更しなければなりませんでした。即座に閉じた編集フィールドからフォーカスを外した機能もありました。

JS:

$('#txtBarcode').keydown(function (e) { 
    var key = e.charCode ? e.charCode : e.keyCode ? e.keyCode : 0; 
    if (key == 13) { 

     var grid = $("#PickListDetailGrid").data("kendoGrid"); 
     var dataSource = $("#PickListDetailGrid").data("kendoGrid").dataSource; 
     var allData = dataSource.data(); 
     var code = this.value; 

     $.each(allData, function (index, item) { 
      if (item.ArticleID == code) { 
       console.log("index :" + index);      
       var cell = grid.select("tr:eq(" + index + ") td:eq(" + (5) + ")"); 
       grid.editCell(cell); 
      } 
     }) 
    } 
}); 

グリッド:編集で

@(Html.Kendo().Grid<TelerikMvcApp1.Models.PickListLineViewModel>() 
         .Name("PickListDetailGrid") 
         .Columns(columns => 
         { 
          columns.Bound(c => c.ArticleName); 
          columns.Bound(c => c.ArticleID); 
          columns.Bound(c => c.PickID); 
          columns.Bound(c => c.LineNum); 
          columns.Bound(c => c.Quantity); 
          columns.Bound(c => c.PickedQuantity).HtmlAttributes(new { @id = "test" }); 
          columns.Bound(c => c.Status); 
         }) 
         .Editable(editable => editable.Mode(GridEditMode.InCell)) 
         .HtmlAttributes(new { style = "height: 75%;" }) 
         .Scrollable() 
         .Groupable() 
         .Sortable() 
         .Selectable() 
         .RowAction(row => 
         { 
          if (row.DataItem.Quantity == row.DataItem.PickedQuantity) 
          { 
           row.HtmlAttributes["class"] = "k-state-selected"; 
          } 
         }) 
         .ToolBar(toolbar => 
         { 
          toolbar.Custom().Text("Return to Picklists") 
          .HtmlAttributes(new { @style = "color:black; width:100%; height:50%;" }) 
          .Action("Picklist", "PickList"); 
         }) 
      .DataSource(dataSource => dataSource 
       .Ajax() 
       .Events(events => events.Error("error")) 
       .Model(model => model.Id(i => i.PickID)) 
       .Model(model => 
       { 
        model.Field(f => f.PickID).Editable(false); 
        model.Field(f => f.ArticleID).Editable(false); 
        model.Field(f => f.LineNum).Editable(false); 
        model.Field(f => f.Quantity).Editable(false); 
        model.Field(f => f.ArticleName).Editable(false); 
        model.Field(f => f.Status).Editable(false); 
        model.Field(f => f.PickedQuantity).Editable(true); 
       }) 
       .Read(read => read.Action("PickLines_Read", "PickList", new { name = "id", id = Model.FirstOrDefault().PickID })) 
       .Update(update => update.Action("submitPickList", "PickList")) 
     ) 
     .Events(events => events 
     .Change("onChange") 
     .Edit("onEdit") 
     .Save("onSave")) 
    ) 

:代わりに

function onEdit(e) { 
    e.container.find("input").bind("focus", function() { 
     if (this.style.display != "none") { 
      var element = this; 
      setTimeout(function() { 
       element.select(); 
      }) 
     } 
    }) 

    setTimeout(function() { 
     document.activeElement.select(); 
    }) 
} 

答えて

0

var cell = grid.select("tr:eq(" + index + ") td:eq(" + (5) + ")"); 
grid.editCell(cell); 

試してみてください:

grid.editCell("tr:eq(" + index + ") td:eq(" + (5) + ")"); 
+0

すでに試しましたが効果がありませんでした。 – Alim

+0

onEditイベント定義を投稿することもできますか? –

+0

私はそれをメインポストに追加しました。現在、マウスを使ってフィールドを開くと自動的に値が選択されます。 – Alim

関連する問題