This question is unlikely to help any future visitors; it is only relevant to a small geographic area, a specific moment in time, or an extraordinarily narrow situation that is not generally applicable to the worldwide audience of the internet. For help making this question more broadly applicable, visit the help center.
Closed 10 years ago.
I have a sign up form on my page at http://business.uglyopportunities.com/affiliate-signup/ (scroll down to see the form)
Keep in mind, I am not very good with JS so this may be a simple error.
Anyways, here is the first line of my form telling it to validate:
<form accept-charset="UTF-8" action="xxxxx" class="infusion-form" method="POST" name="myform" onsubmit="return validateForm();">
and here is my validateForm javascript:
<script type="text/javascript">
function validateForm() {
var a = document.forms["myform"]["inf_field_FirstName"].value;
var b = document.forms["myform"]["inf_field_Email"].value;
var c = document.forms["myform"]["inf_field_Phone1"].value;
var d = document.forms["myform"][" inf_field_StreetAddress1"].value;
var e = document.forms["myform"][" inf_field_City"].value;
var f = document.forms["myform"][" inf_field_State"].value;
var g = document.forms["myform"][" inf_field_PostalCode"].value;
var h = document.forms["myform"][" inf_other_Username"].value;
var i = document.forms["myform"][" inf_other_Password"].value;
var j = document.forms["myform"][" inf_other_RetypePassword"].value;
if (a == null || a == "" || a == "First Name Here") {
alert("Please enter your First Name!");
return false;
}
if (c == null || c == '' || c == "Enter Your Phone Here" || c.length < 9) {
alert("Please insert your phone number!");
return false;
}
if (d == null || d == '' || d == "Street Address”) {
alert("Please insert your street address ");
return false;
}
if (e == null || e == '' ||e == "City”) {
alert("Please insert your city");
return false;
}
if (f == null || f == '' || f == "State”) {
alert("Please insert your state ");
return false;
}
if (g == null || g == '' ||g == "Postal Code”) {
alert("Please insert your postal code");
return false;
}
if (h == null || h == '' || h == "Username”) {
alert("Please insert your username ");
return false;
}
if (i == null || i == '' ||i == "password”) {
alert("Please insert your password");
return false;
}
if (j == null || j == '' || j == "password”) {
alert("Please re - type your password ! ");
return false;
}
var emailRegEx = /^[A-Z0-9._%+-]+#[A-Z0-9.-]+\.[A-Z]{2,4}$/i;
if (document.myform.inf_field_Email.value.search(emailRegEx) == -1) {
alert("Please enter a valid email address.");
return false;
}
}
</script>
and that is not working. However, when I used this code, it worked fine:
<script type="text/javascript">
function validateForm() {
var a=document.forms["myform"]["inf_field_FirstName"].value;
var b=document.forms["myform"]["inf_field_Email"].value;
var c=document.forms["myform"]["inf_field_Phone1"].value;
if (a==null || a=="" || a=="First Name Here") {
alert("Please enter your First Name!");
return false;
}
if (c==null || c==''|| c=="Enter Your Phone Here" || c.length < 9) {
alert("Please insert your phone number!");
return false;
}
var emailRegEx = /^[A-Z0-9._%+-]+#[A-Z0-9.-]+\.[A-Z]{2,4}$/i;
if (document.myform.inf_field_Email.value.search(emailRegEx) == -1) {
alert("Please enter a valid email address.");
return false;
}
}
</script>
UPDATED CODE *
<script type="text/javascript">// <![CDATA[
function validateForm() {
var a = document.forms["myform"]["inf_field_FirstName"].value;
var b = document.forms["myform"]["inf_field_Email"].value;
var c = document.forms["myform"]["inf_field_Phone1"].value;
var d = document.forms["myform"]["inf_field_StreetAddress1"].value;
var e = document.forms["myform"]["inf_field_City"].value;
var f = document.forms["myform"]["inf_field_State"].value;
var g = document.forms["myform"]["inf_field_PostalCode"].value;
var h = document.forms["myform"]["inf_other_Username"].value;
var i = document.forms["myform"]["inf_other_Password"].value;
var j = document.forms["myform"]["inf_other_RetypePassword"].value;
if (a == null || a == "" || a == "First Name Here") {
alert("Please enter your First Name!");
return false;
}
if (c == null || c == '' || c == "Enter Your Phone Here" || c.length < 9) {
alert("Please insert your phone number!");
return false;
}
if (d == null || d == '' || d == "Street Address") {
alert("Please insert your street address ");
return false;
}
if (e == null || e == '' ||e == "City") {
alert("Please insert your city");
return false;
}
if (f == null || f == '' || f == "State") {
alert("Please insert your state ");
return false;
}
if (g == null || g == '' ||g == "Postal Code") {
alert("Please insert your postal code");
return false;
}
if (h == null || h == '' || h == "Username") {
alert("Please insert your username ");
return false;
}
if (i == null || i == '' ||i == "password") {
alert("Please insert your password");
return false;
}
if (j == null || j == '' || j == "password") {
alert("Please re - type your password ! ");
return false;
}
var emailRegEx = /^[A-Z0-9._%+-]+#[A-Z0-9.-]+\.[A-Z]{2,4}$/i;
if (document.myform.inf_field_Email.value.search(emailRegEx) == -1) {
alert("Please enter a valid email address.");
return false;
}
}
// ]]>
</script>
You have a white space here:
var d = document.forms["myform"][" inf_field_StreetAddress1"].value;
// ^-----------------------
You have the same problem with for e,f,g,h,i,j
Also, you used the wrong quotes sign:
"Street Address”
// ^--------------
You did it several times.
As gdoron says, it's probably an spelling problem. You cannot begin the name of an element with a whitespace http://www.w3.org/TR/html401/types.html#type-name
Related
I am facing issue with javascript for form validation.
On one of the forms the javascript function is working properly, and when on other form, i am trying to do form validation, but the script does not fire up.. i have tried many times to clear my browser cache and refreshed the page but i am not getting any results.
I would be thankful if anyone reviews it and help spot the issue.
The following is the function that works on my homepage:
<script>
function validate()
{
var uid = document.getElementById("usrname").value;
var pwd = document.getElementById("passwd").value;
if (uid == "" || pwd == "") {
alert("Empty fields not allowed");
return false;
}
else if (uid.length < 4 || uid.length > 20) {
alert("User ID string length should be between 4 - 20");
return false;
}
else if (pwd.length < 6 || pwd.length >20) {
alert("Password length should be between 6 - 20");
return false;
}
return true;
}
</script>
<form name="ulogin" action="login.php" method="post" onSubmit="return validate();">
The following validation code on the other page does not run:
<script>
function regval()
{
var cname = document.getElementById("name1").value;
var email = document.getElementById("email").value;
var phn = document.getElementById("phone").value;
var addr1 = document.getElementById("addr1").value;
var addr2 = document.getElementById("addr2").value;
var city = document.getElementById("city").value;
var state = document.getElementById("state").value;
var country = document.getElementById("country").value;
var uname = document.getElementById("uname").value;
var pwd = document.getElementById("passwd").value;
var cnfp = document.getElementById("cnf_passwd").value;
var secans = document.getElementById("sec_ans").value;
var regex=/^[0-9]+$/;
var alphanum=/^[a-z0-9]+$/i;
if(cname == "" || email == "" || phn == "" || addr1 == "" || addr2 == "" || city == "" || state == "" || state == "" || country == "" || uname == "" || pwd == "" || cnfp == ""|| secans == "") {
alert("Empty fields not allowed");
return false;
}
if (cname.length < 3 || cname.length > 20) {
alert("Name length should be between 4-20 characters.");
return false;
}
if (email.length < 10 || email.length > 50 ) {
alert("email length should be between 10-50 characters.");
return false;
}
if (phn.length < 7 || phn.length > 11 ) {
alert("check phone number length.");
return false;
}
else if (!phn.match(regex)) {
alert("Please check inputs, only numbers are allowed.!");
return false;
}
if (city.toLowerCase() != "surat" || state.toLowerCase() != "gujarat" || country.toLowerCase() != "india") {
alert("Sorry, we only serve in surat currently at the moment..!!");
return false;
}
if (uname.length < 4 || uname.length > 20) {
alert("user name should be between 4 - 20 characters.");
return false;
}
else if (!uname.match(alphanum)) {
alert("only characters A-z 0-9 are allowed.");
return false
}
if (pwd.length < 6 || pwd.length > 30) {
alert("password length should be between 6 - 30 characters.");
return false;
}
else if (!pwd.match(alphanum) {
alert("Only characters A-z 0-9 are allowed.");
return false;
}
if (pwd != cnfp) {
alert("the passwords do not match, please check and try again.");
return false;
}
if (secans.length < 5 || secans.length > 20) {
alert("please check for security answer length. It should be between 5 to 20 characters.");
return false;
}
return true;
}
</script>
<form name="usreg" action="signup.php" method="POST" onSubmit="return regval();">
the script tags are in the head tags of my webpage.
Thanks in advance.
Missing closing bracket ) Here else if (!pwd.match(alphanum) {
if (pwd.length < 6 || pwd.length > 30) {
alert("password length should be between 6 - 30 characters.");
return false;
}
else if (!pwd.match(alphanum) {
alert("Only characters A-z 0-9 are allowed.");
return false;
}
Should be
if (pwd.length < 6 || pwd.length > 30) {
alert("password length should be between 6 - 30 characters.");
return false;
}
else if (!pwd.match(alphanum)) {
alert("Only characters A-z 0-9 are allowed.");
return false;
}
Note: Always check browser console log for errors.
I have the following code. It works fine for blank fields, but it doesn't catch the other numeric exceptions. What am I doing wrong?
function validateForm() {
var a = document.forms["Form"]["percentage"].value;
var b = document.forms["Form"]["minutes"].value;
if (a == null || b == null || a == "" || b == "") {
alert("Please Fill All Required Field");
return false;
} else if (isNan(a) == true || isNan(b) == true) {
alert("Please enter valid numeric values");
return false;
} else if (parseInt(a) > 100) {
alert("Percentage can't exceed 100");
return false;
} else if (parseInt(b) < 0 || parseInt(a) < 0) {
alert("Values can't be negative");
return false;
}
}
Change this line:
else if((isNan(a)==true) ||(isNan(b)==true)){
to this:
else if (isNaN(a) || isNaN(b)) {
as the function is named #isNaN(). Using == true in conditionals is quite redundant, so I removed them.
I have also made a fiddle for you. It contains the fixed code, and it is working well.
I am having a hard time trying to do a correct form validation. I have Name, Email, and Phone Number fields. I implemented the validation check for all of them and when I click on the submit query, it returns email as false, but not anything else. It also will still submit the form. How do I fix this?
JSFiddle: http://jsfiddle.net/GVQpL/
JavaScript Code:
function validateForm(/*fullName, email, phoneNumber*/)
{
//-------------------------NAME VALIDATION-----------------------------//
var fullNameV = document.forms["queryForm"]["fullName"].value;
if (fullNameV == null || fullNameV == "")
{
alert("Name must be filled out!");
return false;
}
else if(fullNameV.indexOf(" ") <= fullNameV.length)
{
alert("Not a valid name");
return false;
}
//-------------------------EMAIL VALIDATION-----------------------------//
var emailV = document.forms["queryForm"]["email"].value;
if (emailV == null || emailV == "")
{
alert("Email must be filled out!");
return false;
}
var atpos = emailV.indexOf("#");
var dotpos = emailV.lastIndexOf(".");
if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= x.length)
{
alert("Not a valid e-mail address");
return false;
}
//-------------------------PHONE # VALIDATION-----------------------------//
var phoneNumberV = document.forms["queryForm"]["phoneNumber"].value;
if (phoneNumberV == null || phoneNumberV == "")
{
alert("Phone Number must be filled out!");
return false;
}
var error = "";
var stripped = phoneNumberV.replace(/[\(\)\.\-\ ]/g, '');
if (phoneNumberV == "")
{
error = alert("You didn't enter a phone number.\n");
phoneNumberV.style.background = 'Yellow';
}
else if (isNaN(parseInt(stripped)))
{
error = alert("The phone number contains illegal characters.\n");
phoneNumberV.style.background = 'Yellow';
}
else if (!(stripped.length == 10))
{
error = alert("The phone number is the wrong length. Make sure you included an area code.\n");
phoneNumberV.style.background = 'Yellow';
}
return error;
}
Update your fiddle's html for the function to be called onsubmit="return validateForm()" and removed the required="required" changed your function to work, you can see it here:
http://jsfiddle.net/GVQpL/3/
function validateForm(/*fullName, email, phoneNumber*/)
{
//-------------------------NAME VALIDATION-----------------------------//
var fullNameV = document.forms["queryForm"]["fullName"].value;
if (fullNameV == null || fullNameV == "")
{
alert("Name must be filled out!");
document.forms["queryForm"]["fullName"].focus();
return false;
}
else if(fullNameV.indexOf(" ") >= fullNameV.length)
{
alert("Not a valid name");
document.forms["queryForm"]["fullName"].focus();
return false;
}
//-------------------------EMAIL VALIDATION-----------------------------//
var emailV = document.forms["queryForm"]["email"].value;
if (emailV == null || emailV == "")
{
alert("Email must be filled out!");
document.forms["queryForm"]["email"].focus();
return false;
}
var emailReg = /^([\w-\.]+#([\w-]+\.)+[\w-]{2,4})?$/;
if(!emailReg.test(emailV)){
alert("Not a valid e-mail address");
document.forms["queryForm"]["email"].focus();
return false;
}
//-------------------------PHONE # VALIDATION-----------------------------//
var phoneNumberV = document.forms["queryForm"]["phoneNumber"].value;
if (phoneNumberV == null || phoneNumberV == "")
{
alert("Phone Number must be filled out!");
document.forms["queryForm"]["phoneNumber"].focus();
return false;
}
var error = "";
var stripped = phoneNumberV.replace(/[\(\)\.\-\ ]/g, '');
if (phoneNumberV == "")
{
alert("You didn't enter a phone number.\n");
document.forms["queryForm"]["phoneNumber"].focus()
document.forms["queryForm"]["phoneNumber"].style.background = 'Yellow';
return false;
}
else if (isNaN(parseInt(stripped)))
{
alert("The phone number contains illegal characters.\n");
document.forms["queryForm"]["phoneNumber"].focus();
document.forms["queryForm"]["phoneNumber"].style.background = 'Yellow';
return false;
}
else if (!(stripped.length == 10))
{
alert("The phone number is the wrong length. Make sure you included an area code.\n");
document.forms["queryForm"]["phoneNumber"].focus();
document.forms["queryForm"]["phoneNumber"].style.background = 'Yellow';
return false;
}
if(!confirm('Are you sure you want to submit your DSLR query?')){
return false;
}
return true;
}
The radio validation works but then the rest don't. What have I done wrong?
function validateRadio(radios) {
for (i = 0; i < radios.length; ++i) {
if (radios[i].checked) return true;
}
return false;
}
function validateForm() {
if (validateRadio(document.forms["pancettaForm"]["updateShip"])) {
return true;
} else {
alert("Please tell us how you would like to update your order.");
return false;
}
}
var x = document.forms["pancettaForm"]["order-number"].value;
if (x == null || x == "") {
alert("Please provide your order number.");
return false;
}
var x = document.forms["pancettaForm"]["full-name"].value;
if (x == null || x == "") {
alert("Please provide your full name, or the recipients name if you are updating shipping information.");
return false;
}
var x = document.forms["pancettaForm"]["phone"].value;
if (x == null || x == "") {
alert("Please provide a phone number in case of delivery questions.");
return false;
}
var display = document.getElementById('address').style.display;
if (display == 'block') {
var x = document.forms["pancettaForm"]["address"].value;
if (x == null || x == "") {
alert("Please provide your address.");
return false;
}
}
var display = document.getElementById('city').style.display;
if (display == 'block') {
var x = document.forms["pancettaForm"]["city"].value;
if (x == null || x == "") {
alert("Please provide your city.");
return false;
}
}
var display = document.getElementById('state').style.display;
if (display == 'block') {
if (document.pancettaForm.state.value == "- Select State -") {
alert("Please provide your state.");
return false;
}
}
var display = document.getElementById('zip').style.display;
if (display == 'block') {
var x = document.forms["pancettaForm"]["zip"].value;
if (x == null || x == "") {
alert("Please provide your zip code.");
return false;
}
}
var display = document.getElementById('newShipDate').style.display;
if (display == 'block') {
if (document.pancettaForm.state.value == "- Select Date -") {
alert("Please choose your new shipping date.");
return false;
}
}
Just reverse the test so you do not have to return
if(!validateRadio (document.forms["pancettaForm"]["updateShip"]))
{
alert("Please tell us how you would like to update your order.");
return false;
}
// continue
You had the end bracket after the test of the radios so the rest of the script just floated in cyberspace
Also return true only once at the end and do not have var x multiple times and be consistent in how you access the form elements and I also fixed your date test which was testing state
function validateForm() {
var x,display,form = document.forms["pancettaForm"];
if (!validateRadio(form["updateShip"])) {
alert("Please tell us how you would like to update your order.");
return false;
}
x = form["order-number"].value;
if (x == null || x == "") {
alert("Please provide your order number.");
return false;
}
x = form["full-name"].value;
if (x == null || x == "") {
alert("Please provide your full name, or the recipients name if you are updating shipping information.");
return false;
}
x = form["phone"].value;
if (x == null || x == "") {
alert("Please provide a phone number in case of delivery questions.");
return false;
}
display = form["address"].style.display;
if (display == 'block') {
x = form["address"].value;
if (x == null || x == "") {
alert("Please provide your address.");
return false;
}
}
display = form["city"].style.display;
if (display == 'block') {
x = form["city"].value;
if (x == null || x == "") {
alert("Please provide your city.");
return false;
}
}
display = form['state'].style.display;
if (display == 'block') {
x = form['state'].value;
if (x == "- Select State -") {
alert("Please provide your state.");
return false;
}
}
display = form['zip'].style.display;
if (display == 'block') {
x = form["zip"].value;
if (x == null || x == "") {
alert("Please provide your zip code.");
return false;
}
}
display = form["newShipDate"].style.display;
if (display == 'block') {
x = form["newShipDate"].value;
if (x.value == "- Select Date -") {
alert("Please choose your new shipping date.");
return false;
}
}
return true;
}
I have a javascript alert on my form here - http://investing.uglyopportunities.com/opportunity/ I have the javascript function working correctly for my form. Except I also want the javascript to alert when the user doesn't select from either of the two drop down menus. I really don't have much experience at all with javascript, so keep that in mind! Here is my current code. I really appreciate any help
<script type="text/javascript">// <![CDATA[
function validateForm() {
var a = document.forms["myform"]["inf_field_FirstName"].value;
var b = document.forms["myform"]["inf_field_Email"].value;
var c = document.forms["myform"]["inf_field_Phone1"].value;
var e = document.forms["myform"]["inf_field_City"].value;
var f = document.forms["myform"]["inf_field_State"].value;
var g = document.forms["myform"]["inf_field_PostalCode"].value;
if (a == null || a == "" || a == "First Name Here") {
alert("Please enter your First Name!");
return false;
}
if (c == null || c == '' || c == "Enter Your Phone Here" || c.length < 9) {
alert("Please insert your phone number!");
return false;
}
if (e == null || e == '' ||e == "City") {
alert("Please insert your city");
return false;
}
if (f == null || f == '' || f == "State") {
alert("Please insert your state ");
return false;
}
if (g == null || g == '' ||g == "Postal Code" || c.length < 5) {
alert("Please insert your postal code");
return false;
}
var emailRegEx = /^[A-Z0-9._%+-]+#[A-Z0-9.-]+\.[A-Z]{2,4}$/i;
if (document.myform.inf_field_Email.value.search(emailRegEx) == -1) {
alert("Please enter a valid email address.");
return false;
}
}
// ]]>
</script>
if(document.getElementById('inf_custom_LevelofInterest').value == '' || document.getElementById('inf_custom_Doyouhavemoneytoinvest').value == ''){
alert('please select ...');
return false;
}