JavaScript - Clearing Form Field
I need to learn how to clear form fields when a user clicks on them.
Here is the site in question: http://www.yourvancouvermortgagebroker.ca/apply They used to work, but then I changed the field value and now it doesn't work on some of the fields (whichever ones I changed). Here is a link to the .js file: http://www.yourvancouvermortgagebroker.ca/js/apply.js Similar TutorialsHey guys, First shot at JS so please be gentle! I'm trying to get this script to clear the default value of my input elements on focus. It works well the first time, however, if a user inputs some fresh text, selects something else, then selects the same input element again, it will clear the text they entered. Make sense? Here's the script (thanks in advance!!): Code: <script language="JavaScript"> function clickFocus(input){ input.className = 'focus'; if (input.value = input.defaultValue){ input.value = ''; } } function unFocus(input){ input.className = 'entered'; if (input.value == ''){ input.value = input.defaultValue; input.className = 'normal' } } </script> <form action="confirmation.php" method="post" enctype="multipart/form-data" name="form" id="form" onsubmit="return checkForm(this)"> <input type="text" name="name" value="Name" onfocus="clickFocus(this)" onblur="unFocus(this)" /> <input type="text" name="email" value="Email" onfocus="clickFocus(this)" onblur="unFocus(this)" /> <input type="text" name="subject" value="Subject" onfocus="clickFocus(this)" onblur="unFocus(this)" /> <textarea type="text" name="message" onfocus="clickFocus(this)" onblur="unFocus(this)" rows="5">Message</textarea> <input class="submit" name="submit"type="submit" value="Send Message" /> </form> I type something on the current textarea/input and all the values get removed after I add another field. Is there a solution? Code: <script language="Javascript" type="text/javascript"> <!-- //Add more fields dynamically. function addField(area,field,limit) { if(!document.getElementById) return; //Prevent older browsers from getting any further. var field_area = document.getElementById(area); var all_inputs = field_area.getElementsByTagName("input"); //Get all the input fields in the given area. //Find the count of the last element of the list. It will be in the format '<field><number>'. If the // field given in the argument is 'friend_' the last id will be 'friend_4'. var last_item = all_inputs.length - 1; var last = all_inputs[last_item].id; var count = Number(last.split("_")[1]) + 1; //If the maximum number of elements have been reached, exit the function. // If the given limit is lower than 0, infinite number of fields can be created. if(count > limit && limit > 0) return; //Older Method field_area.innerHTML += "<li><textarea id='steps' name='steps[]' rows='5' cols='40'></textarea><br /><input id='steps_image' name='steps_image[]' /></li>"; } //--> </script> <ol id="steps_area"><li> <textarea id='steps' name='steps[]' rows='5' cols='40'></textarea><br /><input id='steps_image' name='steps_image[]' /> </li> </ol> <input type="button" value="Add" onclick="addField('steps_area','',15);"/> I'm sort of new at JS and trying to have an option to clear the fields by pressing the clear fields button, but nothing happens. This should be correct but for some odd reason it's not.. In addition, I have to edit my fuction doSubmit so once submitted an alert box with all the information is in it.. Does that make sense So the alert should be: John Does 462 Smith St Johnston, NC 44524 Email@com 214-854-6555 Etc Code: <script> function doClear() { document.PizzaForm.customer.value = ""; document.PizzaForm.address.value = ""; document.PizzaForm.city.value = ""; document.PizzaForm.state.value = ""; document.PizzaForm.zip.value = ""; document.PizzaForm.phone.value = ""; document.PizzaForm.email.value = ""; document.PizzaForm.sizes[0].checked = false; document.PizzaForm.sizes[1].checked = false; document.PizzaForm.sizes[2].checked = false; document.PizzaForm.sizes[3].checked = false; document.PizzaForm.toppings[0].checked = false; document.PizzaForm.toppings[1].checked = false; document.PizzaForm.toppings[2].checked = false; document.PizzaForm.toppings[3].checked = false; document.PizzaForm.toppings[4].checked = false; document.PizzaForm.toppings[5].checked = false; document.PizzaForm.toppings[6].checked = false; document.PizzaForm.toppings[7].checked = false; return; } function doSubmit() { alert("Your pizza order has been submitted."); return; } </script> </head> <body> <form name="PizzaForm"> <h1>Pizza Parlor</h1> <p> <h4>Step 1: Enter your name, address, phone number, and email address:</h4> <font face="Courier New"> Name: <input name=:customer" size="50" type="text"><br> Address: <input name="address" size="50" type="text"><br> City: <input name="city" size="15" type="text"> State: <input name="state" size="2" type="TEXT"> Zip: <input name="zip" size="5" type="text"><br> Phone: <input name="phone" size="50" type="text"><br> Email: <input name="email" size="50" type="text"><br> </font> </p> <p> <h4>Step 2: Select the size of pizza you want:</h4> <font face="Courier New"> <input name="sizes" type="radio">Small <input name="sizes" type="radio">Medium <input name="sizes" type="radio">Large <input name="sizes" type="radio">Jumbo<br> </font> </p> <p> <h4>Step 3: Select the pizza toppings you want:</h4> <font face="Courier New"> <input name="toppings" type="checkbox">Pepperoni <input name="toppings" type="checkbox">Canadanian Bacon <input name="toppings" type="checkbox">Sausage<br> <input name="toppings" type="checkbox">Mushrooms <input name="toppings" type="checkbox">Pineapple <input name="toppings" type="checkbox">Black Olives<br> <input name="toppings" type="checkbox">Extra Cheese <input name="toppings" type="checkbox">Green Peppers<br> </font> </p> <input type="button" value="Submit Order" onClick="doSubmit()"> <input type="button" value="Clear Entries" onClick="doClear()"> </form> </body> okay. clearing a form. I have a clear button. when I push it, I want all the red text boxes and onblur messages to disappear. anyone have an idea on where i can start? heres javascript Code: function isFormValid() { var userF = document.getElementById('FName').value; var userL = document.getElementById('LName').value; var userPW = document.getElementById('pw').value; var userPW2 = document.getElementById('pw2').value; var userBDay = document.getElementById('BDay').value; var userEmail = document.getElementById('email').value; var NameFormat = /^[A-Za-z]{2,12}$/; var PWFormat = /^[A-Za-z0-9]{6,12}$]/; var BDayFormat = /^(\d{1,2})[\s\.\/-](\d{1,2})[\s\.\/-](\d{4})$/; var EmailFormat = /^([\w-]{2,})@([A-z\d][-A-z\d]+)\.[A-z]{2,8}/; var retVal = true; var errorMsg = ""; if (!NameFormat.test(userF)) { assignErrorClass("FName"); errorMsg = "First Name is required. 2-12 letters only\n"; retVal = false; } if (!NameFormat.test(userL)) { assignErrorClass("LName"); errorMsg = errorMsg + "Last Name is required. 2-12 letters only\n"; retVal = false; } if (!PWFormat.test(userPW)) { assignErrorClass("pw"); errorMsg = errorMsg + "Password is required. 6-12 letters or numbers only.\n"; retVal = false; } if (userPW2 == "") { assignErrorClass("pw2"); errorMsg = errorMsg + "Please Retype password.\n"; retVal = false; } if ((userPW != userPW2) && (userPW2 !== "")) { assignErrorClass("pw2"); errorMsg = errorMsg + "Passwords do not match.\n"; retVal = false; } if (userBDay == "") { assignErrorClass("BDay"); errorMsg = errorMsg + "Please Enter a Birthday.\n"; retVal = false; } if ((!BDayFormat.test(userBDay)) && (userBDay !== "")) { assignErrorClass("BDay"); errorMsg = errorMsg + "Incorrect Birthday format\n"; retVal = false; } if (badBirthday("BDay") && (userBDay !== "")) { assignErrorClass("BDay"); retVal = false; errorMsg = errorMsg + "Invalid Birthday\n"; } if (userEmail == "") { assignErrorClass("email"); errorMsg = errorMsg + "Please Enter an Email address.\n"; retVal = false; } if ((!EmailFormat.test(userEmail)) && (userEmail !== "")) { assignErrorClass("email"); errorMsg = errorMsg + "Please Enter a valid Email address.\n"; retVal = false; } if (!retVal) { alert( errorMsg); } return retVal; } function assignErrorClass(objName) { var obj = document.getElementById(objName); obj.className = "err"; } function badBirthday( objName) { var obj = document.getElementById(objName); var dateStr = obj.value; var mn = dateStr.split("/")[0]; var dy = dateStr.split("/")[1]; var yr = dateStr.split("/")[2]; var dateObj = new Date(yr,mn-1,dy); //JavaScript and PHP number the months 0 to 11. if (dateObj.getFullYear() != yr || dateObj.getMonth()+1 != mn || dateObj.getDate() != dy) { return true; } else { return false; } } function checkFName() { var userF = document.getElementById('FName').value; var elementF = document.getElementById('labelFName'); var NameFormat = /^[A-Za-z]{2,12}$/; if (!NameFormat.test(userF)) { elementF.innerHTML = "First Name is required. 2-12 letters only"; elementF.style.color = "red"; } else { elementF.innerHTML = ""; elementF.style.color = "green"; } } function checkLName() { var userL = document.getElementById('LName').value; var elementL = document.getElementById('labelLName'); var NameFormat = /^[A-Za-z]{2,12}$/; if (!NameFormat.test(userL)) { elementL.innerHTML = "Last Name is required. 2-12 letters only"; elementL.style.color = "red"; } else { elementL.innerHTML = ""; elementL.style.color = "green"; } } function checkpw() { var userPW = document.getElementById('pw').value; var elementPW = document.getElementById('labelpw'); var PWFormat = /^[A-z0-9]{6,12}$/; if (!PWFormat.test(userPW)) { elementPW.innerHTML = "Password is required. 6-12 letters or numbers only."; elementPW.style.color = "red"; } else { elementPW.innerHTML = "Good Password"; elementPW.style.color = "green"; } } function checkpw2() { var userPW2 = document.getElementById('pw2').value; var userPW = document.getElementById('pw').value; var elementPW2 = document.getElementById('labelpw2'); if ((userPW != userPW2) && (userPW2 !== "")) { elementPW2.innerHTML = "Passwords do not match."; elementPW2.style.color = "red"; } else if (userPW2 == "") { elementPW2.innerHTML = "Please Retype password."; elementPW2.style.color = "red"; } else { elementPW2.innerHTML = "Passwords Match"; elementPW2.style.color = "green"; } } function checkBDay() { var userBDay = document.getElementById('BDay').value; var elementBDay = document.getElementById('labelBDay'); var BDayFormat = /^(\d{1,2})[\s\.\/-](\d{1,2})[\s\.\/-](\d{4})$/; if (userBDay == "") { elementBDay.innerHTML = "Please enter A Birthday."; elementBDay.style.color = "red"; } else if ((!BDayFormat.test(userBDay)) && (userBDay !== "")) { elementBDay.innerHTML = "Please enter mm/dd/yyyy format."; elementBDay.style.color = "red"; } else if ((badBirthday("BDay")) && (userBDay !== "")) { elementBDay.innerHTML = "Please enter valid Birthday."; elementBDay.style.color = "red"; } else { elementBDay.innerHTML = ""; elementBDay.style.color = "green"; } } function checkEmail() { var userEmail = document.getElementById('email').value; var elementEmail = document.getElementById('labelEmail'); var EmailFormat = /^([\w-]{2,})@([A-z\d][-A-z\d]+)\.[A-z]{2,8}/; if ((!EmailFormat.test(userEmail)) && (userEmail !== "")) { elementEmail.innerHTML = "Please enter a Valid Email address."; elementEmail.style.color = "red"; } else if (userEmail == "") { elementEmail.innerHTML = "Please enter an Email address."; elementEmail.style.color = "red"; } else { elementEmail.innerHTML = ""; elementEmail.style.color = "green"; } } heres the html Code: <form action="mailto:hummdedum@felloff.com" method="post" name="form" onSubmit="return isFormValid();"> * First Name: <input type="text" name="FName" id="FName" onblur="checkFName();"/><label id="labelFName"></label><br /> * Last Name: <input type="text" name="LName" id="LName"onblur="checkLName();"/><label id="labelLName"></label><br /> * Password: <input type="password" id="pw" name="Password" onblur="checkpw();"/><label id="labelpw"></label><br /> *Re-type Password: <input type="password" name="2Password" id="pw2" onblur="checkpw2();" /><label id="labelpw2"></label><br /> I am a: <br /> <input type="radio" name="status" value="fresh" /> Freshman<br /> <input type="radio" name="status" value="soph" /> Sophomore<br /> <input type="radio" name="status" value="jr" /> Junior<br /> <input type="radio" name="status" value="sr" /> Senior<br /> I am taking classes in the: <br /> <input type="checkbox" name="semester" value="fall" /> fall time<br /> <input type="checkbox" name="semester" value="spring" /> Spring time <br /> My favorite element is: <select name="element" id="element"> <option value="">select</option> <option value="fire">Fire</option> <option value="earth">Earth</option> <option value="water">Water</option> <option value="air">Air</option> </select><br /> *Birthday: mm/dd/yyyy<input type="text" id="BDay" name="Birthday" onblur="checkBDay();"/><label id="labelBDay"></label><br /> *E-Mail: <input type="text" id="email" name="Email" onblur="checkEmail();"/><label id="labelEmail"></label><br /> <input type="submit" value="Submit" /> <input type="reset" value="Clear" /> </form> css i guess would be Code: .err { border: 2px solid #FF0000;} #errMsg { font-size: 110%; color: #FF0000;} super thanks!!!!!! -pumpkin I have a page with a form on it and a button that opens a new window for them to verify the data. What happens is that when the window opens, the form gets cleared out. This is with FireFox (IE has issues too!) Now this code has actually work fine for several years, now all of a sudden it's an issue. Possibly browser update issues? Here's a VERY stripped down version that shows the problem: Code: <HTML> <HEAD> <TITLE>Test</TITLE> <script language="JavaScript" type="text/javascript"> function Proc_Reg(frm) { window.open("","","status=1,menubar=1,resizable=1,scrollbars=1,width=900,height=800"); } </script> </HEAD> <BODY> test <form name=RegForm > <TABLE> <TR><TD><font color = "RED">PLEASE MAKE SURE YOUR BROWSER'S SECURITY SETTINGS ALLOW SCRIPTS TO RUN.</font></TD></TR></TABLE> <BR><BR> <font size=7>BCU Festival Registration</font><BR><center>Event Date: September 11, 2011</center> <HR> <table> <tbody> <tr><td><FONT FACE="BRITANNIC BOLD" size=4> Name:</font></td><td> <input title="What is Your Name?" name="FullName" rows="1" size="45" type="text"> </td></tr> </tbody></table> </form> <A HREF="" OnClick="javascript:Proc_Reg(RegForm);">Click</A> </BODY> </HTML> Ideas??? Hello all. Complete newbie to this and to be quite honest, completely out of my depth. Ok, I have the following set up on my page - the page essentially uses three different search methods to bring back data in a gridview. 1. A cascading drop down list (ddlBuyer, ddlSub, ddlProd) and an associated radio button radBuyer. 2. An autocomplete textbox (tbxProdAC) that sources product information and an associated radio button (radProd) 3. A text box whereby users specify the number of products they wish to see and (txtHowMany) a subsequent sub category radio button list that breaks the products down further (radTopx) What I would like to do is essentially make the page so that a user can only user one of the above methods and the radio is focused according to what the user first specifies. For example, if they wish to use the ddl method, they should click ddlBuyer, ddlSub and ddlProd and the focus is placed upon the radBuyer. Along side of this, any information that may have been entered into tbxProdAC or txtHowMany is cleared. Alternatviely, should a user use the drop down method then wish to use the third method specified above, once a user clicks in txtHowMany, the ddl should revert back to their original values. I would like to achieve this in the c# code behind and I currently have the following code on my page load event/ I have got to the point where I am going round in circles (mainly because I don't know what I am doing!) so I would appreciate a few pointers. Code: ddlProd.Attributes.Add("onchange", "return SetRadioFocus('" + radBuyer.ClientID + "');"); radTopx.Attributes.Add("onclick", "return SetRadioFocus('" + radTopx.SelectedItem + "');"); tbxProdAC.Attributes.Add("onclick", "return SetRadioFocus('" + radProd.ClientID + "');"); ClientScript.RegisterClientScriptBlock(this.GetType(), "MyScript", @" function SetRadioFocus(target) { document.getElementById(target).checked = true; }" , true); If someone can help me, I would be extremely grateful and it would save me from smashing my head further into my desk. Please excuse my ignorance, brand spanking new to this and feeling more than a little thick. I've set up a mock registration form page so I can learn a bit about javascript's form validation. (newbie) I want to try to attempt to style the border of a form field green when the user enters the correct info into the form text field and red on all other fields if the user doesnt enter any info into them. When i test it, enter the right info into the username field, leave the others blank, and hit the submit button it styles the username field green ok but it doesnt make the next fields (password and so on) red. Could someone please explain what I am doing wrong? here is my code so far... Note: just for testing purposes I've put return false on everything so it displays a message when everythings ok. Code: .... <script type="text/javascript"> window.onload = function() { document.forms[0].username.focus(); } function validate(form) { var form = document.getElementById("reg"); var e = document.getElementById("error"); e.style.background = "red"; for(var i = 0; i < form.elements.length; i++) { var el = form.elements[i]; if(el.type == "text" || el.type == "password") { if(el.value == "") { e.innerHTML = "Please fill in all fields!"; el.style.border = "1px solid red"; el.focus(); return false; } else { el.style.border = "1px solid green"; return false; } } } var un = form.username; un.value = un.value.replace(/^\s+|\s+$/g,""); if((un.value.length < 3)|| (/[^a-z0-9\_]/gi.test(un.value))) { e.innerHTML = "Only letters,numbers and the underscore are allowed (no spaces) - 3-16 characters"; un.focus(); return false; } var pw = form.password; pw.value = pw.value.replace(/^\s+|\s+$/g,""); if((pw.value.length < 3) || (/[^a-z0-9]/gi.test(pw.value))) { e.innerHTML = "Only letters and numbers are allowed (no spaces) - 3-16 characters"; pw.focus(); return false; } e.innerHTML = "You filled in all the fields, well done!"; e.style.background = "green"; return false; } </script> </head> <body> <div id="wrapper"> <div id="header"> <h1>My Cool Website</h1> </div> <div id="content"> <div class="padding"> <h2>Registration</h2> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ligula lorem, consequat eget, tristique nec, auctor quis, purus. Vivamus ut sem. Fusce aliquam nunc vitae purus. Aenean viverra malesuada libero. Fusce ac quam. Donec neque. Nunc venenatis enim nec quam. Cras faucibus, justo vel accumsan aliquam, tellus dui fringilla quam, in condimentum augue lorem non tellus. Pellentesque id arcu non sem placerat iaculis. Curabitur posuere, pede vitae lacinia accumsan, enim nibh elementum orci, ut volutpat eros sapien nec sapien. Suspendisse neque arcu, ultrices commodo, pellentesque sit amet, ultricies ut, ipsum. Mauris et eros eget erat dapibus mollis. Mauris laoreet posuere odio. Nam ipsum ligula, ullamcorper eu, fringilla at, lacinia ut, augue. Nullam nunc.</p> <form id="reg" action="#" method="post" onsubmit="return validate(this)"> <div id="error"></div> <div><label for="username">Username</label></div> <div><input type="text" name="username" id="username" size="30" maxlength="16" /></div> <div><label for="password">Password</label></div> <div><input type="password" name="password" id="password" size="30" maxlength="16" /></div> <div><label for="c_password">Confirm Password</label></div> <div><input type="password" name="c_password" id="c_password" size="30" maxlength="16" /></div> <div><label for="email">Email address</label></div> <div><input type="text" name="email" id="email" size="30" maxlength="200" /></div> <div><label for="c_email">Confirm Email address</label></div> <div><input type="text" name="c_email" id="c_email" size="30" maxlength="200" /></div> <div><label for="firstname">First name</label></div> <div><input type="text" name="firstname" id="firstname" size="30" maxlength="100" /></div> <div><label for="surname">Surname</label></div> <div><input type="text" name="surname" id="surname" size="30" maxlength="100" /></div> <div><label for="gender">Gender</label></div> <div> <div><input type="radio" name="gender" id="gender" value="m" checked="checked" />Male</div> <div><input type="radio" name="gender" value="f" />Female</div> </div> <div><input type="submit" value="Register" name="submit" /></div> </form> </div> </div> <div id="footer"> <p>Copyright © 2009 My Cool Website</p> </div> </div> </body> </html> How can I add a form field value to a url. I tried the below but it no work. Code: href="index2.php?q=4&id=+document.theForm.lists.value+&picklist" I have a form which has various fields which are arrays (so the name of a field may be myField[]). The reason for this is that the form has add buttons to add another field or fields for the purpose of entering another email address, etc., to send invitations and do other things. The problem that I am running into is how to access the individual fields in an array of fields inside javascript to do form validation. So if I have an email address field name emailAddress[], and using the add button, the user of my site adds 3 other copies of the emailAddress[] field, I want to then do form validation onSubmit to ensure those email address are valid using standard procedures. However, inside the javascript code, how do I access the individual fields that make up emailAddress[]? I just cannot find anywhere online the proper way to get at these values. If anyone can help me, I would greatly appreciate it. Happy Holidays Hi there, I have a html form, and I need it so that when a user clicks a button, it adds a field into the form. I also need it to write <td></td> around the new field, and I need it to write this in a specific part row of a table. How would I go about doing this? I've tried searching for the past two hours, but no luck. Many thanks, I appreciate it, Jason Hi! I use the :: Form field Progress Bar from DynamicDrive: Form field Progress Bar Now I trided to change the text when the textarea is full "Limit:100%" to "Your max. characters is reached" I trided it but with no luck. This is the main code.. Code: <script type="text/JavaScript"> function textCounter1(field,counter,maxlimit,linecounter) { // text width// var fieldWidth = 137; var charcnt = field.value.length; // trim the extra text if (charcnt > maxlimit) { field.value = field.value.substring(0, maxlimit); } else { // progress bar percentage var percentage = parseInt(100 - (( maxlimit - charcnt) * 100)/maxlimit) ; document.getElementById(counter).style.width = parseInt((fieldWidth*percentage)/100)+"px"; document.getElementById(counter).innerHTML="Limiet: "+percentage+"%" // color correction on style from CCFFF -> CC0000 setcolor(document.getElementById(counter),percentage,"background-color"); } } function setcolor(obj,percentage,prop){ obj.style[prop] = "rgb(80%,"+(100-percentage)+"%,"+(100-percentage)+"%)"; } </script> This is the place where the text is set. Code: ((fieldWidth*percentage)/100)+"px"; document.getElementById(counter).innerHTML="Limiet: "+percentage+"%" Help would be highly appreciated ! greetings Jardin Is there a way to give an input or textarea field the focus and set the focus to begin right at the end of the current text in the field?
function checkValidFormInput() { if (document.getElementsByName('customerName').value != '') { document.getElementById('customerNameImg').innerHTML = '<img alt="Valid" src="images/greenTick.png">'; } else { document.getElementById('customerNameImg').innerHTML = '<img alt="Invalid" src="images/redX.png">'; } if (document.getElementsByName('customerEmail').length > 0) { document.getElementById('customerEmailImg').innerHTML = '<img alt="Valid" src="images/greenTick.png">'; } else { document.getElementById('customerEmailImg').innerHTML = '<img alt="Invalid" src="images/redX.png">'; } } I need when I click to type into a form field, I need an onclick event to show another form field. I would assume this would be a hiddin div or an on click event to post another form field. So in theory just because I actually clicked into one form field...another form field shows up underneath it...can anyone help... Hi guys, This has been asked before, and i've seen many of the previous posts. And tried for hours. But finally i've broken and have to ask for help. What am I doing wrong here? Can someone please explain? Code: var u=document.forms["lead"]["name"].value; var v=document.forms["lead"]["city"].value; var x=document.forms["lead"]["country"].value; var y=document.forms["lead"]["mobile"].value; var z=document.forms["lead"]["email"].value; if (u==null || u=="") { alert("Please enter your first name."); return false; } if (v==null || v=="") { alert("Please enter your city."); return false; } if (isNaN(lead.y.value)) { alert("bloody work!"); return false; } if (x=="Argentina" && y.length < 11) { alert("Please enter a valid Argentinian phone number."); return false; } Thanks in advance. I have some code that uses a form, and will check it and show an image. If you have/know a script that is simple, let me know! Otherwise, I'm wondering if someone who is proficient in JS/HTML could help me with this task. It's all coded, I just need some help with an error I am getting. Thanks, Blockis Hello, I have several event handlers on my page; one of them doesn't work. I'll post them all here, indicating how they are executed: #1: Works [CODE]<script type="text/javascript"> function combName() { var fname = document.forms[0].fname.value; var lname = document.forms[0].lname.value; document.forms[0].name.value = fname + " " + lname; } </script>[CODE] NOTE: The "lname" field uses "onKeyUp" to make the script run. A hidden field named "name" is populated with the concatenation. #2: Works (this script is too long to post; it is a validation script and runs via the "onSubmit" in the form tag.) #3: Doesn't Work [CODE]<script type="text/javascript"> function combPrograms() { document.forms[0].00N70000002WNax.value = "1st Choice: " + document.forms[0].sf1.value + document.forms[0].alameda1.value + document.forms[0].sanmateo1.value + document.forms[0].marin.value + document.forms[0].cc1.value + "2nd Choice: " + document.forms[0].sf2.value + document.forms[0].alameda2.value + document.forms[0].sanmateo2.value + document.forms[0].marin2.value + document.forms[0].cc2.value; } </script>[CODE] Note: 1. Not all of the values for Choice 1 and Choice 2 are populated. 2. For that reason, one of the later, unrelated text fields in the form has "onKeyUp="combPrograms()" to run the event. 3. A hidden field named 00N70000002WNax is populated with the concatenation. Any help is much appreciated! Hi everyone, im new to javascript and I have created two forms.. a value will be put in the first field and the second field should display either $20 or $35 depending on the value of the first field. Im doing something wrong here.. but I cant see what. Any help is appreciated. <!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 content="text/html; charset=utf-8" http-equiv="Content-Type" /> <title>Distance from Depot</title> </head> <body> <form id="distanceform"> <ul> <li> <label for="Distance from EverWarm Depot">Distance from Depot (km):</label> <input type="text" id="distance" class="large"/> </li> </ul> </form> <input name="Button1" type="button" value="calculate" onclick="deliverycost()"/> <form id="deliverycostform"> <ul> <li> <label for="Delivery Cost" >Delivery Cost:</label> <input type="text" id="deliverycost" class="large"/> </li> </ul> </form> <script> function deliverycost() { /* Here is the delivery cost: less than or equal to twenty kilometres is $20.00 greater than twenty kilometres is $35.00 */ var distance = document.forms["neworder"]["distance"].value; if(distance<20) { document.getElementById('deliverycost').innerHTML="$20"; } else { document.getElementById('deliverycost').innerHTML="$35"; } } </script> </body> </html> Using the url test.html?a=john&b=doe I am using the following code: <script type="text/javascript" language="javascript"> function getUrlVars() { var map = {}; var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi; function(m,key,value) { map[key] = value; }); return map; } var john=getUrlVars(map[a]); alert (getUrlVars(map[a])) alert (john) </script> I can't seem to get an alert to show me anything. The eventual result is not an alert, but a document.write to post the url contents to various form fields for firstname= and lastname= etc. I am really having a hard time using the document.write function, and am not sure how to employ it, whether in the same script statement or in a separate script in the body. |