javascript - How to check for special characters when validating a form - Stack Overflow

admin管理员组

文章数量:1351984

I'm trying to add form validation into my form. I've managed to do it for character length, numbers, letters and all of them work fine, but it doesn't seem to work for special characters, such as @ & * etc.

I've tried following an example from a previous question which created a variable for all the different special characters, and then I did here what I did with my other checks, matched the field input to the variable with the special characters to see if there are any, but it is not detecting them.

This is my JavaScript for this:

function ValidateActInsert() {
var specialChars = /[!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?]/;
        if (document.actorInsert.actInsert.value.match(specialChars)) {
        alert ("Only characters A-Z, a-z and 0-9 are allowed!")
        document.actorInsert.actInsert.focus();
        return false;
    }
    return (true);
}

And this is the HTML form that I am trying to do this on:

<form name = "actorInsert" align = "center" action="actorInserting.php" onSubmit="return ValidateActInsert()">
    Actor name:<br>
    <input type = "text" name = "actInsert"
    <br><br>
    <input type = "submit" value = "Insert">
</form>

The code itself makes sense to me and i'd imagine that it would work and I honestly have no idea as to why it isn't

I'm trying to add form validation into my form. I've managed to do it for character length, numbers, letters and all of them work fine, but it doesn't seem to work for special characters, such as @ & * etc.

I've tried following an example from a previous question which created a variable for all the different special characters, and then I did here what I did with my other checks, matched the field input to the variable with the special characters to see if there are any, but it is not detecting them.

This is my JavaScript for this:

function ValidateActInsert() {
var specialChars = /[!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?]/;
        if (document.actorInsert.actInsert.value.match(specialChars)) {
        alert ("Only characters A-Z, a-z and 0-9 are allowed!")
        document.actorInsert.actInsert.focus();
        return false;
    }
    return (true);
}

And this is the HTML form that I am trying to do this on:

<form name = "actorInsert" align = "center" action="actorInserting.php" onSubmit="return ValidateActInsert()">
    Actor name:<br>
    <input type = "text" name = "actInsert"
    <br><br>
    <input type = "submit" value = "Insert">
</form>

The code itself makes sense to me and i'd imagine that it would work and I honestly have no idea as to why it isn't

• javascript

Share Improve this question Follow asked Mar 25, 2019 at 16:12 Kappa123Kappa123 35111 gold badge44 silver badges1212 bronze badges 2

• 4 Instead of trying to catch every possible special symbol, try catching only alphanumeric symbols. Much easier – Sterling Archer Commented Mar 25, 2019 at 16:14
• 1 @SterlingArcher gave him an example. – ABC Commented Mar 25, 2019 at 16:16

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

You were catching every symbol.

Let's just simple only allow a-z lowercase, A-Z uppercase and or 0-9 as @SterlingArcher said.

/[^a-zA-Z ]/g Will allow only a-z and A-Z

/[^a-zA-Z0-9 ]/g Will allow only a-z, A-Z, and 0-9

Letters and Numbers:

function ValidateActInsert() {
    var specialChars = /[^a-zA-Z0-9 ]/g;
    if (document.actorInsert.actInsert.value.match(specialChars)) {
        alert ("Only characters A-Z, a-z and 0-9 are allowed!")
        document.actorInsert.actInsert.focus();
        return false;
    }
    return (true);
}

<form name = "actorInsert" align = "center" action="actorInserting.php" onSubmit="return ValidateActInsert()">
    Actor name:<br>
    <input type = "text" name = "actInsert"
    <br><br>
    <input type = "submit" value = "Insert">
</form>

Numbers only

function ValidateActInsert() {
    var specialChars = /[^a-zA-Z ]/g;
    if (document.actorInsert.actInsert.value.match(specialChars)) {
        alert ("Only characters A-Z, a-z are allowed!")
        document.actorInsert.actInsert.focus();
        return false;
    }
    return (true);
}

<form name = "actorInsert" align = "center" action="actorInserting.php" onSubmit="return ValidateActInsert()">
    Actor name:<br>
    <input type = "text" name = "actInsert"
    <br><br>
    <input type = "submit" value = "Insert">
</form>

I suggest using https://regexr./ to test expressions and to learn from some examples.

Use regex.test(val)

^[0-9a-zA-Z ]*$

^ start

[0-9a-zA-Z] only allow the characters inside [ ]

$ end * as many characters as it contains

function ValidateActInsert() {
  var regex = /^[0-9a-zA-Z ]*$/;
  var val = document.getElementsByTagName('input')[0].value;
  if(!regex.test(val)){
    alert("false");
  }else{
    alert("true");
  }
  return false;
}

<form name = "actorInsert" align = "center" action="actorInserting.php" onSubmit="return ValidateActInsert()">
    Actor name:<br>
    <input type = "text" name = "actInsert">
    <br>
    <input type = "submit" value = "Insert">
</form>

本文标签： javascriptHow to check for special characters when validating a formStack Overflow