Javascript validation in php

Question

I'm trying to use javascript to perform client-side verification of input to the following form. The 'firstname' field should contain only alphabetical characters. How can I write the validation function to implement this behaviour?

form.html

<html>
<head>
<script type="text/javascript" src="mainform.js"></script>
</head>
<body>
<form name="mainform" method="post" onSubmit="return validation();" >
    firstname <input type="text" name="firstname"><br>
    lastname <input type="text" name="lastname"><br>
    username <input type="text" name="username"><br>
    password <input type="password" name="password"><br>
    confirm password<input type="password" name="cpassword"><br>
    email <input type="email" name="email"><br>
    phone no <input type="text" name="phoneno"><br>

    <input type="submit" name="submit">
</body>
</html>

form.js

function validation()
{
    var fname=document.mainform.firstname;
    var letters="/[a-zA-Z]$/";
    if(fname.value.match(letters)){
        return true;
    }  
    else  
    {  
        alert('first name must be alphabets');  
        fname.focus();  
        return false;  
    }
}

Please define 'is not working'. What is not working. What is your input and expected output. — Antony D'Andrea
– Antony D'Andrea, Commented Dec 9, 2014 at 11:19
var letters="/[a-zA-Z]$/"; Your regex doesn't need to be in quotes — SubjectCurio
– SubjectCurio, Commented Dec 9, 2014 at 11:25
I have written the validation to take characters from a-z or A-Z. But even when iam giving alphabets, it is showing that 'first name must be alphabets' — Sreeja
– Sreeja, Commented Dec 9, 2014 at 11:25

Gnucki · Accepted Answer · 2014-12-09 11:30:39Z

1

function validation()
{
    var fname = document.mainform.firstname;

    if(/^[a-zA-Z]+$/.test(fname.value)) {
        return true;
    } else {
        alert('first name must be alphabets');  
        fname.focus();  
        return false;  
    }
}

Do not forget to make a check on the server side too for security.

answered Dec 9, 2014 at 11:30

Gnucki

5,1293 gold badges32 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Sreeja Over a year ago

thank u so much. its working now but i dont want to allow alphabets in phone number field. i pasted the same code for phone number filed. its not working for phone number. var phone = document.mainform.phoneno; if(/^[0-9]+$/.test(phone.value)) { return true; } else { alert('phone'); phone.focus(); return false; }

Gnucki Over a year ago

This should work. I think this is because you put the code at the wrong place. Where did you put that code?

Hussy Borad · Accepted Answer · 2014-12-09 11:35:58Z

<!doctype html>
<html lang="en">  
<head>
  <meta charset="utf-8">
  <title>Hide</title>
  <script src="http://code.jquery.com/jquery-1.10.2.js"></script> 
  <style type="text/css">
  label input[type="button"] 
{

background: #E17698;
}
  </style>
  <script>
 $(document).delegate("#submit","click",function(e)
 {
   var name = $("#fname").val();
   var hasError = false;
  var searchReg = /^[a-zA-Z ]+$/;
 if(name == '') {
              $("#txtt").after('<span class="error" style="color:red;">&nbsp;&nbsp;&nbsp;&nbsp;*Fill Name Box</span>');
              hasError = true;
          } else if(!searchReg.test(name)) {
              $("#txtt").after('<span class="error" style="color:red;">&nbsp;&nbsp;&nbsp;&nbsp;**Enter Vaild Name.</span>');
              hasError = true;
          }else if(searchReg.test(name)) {
              $("#txtt").after('<span class="error" style="color:white;">&nbsp;&nbsp;&nbsp;&nbsp;Vaild Name</span>');

          }
          if(hasError == true) {
  return false
}
});

  </script>
</head>
<body>
<form name="mainform" method="post">
firstname <input type="text" name="firstname" id='fname'><label id="txtt"></label><br>
lastname <input type="text" name="lastname"><br>
username <input type="text" name="username"><br>
password <input type="password" name="password"><br>
confirm password<input type="password" name="cpassword"><br>
email <input type="email" name="email"><br>
phone no <input type="text" name="phoneno"><br>

<input type="submit" name="submit" id='submit'>
</form>
</body>
</html>

Thank u Hussy. But I want the validation code in javascript because i am not familiar with jquery.

Collectives™ on Stack Overflow

Javascript validation in php

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related