Question

我有一个带有描述列的kendo网格。如何限制用户输入特殊字符？我的Kendo网格列字段如下所示。

{ field : "myDesc", width : 200, title : "My Description"}

到目前为止，我已经完成了以下操作......但没有运气。

{ 
  field : "myDesc",
  width : 200,
  title : "My Description",
  editor: function(container, options) { 
              $('<input type="text" pattern="[A-Za-z0-9]" class="k-input k-textbox">')
                  .appendTo(container); 
          },
  attributes : {
                "class":"table-cell",
                style:"text-align: left;
                       white-space:nowrap;
                       overflow:hidden;
                       text-overflow:ellipsis;"
               }
}

我想限制输入~_!@#$%^&*()+=-[]\\\';,./{}|\":<>?

等特殊字符

更新

好吧，我错过了让你们知道我正在使用AngularJS的kendo UI网格。我通过以Angular方式修改我的代码尝试了Marco建议的解决方案。仍然没有运气。

{ field : "myDesc", width : 200, title : "My Description", 
                                    editor: function(container, options) { 
                                          $('<input type="text" class="k-input k-textbox" ng-keypress="isValidChar($event)">').appendTo(container); 
                                    },
                                    attributes : {"class":"table-cell",style:"text-align: left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;"}},

我的功能如下。

$scope.isValidChar = function(e) {
                var match = e.key.match(/[a-zA-Z0-9]/);
                return  match ? true : false; 
            };

此外，我还看到另外一个问题，当我关注我输入的内容未更新时，它会显示之前的值。

在此处附加屏幕截图。抱歉，为了隐私目的，我必须在屏幕截图上屏蔽一些内容。

screen shot

Answer 1

您可以使用onkeypress事件执行此操作：

{ 
  field : "myDesc",
  width : 200,
  title : "My Description",
  editor: function(container, options) { 
              $('<input type="text" class="k-input k-textbox" onkeypress="return isValidChar(event)">')
                  .appendTo(container); 
          },
   /*...*/
}

function isValidChar(e) {
    var match = e.key.match(/[a-zA-Z0-9]/);
    return  match ? true : false; 
}

演示：https://dojo.telerik.com/erIRUSiR/2

如何限制在Kendo网格输入栏中输入特殊字符

1 个答案: