How can i remove special character from user input using Javasvript/angularjs?

Question

Want to remove below characters from user input

!@#$%^&*()-+=\|[]{}/:;',>.<?

For example user enter below value

"Test1 Dat!@#$%^&*()-+=\|[]{}/:;',>.<?a Re_enter

Expected result = Test1 Data Re_enter

I have tried regular expression but i did't get exact one

var app = angular.module('myApp', []);
app.controller('formCtrl', function($scope) {
   
    $scope.submit = function() {
        var data = $scope.user;
        console.log(data);
    };
    
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="formCtrl">
  <form novalidate>
    Data:<br>
    <input type="text" ng-model="user.data"><br>
  
    <br><br>
    <button ng-click="submit()">SUBMIT</button>
  </form>
  
</div>

use a regular expression.... – Daniel A. White Apr 01 '20 at 13:57 — Daniel A. White, Apr 01 '20 at 13:57
I tried but i did't get exact one – martin kumar Apr 01 '20 at 14:04 — martin kumar, Apr 01 '20 at 14:04

score 1 · Accepted Answer · answered Apr 01 '20 at 14:06

For user expirience it would be better if you didnt allow entering those characters at first time. Try to use onChange event of <input type="text" ng-model="user.data"> and filter new value with regex, only after that set filtered value to model.

You can find appropriate regexp at this answer

score 1 · Answer 2 · answered Apr 01 '20 at 14:11

The Input Element has a property called pattern

There are RegExp which allow you to restrict your input from certain patterns like yours

I think it would be enough, just to allow Word-Characters (/\w*/g)

<input type="text" pattern='*Your RegExp*' ng-model="user.data"><br>

That was the HTML way

Alternatively you can check the sent input Data in the React-Based FrontEnd or at the deep end in the BackEnd. There are many solutions :)

How can i remove special character from user input using Javasvript/angularjs?

2 Answers2