JavaScript - Checkbox To Give Hidden Field Value
Hi, i have a page with lots of checkboxes and hidden fields. When i tick a checkbox i want it to give the hidden filed a value. But give it no value if it is not ticked. For every checkbox i have a hidden field is with it. Both the checkbox and the hidden field send information. I have used some js scripts but they don't seem to work with more than one checkbox. Please can you help.
Example: <input type="checkbox" name="box1" id="box1" value="4th July 2009,"> <input type="hidden" name="price1" id="price1" value="0"> So when box1 is ticked it then gives price1 a value. But if not ticked then the value remains at 0. I want it to give a value of 699. There will be about 100 checkboxes and hidden fields on the page. Also onclick behaviours do not work because it may still send the information if the checkbox is not checked. So for the next checkbox and hidden field i use box2 and price2. Thanks for your help. Similar TutorialsI have a form that has a checkbox that I want to base a hidden value on. If the checkbox is checked I want the hidden value to be 25. If not checked, I want the value to be 0. I am working with code someone else has written and I am fairly new to javascript and cannot get it to work. Here is the code on the form: <code> <td><input type="checkbox" name="binderdiscount" value="Yes" <?php /*?><?php if ($pgdata['binderdiscount']=='Yes') echo 'checked'; ?><?php */?> />I do not need a book;</td> <input type="hidden" name="binder_discount" value="0"> </code> and then in a separate page is all the javascript to process the form. I have this, but it is not working. <code> if(getControlValue(form.binderdiscount)==="Yes") {form.binder_discount.value=25;} </code> As I said, i am really new to javascript and I am working with someone else's code. All the research I have done has just confused me more about why it is not working. Any help would be greatly appreciated. I dont claim any of the JS below as my own. link to an example page http://www.clansngamers.com/add_new_game.php You see the PS3 checkbox is standard: Working, It brings up the hidden div. The Xbox checkbox is coded exactly the same except it uses the custom checkbox image and it dont work. This is my problem. have tried to code this and failed asking for any help i suck at JS. The Code Im trying to add Code: function showMe(id){ var obj = document.getElementById(id); if (obj.style.display == "none"){obj.style.display = "inherit";} else {obj.style.display = "none";} } The basic layout Code: <input class="styled" name="foo" type="checkbox" id="foo" value="1" onclick="showMe('div1')" /> <input class="styled" name="bar" type="checkbox" id="bar" value="1" onclick="showMe('div2')" /> <div id='div1' style="display:none;">hidden content 1</div> <div id='div2' style="display:none;">hidden content 2</div> Custom Checkbox code Code: var checkboxHeight = "14"; var radioHeight = "14"; var selectWidth = "190"; document.write('<style type="text/css">input.styled { display: none; } select.styled { position: relative; width: ' + selectWidth + 'px; opacity: 0; filter: alpha(opacity=0); z-index: 5; } .disabled { opacity: 0.5; filter: alpha(opacity=50); }</style>'); var Custom = { init: function() { var inputs = document.getElementsByTagName("input"), span = Array(), textnode, option, active; for(a = 0; a < inputs.length; a++) { if((inputs[a].type == "checkbox" || inputs[a].type == "radio") && inputs[a].className == "styled") { span[a] = document.createElement("span"); span[a].className = inputs[a].type; if(inputs[a].checked == true) { if(inputs[a].type == "checkbox") { position = "0 -" + (checkboxHeight*2) + "px"; span[a].style.top = position; } else { position = "0 -" + (radioHeight*2) + "px"; span[a].style.backgroundPosition = position; } } inputs[a].parentNode.insertBefore(span[a], inputs[a]); inputs[a].onchange = Custom.clear; if(!inputs[a].getAttribute("disabled")) { span[a].onmousedown = Custom.pushed; span[a].onmouseup = Custom.check; } else { span[a].className = span[a].className += " disabled"; } } } inputs = document.getElementsByTagName("select"); for(a = 0; a < inputs.length; a++) { if(inputs[a].className == "styled") { option = inputs[a].getElementsByTagName("option"); active = option[0].childNodes[0].nodeValue; textnode = document.createTextNode(active); for(b = 0; b < option.length; b++) { if(option[b].selected == true) { textnode = document.createTextNode(option[b].childNodes[0].nodeValue); } } span[a] = document.createElement("span"); span[a].className = "select"; span[a].id = "select" + inputs[a].name; span[a].appendChild(textnode); inputs[a].parentNode.insertBefore(span[a], inputs[a]); if(!inputs[a].getAttribute("disabled")) { inputs[a].onchange = Custom.choose; } else { inputs[a].previousSibling.className = inputs[a].previousSibling.className += " disabled"; } } } document.onmouseup = Custom.clear; }, pushed: function() { element = this.nextSibling; if(element.checked == true && element.type == "checkbox") { this.style.backgroundPosition = "0 -" + checkboxHeight*3 + "px"; } else if(element.checked == true && element.type == "radio") { this.style.backgroundPosition = "0 -" + radioHeight*3 + "px"; } else if(element.checked != true && element.type == "checkbox") { this.style.backgroundPosition = "0 -" + checkboxHeight + "px"; } else { this.style.backgroundPosition = "0 -" + radioHeight + "px"; } }, check: function() { element = this.nextSibling; if(element.checked == true && element.type == "checkbox") { this.style.backgroundPosition = "0 0"; element.checked = false; } else { if(element.type == "checkbox") { this.style.backgroundPosition = "0 -" + checkboxHeight*2 + "px"; } else { this.style.backgroundPosition = "0 -" + radioHeight*2 + "px"; group = this.nextSibling.name; inputs = document.getElementsByTagName("input"); for(a = 0; a < inputs.length; a++) { if(inputs[a].name == group && inputs[a] != this.nextSibling) { inputs[a].previousSibling.style.backgroundPosition = "0 0"; } } } element.checked = true; } }, clear: function() { inputs = document.getElementsByTagName("input"); for(var b = 0; b < inputs.length; b++) { if(inputs[b].type == "checkbox" && inputs[b].checked == true && inputs[b].className == "styled") { inputs[b].previousSibling.style.backgroundPosition = "0 -" + checkboxHeight*2 + "px"; } else if(inputs[b].type == "checkbox" && inputs[b].className == "styled") { inputs[b].previousSibling.style.backgroundPosition = "0 0"; } else if(inputs[b].type == "radio" && inputs[b].checked == true && inputs[b].className == "styled") { inputs[b].previousSibling.style.backgroundPosition = "0 -" + radioHeight*2 + "px"; } else if(inputs[b].type == "radio" && inputs[b].className == "styled") { inputs[b].previousSibling.style.backgroundPosition = "0 0"; } } }, choose: function() { option = this.getElementsByTagName("option"); for(d = 0; d < option.length; d++) { if(option[d].selected == true) { document.getElementById("select" + this.name).childNodes[0].nodeValue = option[d].childNodes[0].nodeValue; } } } } window.onload = Custom.init; ok so here is my situation i have 4 hidden fields in a form called "searchform" Code: <input type="hidden" name="forumchoice[]" value="1" checked /> <input type="hidden" name="forumchoice[]" value="2" checked /> <input type="hidden" name="forumchoice[]" value="3" checked /> <input type="hidden" name="forumchoice[]" value="4" checked /> Now here's what i want to do: i have two checkbox Code: <input onclick="??????????" type="checkbox" name="checkbox1" id="checkbox1"/> <input onclick="??????????" type="checkbox" name="checkbox2" id="checkbox2"/> - when checkbox1 is checked, i want to activate the hidden inputs 1 & 2. if it is unchecked, then desactivate hidden inputs 1&2 - when checkbox2 is checked, i want to activate the hidden inputs 3 & 4. if it is unchecked, then desactivate hidden inputs 3&4 could someone help me with the "onclick" code i would need to do this ?? thanks a lot!! i'm trying to "post" the selected checkboxes (name and value) into a mysql database; i've search "docter google" for some answers and read that the "easiest" way to do this is to collect the checkboxes and put the values and names in to an hidden textfield ( function setvalue() ) and collect this textfield in a new page with php; but this doesn't work. it seems that the variable naamtest is empty (when i load a word into this var arv it does work) can someone find my error? Code: <script type="text/javascript"> function shift(which) { var counter = 0; // counter for checked checkboxes var i = 0; // loop variable var veck = "";// final url variable var beginsaldo = 79; var namen_array = ""; var va_array = ""; var namen = ""; var valu = ""; var input_obj = document.getElementsByTagName('input'); // get a collection of objects with the specified 'input' TAGNAME for (i=0; i < input_obj.length; i++){ // loop through all collected objects if (input_obj[i].type == 'checkbox' && input_obj[i].checked == true){ // if input object is checkbox and checkbox is checked then ... counter++; // ... increase counter var valcheck = input_obj[i].value; // waarde van de geselecteerde checkbox in variable steken test = Number(valcheck); // absolute rekenwaarde van variable maken beginsaldo -= test; //beginsaldo verminderen met de checkbox value if (counter > 0){ var naam = input_obj[i].name + ' '; var val = input_obj[i].value + ' '; namen = namen + naam; valu = valu + val; namen_array = namen.split(" "); va_array = valu.split(" "); var naamtest = namen_array; }}} if (counter > 10){ alert ("u mag maar 10 renners selecteren"); var tr = which.parentNode; while ( tr.tagName.toUpperCase() != "TR" ) { tr = tr.parentNode; if ( tr == null ) return; // something went very wrong! } var tds = tr.getElementsByTagName("td"); tds[0].getElementsByTagName("input")[0].checked = false; } else if (beginsaldo < 0){ alert ("uw saldo is te laag om dit uit te voeren"); var tr = which.parentNode; while ( tr.tagName.toUpperCase() != "TR" ) { tr = tr.parentNode; if ( tr == null ) return; // something went very wrong! } var tds = tr.getElementsByTagName("td"); tds[0].getElementsByTagName("input")[0].checked = false; } else{ var tr = which.parentNode; while ( tr.tagName.toUpperCase() != "TR" ) { tr = tr.parentNode; if ( tr == null ) return; // something went very wrong! } var tds = tr.getElementsByTagName("td"); if ( tds[0].getElementsByTagName("input")[0] == which ) { tds[2].innerHTML = tds[0].innerHTML; tds[0].innerHTML = " "; tds[3].innerHTML = tds[1].innerHTML; tds[1].innerHTML = " "; tds[2].getElementsByTagName("input")[0].checked = true; } else { // this code is optional!! tds[0].innerHTML = tds[2].innerHTML; tds[2].innerHTML = " "; tds[1].innerHTML = tds[3].innerHTML; tds[3].innerHTML = " "; tds[0].getElementsByTagName("input")[0].checked = false; } function setValue() { var arv = naamtest.join(); // This line converts js array to String document.f2.arv.value=arv; // This sets the string to the hidden form field. }}} </script> I have a hidden field whose value is a text string, "xyz". I want to write the value to the page so that the user can see it but not edit it. Can't I just use document.write(form.field.value)? Why isn't it working?
I have a simple script connect to a radio button. Based on which option, the matching div appears with a text box - and one with a radio button. If they change their mind and click another radio button, it'll switch to the new div, but keep the content in the old. How do I clear that out? I looked for a snippet, but they're all for clearing default text in a field when you click it. I want something a little different. Here's what I'm using: Code: <script> $(document).ready(function() { $("div.desc").hide(); $("input[name$='hear']").click(function() { var test = $(this).val(); $("div.desc").hide(); $("#" + test).show(); }); }); </script> <input type="radio" name="hear" value="dcranch"> DC Ranch Community <br /> <input type="radio" name="hear" value="friend"> From a friend <br /> <div style="display: none;" id="dcranch" class="desc"> <input type="checkbox" value="Yes" name="resident" /> If so, are you a DC Ranch resident? )</div><br /> <div style="display: none;" id="friend" class="desc"> Name? <input type="text" name="how1" /></div><br /> Hey Guys, I have the following hidden field within a form: Code: <input type="hidden" name="test12" value="test12" /> I also have the following function which does something if that field exists: Code: if(document.formName.test12.value == "thisdata") { //do something } The problem I'm having is that if the hidden field doesn't display (which based on conditional logic, sometimes happens), a JS error is thrown on the page. What is the best way to carry out this check effectively without throwing an error if the field does not exist? Thanks in advance. I have a script where I move randomly users from one multiple selectfield to another and that part works perfectly, but... When I want to submit the form I don't get any users passed along, course they are not "selected". I have then read around on the net and I need to create an elemet with a hidden input field where all the randomly selected users is inserted to with comma separation, but dont know how?!?! This is what I got: Code: function randomusers(){ var given = 3, used = {}, randnum, opts = $('#select1 option'), olen = opts.length; function ran() { // generate a unique random number randnum = Math.floor(Math.random() * olen); return used['u'+randnum] ? ran() : randnum; } for (var i = 0; i < given; i++) { // get the correct quantity of randoms used['u'+ran()] = true; } opts.filter(function(index) { // remove all options that are not one of the randoms return !!used['u'+index]; }).appendTo('#select2'); } I have tryied to insert this: appendTo('#select2' + '<input type="hidden" name="test[]" value="" />'); but that didn't seem right... Please help :-) I have modified a free JS function from he http://www.tangorangers.com/examples...post/index.php To dynamically add text fields to the form. My work-in-progress version is he http://jimpix.co.uk/junk/test/6.html On the form, I have a hidden text field: Code: <input type="hidden" name="hiddenCount" value="" /> What I'd like to do is to increment the hiddenCount each time the "Add" fields button is clicked. This is the button: <input id="add_contact()" onclick="add_contact()" value="Add" type="button"> And this is the JS function: Code: var contact_counter = 0; function add_contact() { if (contact_counter < 9) { contact_counter++; var newFields = document.getElementById('add_contact').cloneNode(true); newFields.id = 'contact'; newFields.style.display = 'block'; var newField = newFields.childNodes; for (var i=0;i<newField.length;i++) { var theName = newField[i].name if (theName) newField[i].name = theName + contact_counter; } var insertHere = document.getElementById('add_contact'); insertHere.parentNode.insertBefore(newFields,insertHere); } } I'm new to JS. I could just about edit the JS function to slightly modify it from the tangorangers version (I only changed it v. slightly). To somehow increment the value in the hidden field each time the button is pressed is beyond me though! Any advice much appreciated. Thanks Okay, new to this magical thing called Javascript and LOVING it. Don't know how I avoided it all these years. Running into a stupid issue and I am sure it is just something I am missing. I have a hidden field in my page with the default value of HELLO. I am trying to make a change based on the default value, but I obviously am doing something wrong because it won't display my hidden field value. Any help would be greatly appreciated. Code: <html> <head> <script> function checkForm() { var testing = document.getElementById("testing").value; document.getElementById("result").innerHTML = testing; } </script> </head> <body> <input type="hidden" name="testing" value="HELLO" /> <input type="submit" value="submit" onClick="checkForm()"; /> <div id="result"></div> </body> </html> I have been staring at this code for too long and need some help. I want to pass a value received through the Url to another screen with new data by a form using the method="get". I have tried several different ways, my latest attempt was to use a hidden field hoping that would add to the url string but it isn't working. Thank you in advance Here is my code, its not pretty 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>Field Location</title> <link rel="stylesheet" href="css/INTERPRETING_TR_CONTROL_ELECTRICAL_READINGS.css" type="text/css" media="screen" /> </head> <body> <div> <form id="form1" name="form1" method="get" action="./nameplateInformation.html"> <h3>Where is this field located?</h3> <select name="fieldValue" id="fieldValue" title="Where is this field located"> <option value="field1">Inlet Field</option> <option value="field2">Second Field</option> <option value="field3">Third Field</option> <option value="field4 ">Outlet Field</option> </select> <script type="text/javascript"> (function(){ // Import GET Vars :D document.getVars = []; var urlHalves = String(document.location).split('?'); if(urlHalves[1]){ var urlVars = urlHalves[1].split('&'); for(var i=0; i<=(urlVars.length); i++){ if(urlVars[i]){ var urlVarPair = urlVars[i].split('='); document.getVars[urlVarPair[0]] = urlVarPair[1]; } } } })(); prceptType = document.getVars.preceptType; document.write('<input type="hidden" name="preceptType" value='+preceptType+' />'); </script> <input type="submit" value="Submit" /> <input type="button" name="backButton" value="Back" onclick="parent.location = './welcome.html'" /> <input type="button" name="homeButton" value="Home" onclick="parent.location = '../index.html'" /></form> </div> </body> </html> Hi, I was tasked with creating a JavaScript quiz... I succeeded in doing so but part of the requirement was to use hidden fields for the answers. Would this be possible using the code I currently have: Thanks Code: <html> <head> <script type="text/javascript"> function valid() { cor = "0" incor = "0" test0 = document.myform.elements[0].value; test1 = document.myform.elements[1].value; test2 = document.myform.elements[2].value; test3 = document.myform.elements[3].value; test4 = document.myform.elements[4].value; test5 = document.myform.elements[5].value; test6 = document.myform.elements[6].value; test7 = document.myform.elements[7].value; test8 = document.myform.elements[8].value; test9 = document.myform.elements[9].value; if (test0 == "64") { alert("Congratulations you got question one correct!"); ++cor } else alert("Sorry, you got question one incorrect!"); if (test1 == "56") { alert("Congratulations you got question two correct!"); ++cor } else alert("Sorry, you got question two incorrect!"); if (test2 == "7") { alert("Congratulations you got question three correct!"); ++cor } else alert("Sorry, you got question three incorrect!"); if (test3 == "8") { alert("Congratulations you got question four correct!"); ++cor } else alert("Sorry, you got question four incorrect!"); if (test4 == "100") { alert("Congratulations you got question five correct!"); ++cor } else alert("Sorry, you got question five incorrect!"); if (test5 == "1947") { alert("Congratulations you got question six correct!"); ++cor } else alert("Sorry, you got question six incorrect!"); if (test6 == "1") { alert("Congratulations you got question seven correct!"); ++cor } else alert("Sorry, you got question seven incorrect!"); if (test7 == "7") { alert("Congratulations you got question eight correct!"); ++cor } else alert("Sorry, you got question eight incorrect!"); if (test8 == "132") { alert("Congratulations you got question nine correct!"); ++cor } else alert("Sorry, you got question nine incorrect!"); if (test9 == "5280") { alert("Congratulations you got question ten correct!"); ++cor } else alert("Sorry, you got question ten incorrect!"); //else ++incor alert("you got " + cor + " right\n You got " + cor/10 * 100 + "% correct!"); } </script> </head> <body> <form name="myform"> <table border="1" cellpadding="10"> <tr><td>1. 64 added to what number gives a sum of 128?</td><td><input type="text" name="q1"></td></tr> <tr><td>2. The product of 8 and 7 is?</td><td><input type="text" name="q2"></td></tr> <tr><td>3. 35 divided by 5 is:</td><td><input type="text" name="q3"></td></tr> <tr><td>4. 40 divided by 5 is:</td><td><input type="text" name="q4"></td></tr> <tr><td>5. What is the area of rectangle that measure 5 by 20?</td><td><input type="text" name="q5"></td></tr> <tr><td>6. What is 3054 subtracted from 5001?</td><td><input type="text" name="q6"></td></tr> <tr><td>7. What is the result of 5 x 8-39?</td><td><input type="text" name="q7"></td></tr> <tr><td>8. What is the binary number 111 in decimal?</td><td><input type="text" name="q8"></td></tr> <tr><td>9. The sum of 33 and 44 and 55 is:</td><td><input type="text" name="q9"></td></tr> <tr><td>10. How many feet in a mile?</td><td><input type="text" name="q10"></td></tr> <tr><td><input type="button" onClick="valid()" value="score"></td><td><input type="reset"></td></tr> </form> </table> </body> </html> 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 all, I'm a beginner in JavaScript can someone please help me to resolve this issue and thanks in advance for your help! What I'm trying to do is.. When you select multiple <div> get the value of each one and save in separate hidden fields accordingly. What needs to happen is... Click div 1 --> if hidden field1 value is "none", save there, else check hidden field 2 if that's "none" save in hidden field 2 Click div 2 --> if hidden field1 value is "none", save there, else check hidden field 2 if that's "none" save in hidden field 2 Here's what I've come up with so far (currently I'm using JQuery) The problem with this is that no matter what div I click in which order it only updates the 1st hidden field Code: <div id="click1" name="click1" value="123" onclick="abc()"/>Click 1</div> <div id="click2" name="click2" value="225" onclick="def()"/>Click 2</div> <input id="passenger_1" name="passenger_1" type="hidden" value="none" /> <input id="passenger_2" name="passenger_2" type="hidden" value="none" /> <script> function abc() { var pasvalue = $('#click1').attr('value'); var pas1_value = $('#passenger_1').attr('value'); var pas2_value = $('#passenger_2').attr('value'); if(pas1_value == "none"){ $('#passenger_1').attr('value', pasvalue); }else if (pas2_value == "none"){ $('#passenger_2').attr('value', pasvalue); }} function def() { var pasvalue = $('#click2').attr('value'); var pas1_value = $('#passenger_1').attr('value'); var pas2_value = $('#passenger_2').attr('value'); if(pas1_value == "none"){ $('#passenger_1').attr('value', pasvalue); }else if (pas2_value == "none"){ $('#passenger_2').attr('value', pasvalue); }} </script> I have a very interesting situation and I'm just looking for ideas at the moment. I have a webpage for insurance agents that the agent will login and then enter some insured information. There is a field named "agentnumber" that is on the form, but is hidden by a display:none. The field is set from the username of the person who logs in whenever the form loads the first time. The form will save automatically when the user leaves the page. I am experiencing a weird issue that every now and then, the agentnumber field is getting saved with incorrect data. After discussing it with the agent, it is being saved with the agentnumber of the agent from other companies, not from the my website. Just looking for any ideas on what may be happening as I thought browser security would prevent cross site javascript. The users are using IE 7 & IE 8. Any help would be appreciated as I'm not even sure what to look for. my code is below what i want this to do is take the x_cityid and add it to teh hidden field with the id of citiesid (I will do an ajax call before this but my simple javascript is not working) what am i doing wrong? function addtocitylist() { var x_cityid = document.getElementById('x_cityid'); var x_areaid = document.getElementById('x_areaid'); var scitiesid=document.getElementById('citiesid'); var areasid = document.getElementById('areasid'); if (!scitiesid) { scitiesid.value = x_cityid; } else { scitiesid.value = scitiesid + ',' + x_cityid; } scitiesid.value = scitiesid ; alert(scitiesid); } I need for the form to do the following: when age is greater than or equal to 65 enter "yes" in the hidden field when age is less than 65 enter "no" in the hidden filed return true Create a page processAge.htm that Writes the message on the page Hi name. At age # you may retire. or Hi name. At age # you are not ready to retire. Get to work. name is the name entered on the form. # is the age entered on the form. Java: Code: <script type="text/javascript"> /* <![CDATA[ */ function validateSubmission() { var retValue = true; if (document.forms[0].name.value == "") { window.alert("You did not fill in one of the following required fields: Name or Age."); retValue = false; } } function checkForNumber(fieldValue) { var numberCheck = isNaN(fieldValue); if (numberCheck == true) { window.alert("You must enter a numeric value!"); return false; } } /* ]]> */ </script> Body: Code: <form action="processAge.htm" method="get" onsubmit="makeList(); return validateSubmission(); "> <table frame="border" rules="cols" > <tr> <td valign="top"> <h2>Retirement</h2> <p>Name<br /> <input type="text" name="name" size="40" /></p> <p>Age<br /> <input type="text" name="age" size="40" onchange="return checkForNumber(this.value);" /></p> <p style="text-align: center"><input type="submit" value="Send" /><input type="reset" /> <input type="hidden" name="Retirement" /></p> </td></tr> </table> </form> Process Page: Code: <script type="text/javascript"> /* <![CDATA[ */ document.write("<h1>Your form has been submitted!</h1><h2>You entered the following data:</h2>"); var formData = location.search; formData = formData.substring(1, formData.length); while (formData.indexOf("+") != -1) { formData = formData.replace("+", " "); } formData = unescape(formData); var formArray = formData.split("&"); for (var i=0; i < formArray.length; ++i) { document.writeln(formArray[i] + "<br />"); } /* ]]> */ </script> Thanks for any help! I've inherited this piece and now I'm suppose to add to it. Its basic function currently is when the "Other" option is selected, a hidden text field shows. Now, I need to add when "Athletics" is selected, another hidden select group will show. I've set up the new Select group already, but not sure how to incorporate it into the already existing script. I've been researching for two days, and hopefully this form will be helpful. Code: <select id="Program" name="Program" size="1" onchange=" $other = document.getElementById('other_program').style; $invoice = document.getElementById('invoice'); if (selectedIndex==6) { $other.visibility='visible'; if ($invoice.value == 'General Fund') $invoice.value=''; } else { $other.visibility='hidden'; if (selectedIndex==1) { $invoice.value='Renegade Fund'; } else { $invoice.value='Please Specify'; } } "> <option selected="selected" value="Not Selected"> - - Select One - - </option> <option value="Athletics">Athletics</option> <option value="Drum Line">Drum Line</option> <option value="Renegade Fund">Renegade Fund</option> <option value="General Scholarships">General Scholarships</option> <option value="President's Circle">President's Circle</option> <option value="Other">Other</option> </select> <span id="other_program"><input type="text" id="invoice" name="invoice" size="15" /></span> <!-- the following is the new select group ive set up <span id="alumni"> <select id="select-alumni" name="select-alumni" size="1"> <option selected="selected" value="Not Selected">Yes or No</option> <option value="Yes-alumni">Yes</option> <option value="Not-alumni">No</option> </select> </span> --> I have a form in an iframe that submits nicely. Here is one of the hidden fields that gives the page to redirect to after submitting the form: Code: <input type="hidden" name="rtrn" value="http://www.domain.com/thanks.html" target="_parent"> The parent target doesn't work, does anyone know how I get the thanks page to replace the page containing the iframe? I thought this would have been fairly simple but it appears the onchange event isn't triggered when a hidden field is populated by other javascript without user input. I have a simple search box and autocomplete/suggestion ajax thingie going on. What I want to do is have my "Go" submit button disbled until AFTER a user has populated the hidden field "cid". A user populates this field automatically when they click on a suggested option from the ajax autocomplete doofer. Here's what I've tried at the moment but failed on. Code: <form action="index.php" method="GET" name="qsform" id="qsform"> <input type="hidden" name="p" id="p" value="compdetails" style="border:1px solid #000000;" /> <input type="text" name="quicksearch" id="quicksearch" value="Find Company" style="border:1px solid #000000;" onFocus="clearText(this)" onBlur="clearText(this)" /> <input type="hidden" name="cid" id="cid" value="" style="border:1px solid #000000;" /> <input type="submit" name="go" id="go" value="Go" disabled="true" onmouseover="if (document.qsform.cid.value!='') { document.qsform.go.disabled=false; }" /> </form> |