JavaScript - Validating Multiple Conditions
Hi! I am trying to check and see if three fields are empty and if they are then to alert the user saying to fill in one of the three fields. I tried this:
Code: if (StreetNumber.value.length == 0) { if (StreetName.value.length == 0) { if (City.value.length == 0) { alert("Please enter a street number, street name, or city."); StreetNumber.focus(); return false; } } } and this: Code: if (StreetNumber.value.length == 0 && StreetName.value.length == 0 && City.value.length == 0) { alert("Please enter a street number, street name, or city."); StreetNumber.focus(); return false; } Neither one works. Not sure what I am doing wrong. Thanks in advance! Similar TutorialsFYI: THIS IS NOT HOMEWORK! Hi all, I am trying to make an all-in-one function that can use local storage and provide 4 functions: (1) read data (2) write data (3) erase specific data (4) erase all data Here's the code block I have (with alerts in place of the local storage code for debugging): Code: var storage = function (name, value) { if (name) { if (value === null) { return alert('erase'); } else { if (value != null) { return alert('write'); } else { return alert('read'); } } } else { return alert('nuke'); } }; I want to use it like this: storage(); - erases ('nukes') everything storage('abc'); - reads data stored as 'abc' storage('abc', 'newvalue'); - stores 'newvalue' as 'abc' storage('abc', null); - erases data stored as 'abc' only It seems to work, but I have a funny feeling about trusting the difference between "==" and "===" to make it work. Am I wrong? Is there a real difference between == and === and am I doing this correctly? Thanks! -- Roger I am somewhat a noob at js/jquery so I wasn't sure exactly how to do this. Think I just need a push in the right direction. Basically I'm trying to validate a form (jquery validation) with a couple of conditionals based on a selection box. So I have: Code: <form id="info" class="validate"> <select id="select"> <option value="senior">Senior Citizen</option> <option value="adult">Adult</option> <option value="child">Child</option> </select> <input type="text" name="age" id="age" class="required" minlength="1" maxlength="3" title="age group"> </form> I'm trying to validate that if the user has selected "Senior Citizen" then their age must be 65 or older (and validate the adult/child ages as well). I hope to get this all in ajax so it would be checking it live. Thanks for the help! I want to be able to load a different background image depending on the time of day. I have the code below which does work for nanaimo-morning image if before 8 am and after 8 am it will load the nanaimo-daytime image. I have tried but I can't seem to add another condition where after 8 pm it will load another imaged called nanaimo-night.png Yes, I am rather new at this, any help is greatly appreciated <code> <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Untitled Document</title> <script language="JavaScript"> function determineBackground() { var currentTime = new Date(); if (currentTime.getHours() < 8) { document.body.background = 'images/nanaimo-morning.png'; } else { document.body.background = 'images/nanaimo-daytime.png'; } } </script> </head> <body onload="determineBackground()"> </body> </html> </code> Hiya, Not sure how to put this, here goes: I'm trying to create a form to receive customer complaints. I'm fine with the basic form structure, but would like a drop-down box or radio buttons allowing the user to state which country in the UK they are emailing from. The options are, England, Scotland, Wales and N Ireland. For example, a user fills a form in with their complaint, and selects Scotland from the drop-down/radio buttons. When the users clicks on the submit button, the script should then send an acknowledgement email to the user, and send the form details of the user to the Scottish email address of the organisation. Likewise for England, Wales and N Ireland. I'm looking at doing this all client-side. Any help would be gratefully appreciated. Many Thanks Snarf1974 Hey all, Okay, Here is what i would like to do. I have a calculator he http://www.nico-online.co.uk/calculator/calc1.html which after some help from Dormilich - got working! Now, I would like to set up some conditions, so if the use selected 'Mountainbike' then, the script will perform a different calculation to if they select the 'Rennrad' option. Okay, so I was thinking an If..else..if..else statement would probably be best after reading up This is what I have come up with: Code: <script language="JavaScript"> function Framesize() { var a = parseFloat(BikeSizer.Insleg.value); if(BikeSizer.Biketype.value = "Mountainbike") { b = (a * 0.572); c = Math.round(b); BikeSizer.FramesizeCM.value = c; d = (a * 0.226); e = Math.round(d); BikeSizer.FramesizeInch.value = e; } else if (BikeSizer.Biketype.value = "Trekking-, Reise- oder Cityrad") { b = (a * 5); c = Math.round(b); BikeSizer.FramesizeCM.value = c; d = (a * 5); e = Math.round(d); BikeSizer.FramesizeInch.value = e; } else{ b = (a * 10); c = Math.round(b); BikeSizer.FramesizeCM.value = c; d = (a * 10); e = Math.round(d); BikeSizer.FramesizeInch.value = e; } } </script> So, I'm not too sure if I can set the Menu values as recongnisable values! Here are the values I have: <select name="Biketype" style="font-size:11px;"> <option>Mountainbike</option> <option>Trekking-, Reise- oder Cityrad</option> <option>Rennrad</option> </select> Anyone out there offer any insight? Am I going horribly wrong somewhere? Apologies for the stupidness , I am quite new to JS! Thanks in advance Hi I have the following code. What I want to do is for certain questions to remain hidden inless certain conditions are met, then they appear to be answered. I am thinking with the <div> but not sure how. I also thought maybe with css but cant write a if statement in css so that a no go. Please help. Code: <tr><td align="left">Do you own a Yorkie?<br /> <input type="radio" name="owner" value="yes" /> Yes <input type="radio" name="owner" value="no" checked="checked" /> No<br /> <!-- If answer is no above the below questions are hidden, if yes then they appear -->> <div id="breeders"> How many? <select name="qnty" size="1"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5+</option></select> Are you a breeder? <input type="radio" name="breeder" value="yes" checked="checked" /> Yes <input type="radio" name="breeder" value="no" /> No</div></td></tr> JavaScript Code: I am using a onload within the form opening tag Code: function showDiv() { if(document.forms[2].owner.value == "yes") { document.getElementById('breeders').style.visibility = 'visible'; } else document.getElementById('breeders').style.visibility = 'hidden'; } Never mind. I found a solution to get it working. I still don't know why it occurred, but I don't have the time to fulfill my curiosity like I could when I was a teenager. Hi I am trying to write a JavaScript conditional statement for 4 conditions I currently have: Code: var teamId=obj.id.substring(0, 1); var indx=obj.id.substring(obj.id.indexOf('_')+1); var id=indx.substring(0, indx.length-1); var anotherTab = (indx.indexOf('a') >= 0) ? id + 'b' : id + 'a'; var anotherTab2 = (indx.indexOf('c') >= 0) ? id + 'b' : id + 'c'; var anotherTab3 = (indx.indexOf('d') >= 0) ? id + 'b' : id + 'd'; document.getElementById(teamId+'tab_' + indx).className = 'selected'; document.getElementById(teamId + 'tab_' + anotherTab).className = ''; document.getElementById(teamId + 'tab_' + anotherTab2).className = ''; document.getElementById(teamId + 'tab_' + anotherTab3).className = ''; if (indx==id+'a') { show (teamId+'basketballInfo_'+id); hide(teamId + 'soccerInfo_' + id); hide(teamId + 'footballInfo_' + id); hide(teamId + 'baseballInfo_' + id); } else if(indx==id+'b') { hide(teamId + 'basketballInfo_' + id); show(teamId + 'soccerInfo_' + id); hide(teamId + 'footballInfo_' + id); hide(teamId + 'baseballInfo_' + id); } else if(indx==id+'c') { hide(teamId + 'basketballInfo_' + id); hide(teamId + 'soccerInfo_' + id); hide(teamId + 'baseballInfo_' + id); show(teamId + 'footballInfo_' + id); } else { hide(teamId + 'basketballInfo_' + id); hide(teamId + 'soccerInfo_' + id); hide(teamId + 'footballInfo_' + id); show(teamId + 'baseballInfo_' + id); } } I am trying to turn one tab on and have the others turned off until another tab is clicked on. It works fine if I have all 4 conditions but I need to be able to also have 3, 2, and 1. What would be an easy way to do so? Hi everyone, Would any of you know a cross-platform way to validate XML against XSD in JavaScript? All examples found online use MSXML, which is only available under Windows/IE. Using remote web-services is not a option, since the script should be able to run online. Cheers, Vit Code: <img class="border" alt="googtatic_map" src="http://maps.google.com/maps/api/staticmap?center=51.454863,0.011673&zoom=13&markers=United+Reformed+Church,+111+Burnt+Ash+Road,++Lee,+London+SE12+8RG,+UK&size=250x250&sensor=true" /> I have the above code and it is not validating with the w3c validation for XHTML it has thrown up 8 errors and 14 warnings. Should I ignore them or what? As I do like my code to validate. Hi im not good with javavscript so got some code off the net to do some rollovers, however it doesnt validate. can anyone please help me as to why this maybe? Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> <link rel="stylesheet" type="text/css" href="joho.css" /> <SCRIPT TYPE="text/javascript"> <!-- // copyright 1999 Idocs, Inc. http://www.idocs.com/tags/ // Distribute this script freely, but please keep this // notice with the code. var rollOverArr=new Array(); function setrollover(OverImgSrc,pageImageName) { if (! document.images)return; if (pageImageName == null) pageImageName = document.images[document.images.length-1].name; rollOverArr[pageImageName]=new Object; rollOverArr[pageImageName].overImg = new Image; rollOverArr[pageImageName].overImg.src=OverImgSrc; } function rollover(pageImageName) { if (! document.images)return; if (! rollOverArr[pageImageName])return; if (! rollOverArr[pageImageName].outImg) { rollOverArr[pageImageName].outImg = new Image; rollOverArr[pageImageName].outImg.src = document.images[pageImageName].src; } document.images[pageImageName].src=rollOverArr[pageImageName].overImg.src; } function rollout(pageImageName) { if (! document.images)return; if (! rollOverArr[pageImageName])return; document.images[pageImageName].src=rollOverArr[pageImageName].outImg.src; } //--> </head> <body> <div id="wrapper"> <div id="contentwrapper"> <div id="col1"> <ul> <li><A HREF="home.html" onMouseOver = "rollover('home')" onMouseOut = "rollout('home')" ><img src="menu/row1sq1_home_OP.png" border="0" alt="Home" NAME="home"/></a><SCRIPT TYPE="text/javascript"> <!-- setrollover("rollovers/row1sq1_home_RO.png"); //--> </SCRIPT></li> <li><img src="menu/row2sq1_OP.png" alt="2"/></li> <li><A HREF="illustrations.html" onMouseOver = "rollover('illustrations')" onMouseOut = "rollout('illustrations')" ><img src="menu/row3sq1_illustrations_OP.png" border="0" alt="illustrations" NAME="illustrations"/></a><SCRIPT TYPE="text/javascript"> <!-- setrollover("rollovers/row3sq1_illustrations_RO.png"); //--> </SCRIPT></li> <li><img src="menu/row4sq1_OP.png" alt="4"/></li> </ul> </div> <div id="col2"> <ul> <li><img src="menu/row1sq2_OP.png" alt="1"/></li> <li><img src="menu/row2sq2_OP.png" alt="2"/></li> <li><img src="menu/row3sq2_OP.png" alt="3"/></li> <li><A HREF="portraits.html" onMouseOver = "rollover('portraits')" onMouseOut = "rollout('portraits')" ><img src="menu/row4sq2_portraits_OP.png" border="0" alt="portraits" NAME="portraits"/></a><SCRIPT TYPE="text/javascript"> <!-- setrollover("rollovers/row4sq2_portraits_RO.png"); //--> </SCRIPT></li> </ul> </div> <div id="col3"> <ul> <li><A HREF="about.html" onMouseOver = "rollover('about')" onMouseOut = "rollout('about')" ><img src="menu/row1sq3_about_OP.png" border="0" alt="About" NAME="about"/></a><SCRIPT TYPE="text/javascript"> <!-- setrollover("rollovers/row1sq3_about_RO.png"); //--> </SCRIPT></li> <li><A HREF="cards.html" onMouseOver = "rollover('cards')" onMouseOut = "rollout('cards')" ><img src="menu/row2sq3_cards_OP.png" border="0" alt="cards" NAME="cards"/></a><SCRIPT TYPE="text/javascript"> <!-- setrollover("rollovers/row2sq3_cards_RO.png"); //--> </SCRIPT></li> <li><img src="menu/row3sq3_squeak_OP.png" border="0" alt="1"/></li> <li><A HREF="contact.html" onMouseOver = "rollover('contact')" onMouseOut = "rollout('contact')" ><img src="menu/row4sq3_contact_OP.png" border="0" alt="contact" NAME="contact"/></a><SCRIPT TYPE="text/javascript"> <!-- setrollover("rollovers/row4sq3_contact_RO.png"); //--> </SCRIPT></li> </ul> </div> <div id="col4"> <ul> <li><img src="menu/row1sq4_OP.png" alt="1"/></li> <li><img src="menu/row2sq4_OP.png" alt="2"/></li> <li><A HREF="weddings.html" onMouseOver = "rollover('weddings')" onMouseOut = "rollout('weddings')" ><img src="menu/row3sq4_wedding_OP.png" border="0" alt="weddings" NAME="weddings"/></a><SCRIPT TYPE="text/javascript"> <!-- setrollover("rollovers/row3sq4_wedding_RO.png"); //--> </SCRIPT></li> <li><img src="menu/row4sq4_OP.png" alt="4"/></li> </ul> </div> </div> </div> </body> </html> thank Q C Hi Folks I am trying to write a js that validates a form with two text inputs. The two inputs a 'D_techA' and 'D_techB'. I just want to add up (sum) the two input fields (which must be positive numbers) and make sure that they add up to exactly 100 (not more and not less). If they do not add up to 100, then an alert should pop up that says "The two values must add up to exactly 100." I have tried and tried to write a js that does this validation (looking at numerous validation scripts posted in this forum and elsewhere) and I just cannot seem to make it work. I would very much appreciate any suggestions! Thanks! The html code for my very simple form is: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Untitled Document</title> </head> <body> <form id="form1" name="form1" method="post" action=""> <label>Investment in Tech A <input name="D_techA" type="text" id="D_techA" /> </label> <label>Investment in Tech B <input name="D_techB" type="text" id="D_techB" /> </label> <p> <input name="Submit" type="submit"/> </p> </form> </body> </html> Hi Guys, I use this code to validate e-mail addresses: PHP Code: // checks if the e-mail address is valid var emailPat = /^(".*\"|[A-Za-z]\w*)@(\[\d{1,3}(\.\d{1,3}){3}]|[A-Za-z]\w*(\.[A-Za-z]\w*)+)$/; var matchArray = formSignup.txtEmail.value.match(emailPat); if (matchArray == null) { alert("Your email address seems incorrect. Please try again (check the '@' and '.'s in the e-mail address)"); return false; } What i noticed today, is if a customer registers with an e-mail like: something.something@hotmail.com the first dot throws up the error, i'm not to great on regex lol any help would be appreciated thanks guys Graham Hi guys! I have tried numerous attempts in getting the Address field to work (i.e. validated). I want it to accept letters, numbers, spaces and commas! However, it won't let me! Below is the code I have provided. Code: function validateAddress(fld) { var error = ""; var illegalChars = /[\W_]/; // } else if (illegalChars.test(fld.value)) { fld.style.background = 'Yellow'; error = "Your Billing address contains illegal characters!\n"; } else { fld.style.background = 'White'; } return error; } Thanks a lot! hi i need a help in java script. i have some text fields and when i enter the information in it and enter the validation button i need the results to be displayed in a box below these btns. Is it possible in Java script? Please see the attached image for some ideas. cheers I managed to create the form that asks you to type in the information but I'm having some difficulty trying to figure out the alert to say "Thank you " after you have everything filled in and then hitting the button. my code is Code: <HTML> <HEAD> <TITLE> Form Validation Example </TITLE> <SCRIPT LANGUAGE="JavaScript"> function validatePersonalInfo(){ var _first = document.info.fname.value; var _city = document.info.city.value; var _phone = document.info.phone.value; if(_first.toString() == ""){alert("Please enter a first name.");} if(_city.toString() == ""){alert("Please enter your city.");} if(_phone.toString() == ""){alert("Please enter your phone number.");} var phoneInput = document.info.phone.value; var validPhone = false; var validCity = false; if(checkCity == true){ validCity = true; } else{ if(!checkPhone(phoneInput)){ alert("Phone number is invalid." + validPhone); } else{ validPhone = true; } if(validCity && validPhone){ alert("Your form has been verified"); } } } function checkPhone(str){ var regexp = /^(\d{10}|\d{3}-\d{3}-\d{4}|\(\d{3}\)\d{3}-\d{4})$/; return regexp.test(str); } function checkNum(length){ var cityLet = parseInt(cityEntry, 10); if (document.info.city.value.length == length){ if(cityLet != 0 && isNaN(cityLet) == false){ return true; } else { return false; } } else { return false; } } </script> </head> <body> <p> <form name="info" action="" method="post"> <table> <tr><td align="left">First Name:</td> <td align="left"> <input type="text" name="fname" size=15> </td> </tr> <br> </tr> <br> <tr> <td align="left">City:</td> <td align="left"> <input type="text" name="city" size=15> </td> </tr> <br> <tr><td align="left">phone</td> <td align="left"> <input type="text" name="phone" size=20></td> </tr> <br> </tr> <br> </table> <center> <input type="button" value="Submit" onClick="validatePersonalInfo()"> </center> </form> </body> </html> the help is greatly appreciated Hello all, I am pretty new to javascript and could use some help. I am validating a page (image attached) to make sure that total hours entered do not exceed the allocated amount, which is stored in the database. I have already validated to make sure that they enter a number and that it is not greater than 8. Could some one help me with the rest? thanks so much, Joe Code: var returncode = true var inputs = document.getElementsByTagName("INPUT") for(var x=0; x<inputs.length; x++) { if(inputs[x].type =='text' && isNaN(inputs[x].value)) { document.getElementById("hourserror").style.display = "block"; inputs[x].style.backgroundColor = '#FFCCCC'; returncode = false; } if(inputs[x].value > 8) { document.getElementById("totalerror").style.display = "block"; inputs[x].style.backgroundColor = '#FFCCCC'; returncode = false; } } return returncode; Here's what I have so far in my validation part. However, I need help as to how to validate the following fields when the user clicks the submit button. -Radio Button *title (4 options) *member (3 options) *vegetarian (2 options) -Drop down lists *regstartdate (3 options) *regenddate (3 options) *confdinner (2 options) *paymethod (3 options) -UK Post Code (text box with maxlength=8) My current code shows 1 popup with all the error messages. Here's what I have so far: Redacted |