如何限制在Kendo網格輸入欄中輸入特殊字符

Question

我有一個帶有說明列的劍道網格。 如何限制用戶輸入特殊字符？ 我的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;"
               }
}

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

更新資料

好吧，我想讓大家知道我正在使用kendo UI網格和AngularJS。 我嘗試通過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; 
            };

而且，當我集中精力輸入的內容沒有更新並且顯示了先前的值時，我在這里又看到了一個問題。

此處附有屏幕截圖。 抱歉，出於隱私目的，我必須在屏幕截圖上屏蔽一些內容。

屏幕截圖

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