Wie Sonderzeichen in winkeligen Js-Eingabe-Tag zu deaktivieren. Nur alphanumerisch zulassen

Question

So deaktivieren Sie Sonderzeichen in eckigen js-Eingabetag. erlauben nur alphanumerische wie wir

<input type="text" ng-trim="false" style="text-transform: uppercase" ng-pattern="/^[a-zA-Z0-9]*$/" class="form-text" id="pan_card_number" name="pan_card_number" ng-minlength="10" maxlength="10" required ng-model="registration.newTSP.panCardNumber"> 

Answer 1

verwenden Sie die folgende

-Controller

$scope.panCardRegex = '/[A-Z]{5}\d{4}[A-Z]{1}/i'; 

zu ermöglichen, nur verwenden HTML

<input type="text" ng-model="abc" ng-pattern="panCardRegex" /> 

Answer 2

Satzmuster alphanumerische

/^[a-z0-9]+$/i 

Answer 3

können Sie Regex mit Ng-Muster verwenden und Display die Nachricht über ng-Nachricht

$scope.useOnlySpecialCharacters = /^[a-zA-Z0-9]*$/; 

<input type="text" ng-model="specialcharacters" 
ng-pattern="useOnlySpecialCharacters" /> 

zeigen Nachricht über ng-Nachricht

<div ng-message="pattern"> Please Enter AlphaNumeric </div> 

ODER

Die beste Option ist die Verwendung von Direktiven

app.directive('noSpecialChar', function() { 
    return { 
    require: 'ngModel', 
    restrict: 'A', 
    link: function (scope, element, attrs, modelCtrl) { 
     modelCtrl.$parsers.push(function (inputValue) { 
     if (inputValue == null) { 
      return ''; 
     } 

     var cleanInputValue = inputValue.replace(/[^\w\s]/gi, ''); 
     if (cleanInputValue != inputValue) { 
      modelCtrl.$setViewValue(cleanInputValue); 
      modelCtrl.$render(); 
     } 

     return cleanInputValue; 
     }); 
    } 
    } 
}); 

LINK

Answer 4

Verwendung ng-pattern="/[A-Z]{5}\d{4}[A-Z]{1}/i" in Ihrem HTML-Input-Tag

Answer 5

Use Directives to restrict Special characters: 

angular.module('scPatternExample', []) 
     .controller('scController', ['$scope', function($scope) { 
     }]) 
    .directive('restrictSpecialCharactersDirective', function() { 
     function link(scope, elem, attrs, ngModel) { 
       ngModel.$parsers.push(function(viewValue) { 
       var reg = /^[a-zA-Z0-9]*$/; 
       if (viewValue.match(reg)) { 
        return viewValue; 
       } 
       var transformedValue = ngModel.$modelValue; 
       ngModel.$setViewValue(transformedValue); 
       ngModel.$render(); 
       return transformedValue; 
       }); 
      } 

      return { 
       restrict: 'A', 
       require: 'ngModel', 
       link: link 
      };  
     }); 


    <input type="text" ng-model="coupon.code" restrict-Special-Characters-Directive>