作成日: 2017/08/08 最終更新日: 2017/12/13
文書種別
不具合
状況
修正済み
詳細
ComboBoxをバインドしたセルを編集モードにし、Tabキーを押下すると、右側のセルに選択が移動せず、アドレスバーにフォーカスが移動します。
◎サンプルコード(cshtml)
【再現方法】
1. サンプルを実行します。
2. 1行2列目のセルを選択し、編集モードにします。
3. Tabキーを押下します。
結果:アドレスバーにフォーカスが移動します。
◎サンプルコード(cshtml)
<script id="edtCountry" type="text/template">
@(Html.C1().ComboBox()
.Id("countryEditor")
.IsEditable(false)
.CssStyle("width", "100%")
.CssStyle("height", "100%")
.Bind(countries)
.TemplateBind("Text", "Country").ToTemplate()
)
</script>
<div>
@(Html.C1().FlexGrid()
.Id("customGridEditorsGrid")
.AutoGenerateColumns(false)
.Columns(bl =>
{
bl.Add(cb => cb.Binding("ID"));
bl.Add(cb => cb.Binding("Country").CellTemplate(ctb => ctb.EditTemplateId("edtCountry")));
bl.Add(cb => cb.Binding("Product"));
bl.Add(cb => cb.Binding("Amount").Format("n2"));
})
.Bind(bl => bl.Update(Url.Action("GridEditorsUpdate")).Bind(Model))
)
</div>
@(Html.C1().ComboBox()
.Id("countryEditor")
.IsEditable(false)
.CssStyle("width", "100%")
.CssStyle("height", "100%")
.Bind(countries)
.TemplateBind("Text", "Country").ToTemplate()
)
</script>
<div>
@(Html.C1().FlexGrid
.Id("customGridEditorsGrid")
.AutoGenerateColumns(false)
.Columns(bl =>
{
bl.Add(cb => cb.Binding("ID"));
bl.Add(cb => cb.Binding("Country").CellTemplate(ctb => ctb.EditTemplateId("edtCountry")));
bl.Add(cb => cb.Binding("Product"));
bl.Add(cb => cb.Binding("Amount").Format("n2"));
})
.Bind(bl => bl.Update(Url.Action("GridEditorsUpdate")).Bind(Model))
)
</div>
【再現方法】
1. サンプルを実行します。
2. 1行2列目のセルを選択し、編集モードにします。
3. Tabキーを押下します。
結果:アドレスバーにフォーカスが移動します。
回避方法
この問題はバージョン4.0.20173.143で修正されました。
ただし、修正版を適用した上で、FlexGrid.KeyActionTabプロパティにKeyAction.CycleまたはKeyActionlCycleOutを設定する必要があります。
修正版を適用しない場合の回避方法は次の通りです。
下記コードのようにComboBoxのkeydownイベントを処理することで、回避することができます。
◎サンプルコード(cshtml)
ただし、修正版を適用した上で、FlexGrid.KeyActionTabプロパティにKeyAction.CycleまたはKeyActionlCycleOutを設定する必要があります。
修正版を適用しない場合の回避方法は次の通りです。
下記コードのようにComboBoxのkeydownイベントを処理することで、回避することができます。
◎サンプルコード(cshtml)
function BeginEdit(grid, cellRangeEventArgs) {
if (cellRangeEventArgs.col == 1) {
var combo;
setTimeout(function () {
combo = getEditorControl('countryEditor', cellRangeEventArgs.row, cellRangeEventArgs.col);
combo.hostElement.addEventListener("keydown", function (e) {
if (e.key == "Tab") {
var grid = wijmo.Control.getControl("#customGridEditorsGrid");
var selection = grid.selection;
grid.select(selection.row, selection.col + 1);
grid.focus();
}
});
}, 10);
}
}
if (cellRangeEventArgs.col == 1) {
var combo;
setTimeout(function () {
combo = getEditorControl('countryEditor', cellRangeEventArgs.row, cellRangeEventArgs.col);
combo.hostElement.addEventListener("keydown", function (e) {
if (e.key == "Tab") {
var grid = wijmo.Control.getControl("#customGridEditorsGrid");
var selection = grid.selection;
grid.select(selection.row, selection.col + 1);
grid.focus();
}
});
}, 10);
}
}
旧文書番号
82289