Can't call javascript function

Question

I can't seem call the function formValidation from my form. I tried everything but I'm pretty sure I'm over-looking something minor

I have to add more text to post this question and hopefully this much is enough

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <script>
        function formValidation(){
            var user = document.getElementById("username").value;
            var password = document.getElementById("password").value;
            var userValid = /^[a-zA-Z0-9]{5,10}$/;
                // username must be between 5 to 10 characters and shouldn't contain special characters
            var passwordValid = /^{8,18}$/;
                //password must be atleast 8 characters

            if(!userValid.match(user)){
                alert('Invalid username');
                return false;
            }
            echo('test');
            return true;
        }
    </script>
<h3>Register New User</h3> 

    <form name = "form1" onsubmit="return formValidation() " action="process.php" method="POST" >
<!--      Order matters, first JS script run then the next php page visited -->
        Username:<input type="text" id="username" placeholder="Enter" value="" name="username"> <br>    
        Email ID:<input type="text" name= "email"><br>
        Password: <input type="password" id="password" ><br>
        Confirm Password: <input type="password" id="password" ><br>
                 <input type="submit" name="button" value="Click here">

    </form>
</body>
</html>

I am sure it calls your javascript function.. Try to pass an alert statement in the beginning of your script. `alert('testing...');` — Corfitz., Feb 03 '18 at 15:29
See this stackoverflow which is similar to yours: https://stackoverflow.com/questions/8053394/how-to-do-something-before-on-submit — SteveB, Feb 03 '18 at 15:38
@SteveB The answers referred to are in jQuery. This script is written based on pure Javascript. — Corfitz., Feb 03 '18 at 15:40
var passwordValid = /^{8,18}$/; remove this line & try. this is causing the problem. — prasanna puttaswamy, Feb 03 '18 at 15:41
@Dimser good point but the main component of the answer is pure javascript, the return true or return false part. The user flagged this question as php and html and didn't flag as javascript so I took a leap. — SteveB, Feb 03 '18 at 15:44
So Akbar... are you going to respond to all the help received? — IncredibleHat, Feb 03 '18 at 15:54
I was away for a while, thanks for all the help :) I cant seem to upvote anything due to less reputation — Akbar Hashmi, Feb 03 '18 at 17:08

Corfitz. · Accepted Answer · 2018-02-03T15:55:51.270

You have to match the string to the regex, not the regex to the string. e.g. str.match(regex); instead of regex.match(str);.

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <script>
        function formValidation(){
            var user = document.getElementById("username").value;
            var password = document.getElementById("password").value;
            var userValid = /^[a-zA-Z0-9]{5,10}$/;
                // username must be between 5 to 10 characters and shouldn't contain special characters
            var passwordValid = /^[a-zA-Z0-9]{8,18}$/;
                //password must be atleast 8 characters

            if(!user.match(userValid)){
                alert('Invalid username');
                return false;
            }
        }
    </script>

<h3>Register New User</h3> 




    <form name = "form1" onsubmit="return formValidation() " action="process.php" method="POST" >
<!--      Order matters, first JS script run then the next php page visited -->
        Username:<input type="text" id="username" placeholder="Enter" value="" name="username"> <br>    
        Email ID:<input type="text" name= "email"><br>
        Password: <input type="password" id="password" ><br>
        Confirm Password: <input type="password" id="password" ><br>
                 <input type="submit" name="button" value="Click here">

    </form>




</body>
</html>

@AkbarHashmi You are most welcome. If this solved your problem, I would appreciate if you could mark the answer as correct. — Corfitz., Feb 04 '18 at 11:10

jasinth premkumar · Answer 2 · 2018-02-03T15:51:15.690

there is no function like echo in javascript so remove echo function and it will work

it is a php ffunction to print

error one:

<script>
function validateForm() {
    var x = document.forms["myForm"]["fname"].value;
    echo('asd');
    if (x == "") {
        alert("Name must be filled out");
        return false;
    }
    
}
</script>

<body>

<form name="myForm" 
onsubmit="return validateForm()" method="post">
Name: <input type="text" name="fname">
<input type="submit" value="Submit">
</form>

</body>

working one

<script>
function validateForm() {
    var x = document.forms["myForm"]["fname"].value;
   
    if (x == "") {
        alert("Name must be filled out");
        return false;
    }
    
}
</script>
<body>

<form name="myForm" 
onsubmit="return validateForm()" method="post">
Name: <input type="text" name="fname">
<input type="submit" value="Submit">
</form>

</body>

while using unknown function or syn tax error javascript will not be called

yes, there is a equivalent to echo. it's called `printf` or `return` @jasinthpremkumar — , Feb 03 '18 at 15:51
Ahh this confused me a lot learning php and JS simultaneously — Akbar Hashmi, Feb 03 '18 at 17:10
@AkbarHashmi is my answer is a solution to your problem ? if it is mark this as solved :) — jasinth premkumar, Feb 04 '18 at 05:44

Can't call javascript function

2 Answers2