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

Posted 2023-05-09

【中文标题】如何限制在剑道网格输入栏中输入特殊字符

【英文标题】：How to restrict entering special characters into Kendo grid input column

【发布时间】：2018-10-31 12:10:00

【问题描述】：

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

 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 的剑道 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

【问题讨论】：

您将什么定义为特殊字符？你为什么不想要它们？

到目前为止你做了什么？

到目前为止我已经完成了如下...但没有运气

field : "myDesc", width : 200, title : "My Description", editor: function(container, options) $('').appendTo(container); , 属性："class":"table-cell",style:"text-align: left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;",

我想限制输入特殊字符，例如 (# ^ | ....and 更多)。

【参考方案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

【讨论】：

你好宏！对不起...我想我搞砸了你的建议。我刚开始在 *** 上提问。

没关系。它的工作原理完全一样：plnkr.co/edit/nd1bYcLVWUyeM9SJjRcw?p=preview

嗨，马可！感谢您的帮助。