Phone Number and Credit Card Number Validation

Hello i'm doing javascript validation on my form and I don't know how to do phone number validation so it only has numbers and single spaces allowed and also credit card validation which I want it to display between 13 and 18 numbers and single spaces.

Javascript:

<script type="text/javascript">

function validateForm()

{

    var x=document.forms["checkout_details"]["firstname"].value;

    if (x==null || x=="")

    {

        alert("Please fill out your First Name");

        return false;

    }

   

    var x=document.forms["checkout_details"]["lastname"].value;

    if (x==null || x=="")

    {

        alert("Please fill out your Last Name");

        return false;

    }

   

    var x=document.forms["checkout_details"]["address"].value;

    if (x==null || x=="")

    {

        alert("Please fill out your Address");

        return false;

    }

   

    var x=document.forms["checkout_details"]["email"].value;

    var atpos=x.indexOf("@");

    var dotpos=x.lastIndexOf(".");

    if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)

    {

        alert("Your Email Address is not valid. Please fill out a valid Email Address");

        return false;

    }

   

   

}

</script>

Code (markup):

HTML/PHP:

echo'<form name="checkout_details" action="confirm.php" onsubmit="return validateForm()" method="post">';

echo'<font color="red">*</font>&nbsp;<b>First Name:</b> <input type="text" name="firstname"><br /><br />';

echo'<font color="red">*</font>&nbsp;<b>Last Name:</b> <input type="text" name="lastname"><br /><br />';

echo'<font color="red">*</font>&nbsp;<b>Address:</b> <textarea name="address" rows="4" cols="20"></textarea><br /><br />';

echo'<font color="red">*</font>&nbsp;<b>Email Address:</b> <input type="text" name="email"><br /><br />';

echo'<font color="red">*</font>&nbsp;<b>Phone Number:</b> <input type="text" name="phone"><br /><br />';

echo'<font color="red">*</font>&nbsp;<b>Delivery Method:</b><br />';

echo'<input type="radio" name="radio" id="regularpost" checked="true">Regular Post<br />';

echo'<input type="radio" name="radio" id="courier">Courier<br />';

echo'<input type="radio" name="radio" id="expresscourier">Express Courier<br /><br />';

echo'<font color="red">*</font>&nbsp;<b>Please sign me up for the newsletter:</b> <input type="checkbox" name="checkbox"><br /><br />';

echo'<input type="submit" value="Purchase">';

echo'</form>';

Code (markup):

Can anyone please help me out with this? Thankyou.

 

Uhm... Why in the world do you use <font>? And why isn't the labels for the input fields actually put in <labels>? You should clean up your HTML first. Really.
And then you should check how you can use regular expressions to check for patterns, digits only, etc. when you check your input fields. Also, there's no need to use that many <br> in a form... Or at all.

 

Hi Paul.
In your case I would recommend to look into jQuery + input mask plugin.
Go to the following URL: http://plugins.jquery.com, search for "input mask" there and check the plugins.