Jquery 使用ngGrid使某些单元格不可聚焦
我正在使用ngGrid显示一些数据。我的一些字段使用单元格模板显示输入字段,而其他字段不使用任何单元格模板 ngGrid向单元格添加一个Jquery 使用ngGrid使某些单元格不可聚焦,jquery,angularjs,ng-grid,Jquery,Angularjs,Ng Grid,我正在使用ngGrid显示一些数据。我的一些字段使用单元格模板显示输入字段,而其他字段不使用任何单元格模板 ngGrid向单元格添加一个tabindex属性。我已使用jQuery(目前仅在我的浏览器控制台中进行测试)从所有非输入字段的单元格中删除了此属性,以便用户只需在行中的输入字段中使用tab键,并尝试将属性的值设置为-1。这似乎没有得到尊重,因为当我在字段中使用tab键时,焦点仍然指向作为标签的列 my ngGrid的选项如下: $scope.model.gridOptions = {
tabindex
属性。我已使用jQuery(目前仅在我的浏览器控制台中进行测试)从所有非输入字段的单元格中删除了此属性,以便用户只需在行中的输入字段中使用tab键,并尝试将属性的值设置为-1
。这似乎没有得到尊重,因为当我在字段中使用tab键时,焦点仍然指向作为标签的列
my ngGrid的选项如下:
$scope.model.gridOptions = {
enableCellSelection: true,
multiSelect: false,
data: 'model.tests',
columnDefs: [
{ field: 'field1', displayName: 'Field 1', width: '75px' },
{ field: 'field2', displayName: 'Field 2', width: '150px', cellTemplate: '<input ng-required="true" min=0 type="number" ng-model="COL_FIELD" ng-input="COL_FIELD">' },//A
{ field: 'field3', displayName: 'Field 3', width: '75px' },
//More fields, a mix of input fields and labels
};
$scope.model.gridOptions={
enableCellSelection:true,
多选:错,
数据:“模型测试”,
columnDefs:[
{字段:'field1',显示名称:'field1',宽度:'75px'},
{字段:'field2',显示名称:'field2',宽度:'150px',单元格模板:'},//A
{字段:'field3',显示名称:'field3',宽度:'75px'},
//更多字段,输入字段和标签的混合
};
编辑:
如果我通过用户操作(如按钮)删除tabindex,我会得到预期的行为(即无法聚焦字段),但是另一个问题是tab按钮不允许您通过第一个非聚焦元素
我创建了一个plunkr
来演示这一点
因此,现在的问题是:
有人知道我如何禁用非输入字段的聚焦功能,并允许用户通过非聚焦元素进行制表吗?
更新:
在仔细查看ngGrid代码后,网格似乎捕获了
tab
keydown事件,并尝试了一些特殊处理。我尝试了一些不同的方法,并设法实现了一些我想要的行为,但它最终破坏了Shift+tab
行为您可以使用下面的方法请使用2.0.14 ng grid版本验证并注释您的移除选项卡索引。选项卡将按预期工作
索引:0,
noTabInterference:true这很奇怪。文档中说“以下元素支持tabindex属性:A、AREA、BUTTON、INPUT、OBJECT、SELECT和TEXTAREA。”ng grid将tabindex设置为…和所有内容一样。也许您可以使用event并通过编程将焦点设置为下一个元素。@link64:当元素具有类时=“ngSelectionCell”它不会收到0的tabindex,也不会覆盖任何现有的tabindex。这在NgGridDirections.directive('ngCell'…(在ng grid.js中的第2650行附近)中是硬编码的。不过,我不确定这对我们有什么帮助。