JavaScript - Retrieve Result From Form.submit()
Hi guys,
I'm new to the forum, and new to JavaScipt. Here's my problem. I create a form dynamically with Java Script dependin on certail actions a user choose. The end result is a form asking the user to confirm sending one or more SMS message via a mesage gateway outside of my system. Confirmation will then trigger a funtion with one or more statements like this: [CODE] document.frmSMS.action ="http://www.infobip.com/Addon/SMSService/SendSMS.aspx?user=User&password=Password&sender=Sender&SMSText=Friendly Reminder from Joe Bloggs Pty Ltd: You have an outstanding amount of R 4,534.00 that is 135 days ovedue. Please settle to as soon possible.&IsFlash=0&GSM=27826555959"; document.frmSMS.submit(); [ICODE] The target site then responds with either an error code (i.e. -10) or a reference number. The question is - How do I retrieve the error code?? Your assistance will be appreciated. NicOos Similar TutorialsHi there! I have two iframes, within each iframe are four drop down list boxes. On my main page I have one text input box and one text area input box. Aim: 1. Retrieve all the values. 2. Place them into a hidden form. 3. Submit the hidden form data to a Google Docs Spreadsheet. I need to export: (in this order, all are within form tags) "List1,2,3,4" (drop down lists) from form "initiatorform" within frame "initiatorframe" which is "initiator.html" "List5,6,7,8" (drop down lists) from form "finisherform" within frame "finisherframe" which is "finisher.html" "ComboName" (Text input box) and "Description" (text area input) from form "indexform" within "Index.html" I've been trying different pieces of code for the last few days with no luck. I've been using an alert to test whether the value has been recorded but it won't even pop up at all. I've been trying to use this example. Is this the correct format for what I'm trying to do? Code: <script language="JavaScript" type="text/javascript"> <!-- function whatever(iframeid,iframename){ mmspobj=document.getElementById(iframeid); if (mmspobj.tagName=='IFRAME'){ mmsiobj=window.frames[iframename].document.getElementId('myfield1ID').value; alert(mmsiobj); } alert(mmsiobj); } //--> </script> I'm just trying to retrieve the value atm, once its working I can set the hidden form data. I'm sorry if this is something simple but I've been teaching myself over the last week while making Google Apps. Any help would be greatly appreciated. Hi all, I'm designing something to addon to an existing product. I'm struggling with some javascript problems. I want to submit a hidden field when you click on an image button, rather than it being an actual submit button. It's going to submit the value "1" to a PHP page, but I don't want it to actually have to GO to the PHP page, just submit it within the webpage. Is this possible? Thanks I've literally tried everything. Read 26 tutorials, interchanged code, etc. My validation functions all work. My AJAX functions work (tested manually using servlet URL's). The second servlet validates the reCaptcha form that's generated on my webpage. After the form is validated, even if everything's correct, nothing happens upon clicking submit. I even have an alert pop up if with the captcha result, just for middle-layer debugging purposes. I want to do all of my validation clientside; none serverside. However, going to be tough if I can't get my god damn form to submit. I've been puzzled by this for close to 36 hours straight. I can't see, and I'm going to get some rest and hope that there is some useful insight on my problem when I return. html form: Code: <form id="f1" name="form1" onsubmit="validate_form(this); return false;" action="register" method="post"> <table cellspacing="5" style="border: 2px solid black;"> <tr> <td valign="top"> <table cellspacing="5"> <tr> <td>*First name</td> <td align="right"><span id="valid_one"></span></td> <td><input type="text" style="width: 320px;" id="fn" name="fn" onBlur="validate_one();"></td> </tr> <tr> <td align="left">*Last name</td> <td align="right"><span id="valid_two"></span></td> <td><input type="text" style="width: 320px;" id="ln" name="ln" onBlur="validate_two();"></td> </tr> <tr> <td align="left">*Email address</td> <td align="right"><span id="result"></span></td> <td><input type="text" style="width: 320px;" id="mailfield" name="email" onBlur="startRequest();"></td> </tr> <tr> <td align="left">*Phone number</td> <td align="right"><span id="valid_three"></span></td> <td><input type="text" style="width: 320px;" id="pn" name="pn" onBlur="validate_three();"></td> </tr> <tr> <td align="left">*City/Town</td> <td align="right"><span id="valid_four"></span></td> <td><input type="text" style="width: 320px;" id="c" name="c" onBlur="validate_four();"></td> </tr> <tr> <td></td> <td></td> <td> <select name="s"> <option value="AL">Alabama <option value="AK">Alaska <option value="AZ">Arizona <option value="AR">Arkansas <option value="CA">California <option value="CO">Colorado <option value="CT">Connecticut <option value="DE">Delaware <option value="FL">Florida <option value="GA">Georgia <option value="HI">Hawaii <option value="ID">Idaho <option value="IL">Illinois <option value="IN">Indiana <option value="IA">Iowa <option value="KS">Kansas <option value="KY">Kentucky <option value="LA">Louisiana <option value="ME">Maine <option value="MD">Maryland <option value="MA">Massachusetts <option value="MI">Michigan <option value="MN">Minnesota <option value="MS">Mississippi <option value="MO">Missouri <option value="MT">Montana <option value="NE">Nebraska <option value="NV">Nevada <option value="NH">New Hampshire <option value="NJ">New Jersey <option value="NM">New Mexico <option value="NY">New York <option value="MC">North Carolina <option value="ND">North Dakota <option value="OH">Ohio <option value="OK">Oklahoma <option value="OR">Oregon <option value="PA">Pennsylvania <option value="RI">Rhode Island <option value="SC">South Carolina <option value="SD">South Dakota <option value="TN">Tennessee <option value="TX">Texas <option value="UT">Utah <option value="VT">Vermont <option value="VA">Virginia <option value="WA">Washington <option value="WV">West Virginia <option value="WI">Wisconsin <option value="WY">Wyoming </select> </td> </tr> <tr> <td> <br> </td> </tr> <tr> <td></td> <td></td> <td><span id="error"></span></td> </tr> <tr> <td valign="top">*Anti-Spam Verification</td> <td></td> <td id="reCaptcha"></td> </tr> </table> </td> <td valign="top"> <table cellspacing="5"> <tr> <td align="left">*Affiliation</td> <td align="right"><span id="valid_five"></span></td> <td><input type="text" style="width: 320px;" id="affl" name="affl" onBlur="validate_five();"></td> </tr> <tr> <td align="left">*Research Area:</td> <td align="right"><span id="valid_six"></span></td> <td><input type="text" style="width: 320px;" id="ra" name="ra" onBlur="validate_six();"></td> </tr> <tr> <td valign="top" align="left">*Research Overview</td> <td align="right"><span id="valid_seven"></span></td> <td><textarea cols="38" rows="6" id="ro" name="ro" onKeyDown="limitText(this.form.ro,this.form.countdown,500)" onKeyUp="limitText(this.form.ro,this.form.countdown,500)" onBlur="validate_seven();"></textarea></td> </tr> <tr> <td></td> <td></td> <td><font size="1">You have <input readonly type="text" name="countdown" size="1" value="500"> characters remaining.</font></td> </tr> <tr> <td align="left">*Talk Availability</td> <td></td> <td> <input type="radio" name="ta" value="In person">In person <input type="radio" name="ta" value="Online">Online <input type="radio" name="ta" value="Both" checked>Both </td> </tr> <tr> <td align="left" valign="top">Links</td> <td></td> <td> <table id="linkTable" border="0"> <td><input type="text" style="width: 320px;" name="link"></td> <td><div id="result"></div></td> </table> </td> <td align="left" valign="top"><input type="button" value="Add Link" onclick="addLink('linkTable')"></td> </tr> <tr> <td></td> <td><span style="color: red;"></span></td> </tr> </table> </td> </tr> </table> <br /> <input type="submit" id="submit" name="submit" value="Submit Form"> </form> Javascript file: Code: /* * script.js - ajax and table functions */ var xmlHttp; // global instance of XMLHttpRequest var xmlHttp2; // second for captcha functions var validAjax = new Boolean(); var validCaptcha = new Boolean(); var valid_one = new Boolean(); var valid_two = new Boolean(); var valid_three = new Boolean(); var valid_four = new Boolean(); var valid_five = new Boolean(); var valid_six = new Boolean(); var valid_seven = new Boolean(); function init() { showRecaptcha('reCaptcha'); // Separate booleans for AJAX funcs validAjax = false; validCaptcha = false; // Booleanse for fields that don't require servlet validation valid_one = false; valid_two = false; valid_three = false; valid_four = false; valid_five = false; valid_six = false; valid_seven = false; } function showRecaptcha(element) { Recaptcha.create("6Le1a8ESAAAAAGtxX0miZ2bMg0Wymltnth7IG-Mj", element, {theme: "red", callback: Recaptcha.focus_response_field}); } function validate_form() { if (valid_one && valid_two && valid_three && valid_four && validEmail) { startCaptchaRequest(); if (validCaptcha) { return true; } } else { alert("Submission contains errors. Please fill out all required fields before submitting."); return false; } } function validate_one() { if (document.getElementById("fn").value == 0) { valid_one = false; document.getElementById("valid_one").innerHTML = "No"; } else { valid_one = true; document.getElementById("valid_one").innerHTML = ""; } } function validate_two() { if (document.getElementById("ln").value == 0) { valid_two = false; document.getElementById("valid_two").innerHTML = "No"; } else { valid_two = true; document.getElementById("valid_two").innerHTML = ""; } } function validate_three() { if (document.getElementById("pn").value == 0) { valid_three = false; document.getElementById("valid_three").innerHTML = "No"; } else { valid_three = true; document.getElementById("valid_three").innerHTML = ""; } } function validate_four() { if (document.getElementById("c").value == 0) { valid_four = false; document.getElementById("valid_four").innerHTML = "No"; } else { valid_four = true; document.getElementById("valid_four").innerHTML = ""; } } function validate_five() { if (document.getElementById("affl").value == 0) { valid_five = false; document.getElementById("valid_five").innerHTML = "No"; } else { valid_five = true; document.getElementById("valid_five").innerHTML = ""; } } // //function validate_six() { // if (document.getElementById("ra").value == 0) { // valid_six = false; // document.getElementById("valid_six").innerHTML = "No"; // } // else { // valid_six = true; // document.getElementById("valid_six").innerHTML = ""; // } //} // //function validate_seven() { // if (document.getElementById("ro").value == 0) { // valid_seven = false; // document.getElementById("valid_seven").innerHTML = "No"; // } // else { // valid_seven = true; // document.getElementById("valid_seven").innerHTML = ""; // } //} function addLink(tableID) { var table = document.getElementById(tableID); var rowCount = table.rows.length; var row = table.insertRow(rowCount); var cell = row.insertCell(0); var element1 = document.createElement("input"); element1.type = "text"; element1.name = "link" + rowCount; element1.style.width = "320px"; cell.appendChild(element1); } function limitText(limitField, limitCount, limitNum) { if (limitField.value.length > limitNum) { limitField.value = limitField.value.substring(0, limitNum); } else { limitCount.value = limitNum - limitField.value.length; } } function createXmlHttpRequest() { if(window.ActiveXObject) { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } else if(window.XMLHttpRequest) { xmlHttp=new XMLHttpRequest(); } } function startRequest() { createXmlHttpRequest(); var param1 = document.getElementById('mailfield').value; if (param1 == "") { validEmail = false; document.getElementById("result").innerHTML = "Blank"; } else { xmlHttp.open("GET", "http://localhost:1979/PolarSpeakers/servlet/mailCheck.do?e=" + param1, true) xmlHttp.onreadystatechange = handleStateChange; xmlHttp.send(null); } } function handleStateChange() { if(xmlHttp.readyState==4) { if(xmlHttp.status==200) { var message = xmlHttp.responseXML .getElementsByTagName("valid")[0] .childNodes[0].nodeValue; if (message == "Unregistered") { validEmail = true; document.getElementById("result").style.color = "green"; } else { validEmail = false; document.getElementById("result").style.color = "red"; } document.getElementById("result").innerHTML = message; } else { alert("Error checking e-mail address - " + xmlHttp.status + " : " + xmlHttp.statusText); } } } function createCaptchaRequest() { if(window.ActiveXObject) { xmlHttp2=new ActiveXObject("Microsoft.XMLHTTP"); } else if(window.XMLHttpRequest) { xmlHttp2=new XMLHttpRequest(); } } function startCaptchaRequest() { alert('made it to captcha requeswt'); createCaptchaRequest(); var param1 = Recaptcha.get_challenge(); var param2 = Recaptcha.get_response(); xmlHttp2.open("POST", "http://localhost:1979/PolarSpeakers/servlet/captchaCheck.do?c=" + param1 + "&r=" + param2, true) xmlHttp2.onreadystatechange = handleStateChangeCaptcha; xmlHttp2.send(null); } function handleStateChangeCaptcha() { if(xmlHttp2.readyState==4) { if(xmlHttp2.status==200) { var message = xmlHttp2.responseXML .getElementsByTagName("result")[0] .childNodes[0].nodeValue; if (message == "Valid") { alert("captcha valid"); validCaptcha = true; } else { document.getElementById("error").innerHTML = message; validCaptcha = false; } } else { alert("Error checking captcha validity - " + xmlHttp2.status + " : " + xmlHttp2.statusText); } } } Good day to you all, I'm working on a form which would display the result in the same div that the form is. Here is my code so far: PHP Code: <form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post"> <textarea name="html"></textarea><br /> <input type="submit" onclick="load('<?php echo $_SERVER['PHP_SELF']; ?>','page');"/><br /> </form> Preview:<br /> <?php if(isset($_POST['html'])) echo stripslashes($_POST['html']); ?> <script type="text/javascript"> function ahah(url, target) { document.getElementById(target).innerHTML = ' Fetching data...'; if (window.XMLHttpRequest) { req = new XMLHttpRequest(); } else if (window.ActiveXObject) { req = new ActiveXObject("Microsoft.XMLHTTP"); } if (req != undefined) { req.onreadystatechange = function() {ahahDone(url, target);}; req.open("GET", url, true); req.send(""); } } function ahahDone(url, target) { if (req.readyState == 4) { // only if req is "loaded" if (req.status == 200) { // only if "OK" document.getElementById(target).innerHTML = req.responseText; } else { document.getElementById(target).innerHTML=" Error:\n"+ req.status + "\n" +req.statusText; } } } function load(name, div) { ahah(name,div); return false; } </script> My problem is when I click on the button , the text in my text area don't show. Can somebody help me. Thanks! Hi, i will try to be as brief as possible. I have a page A with form: Code: <form id="search" action="find.html" method="get"> ... (some select options) ... <input type="submit" class="submit" value="search"> this form look up some holiday destination which appears on this page with url: (example) Code: www.domain.com/find.html?destination=italy&price=500 Now, I dont want to display result on this page, but on page B, in iframe. I found a way how to redirect output as a link to properly show in iframe on page B. Page A contains: Code: <a href="pageb.html?http://www.domain.com/find.html?destination=italy&price=500">show on page B</a><br> Page B contains: Code: <script type="text/javascript"> <!-- function loadIframe(){ if (location.search.length > 0){ url = unescape(location.search.substring(1)) window.frames["iframe"].location=url } } onload=loadIframe //--> </script> <iframe src="" name="iframe" id="iframe"</iframe> In this case page B will properly load requested link in iframe. Problem is it is just a static link... I want to display search result from the form. Thanks a lot for your help... Hi, I am using Javascript to display options in a form with 2 dropdown lists. However, despite using the rel="nofollow" target='_self', the result opens in a new window. Help would be much appreciated. Code: // JavaScript Document function setOptions(chosen) { var selbox = document.ChronoContact_course_finder.opttwo; selbox.options.length = 0; if (chosen == ' ') { selbox.options[selbox.options.length] = new Option('Choose Option',' '); } if (chosen == '85') { selbox.options[selbox.options.length] = new Option('ITEC Beauty Specialist Diploma','index.php?option=com_content&view=article&id=49&Itemid=68',rel="nofollow" target='_self'); selbox.options[selbox.options.length] = new Option('ITEC Professional Makeup','index.php?option=com_content&view=article&id=57&Itemid=76',rel="nofollow" target='_self'); selbox.options[selbox.options.length] = new Option('Fashion Catwalk & Photographic Makeup Course','index.php?option=com_content&view=article&id=67&Itemid=91',rel="nofollow" target='_self'); selbox.options[selbox.options.length] = new Option('Bridal Makeup Course','index.php?option=com_content&view=article&id=68&Itemid=92',rel="nofollow" target='_self'); selbox.options[selbox.options.length] = new Option('Special Effects Makeup','index.php?option=com_content&view=article&id=56&Itemid=77',rel="nofollow" target='_self'); selbox.options[selbox.options.length] = new Option('Gel Nails Course','index.php?option=com_content&view=article&id=65&Itemid=88',rel="nofollow" target='_self'); selbox.options[selbox.options.length] = new Option('Acrylic Nails Course','index.php?option=com_content&view=article&id=66&Itemid=89',rel="nofollow" target='_self'); selbox.options[selbox.options.length] = new Option('Spray Tanning Course','index.php?option=com_content&view=article&id=55&Itemid=73',rel="nofollow" target='_self'); } if (chosen == '69') { selbox.options[selbox.options.length] = new Option('ITEC Holistic Massage Course','index.php?option=com_content&view=article&id=51&Itemid=2',rel="nofollow" target='_self'); selbox.options[selbox.options.length] = new Option('ITEC Sports Massage Diploma','index.php?option=com_content&view=article&id=59&Itemid=78',rel="nofollow" target='_self'); selbox.options[selbox.options.length] = new Option('Indian Head Massage Course','index.php?option=com_content&view=article&id=60&Itemid=79',rel="nofollow" target='_self'); selbox.options[selbox.options.length] = new Option('ITEC Reflexology Diploma','index.php?option=com_content&view=article&id=64&Itemid=87',rel="nofollow" target='_self'); } if (chosen == '80') { selbox.options[selbox.options.length] = new Option('ITEC Teaching Diploma','index.php?option=com_content&view=article&id=61&Itemid=81',rel="nofollow" target='_self'); selbox.options[selbox.options.length] = new Option('FETAC Train The Trainer Level 6','index.php?option=com_content&view=article&id=63&Itemid=86',rel="nofollow" target='_self'); } if (chosen == '83') { selbox.options[selbox.options.length] = new Option('ITEC Sports Massage Diploma','index.php?option=com_content&view=article&id=59&Itemid=90',rel="nofollow" target='_self'); } } And the HTML... Code: <div class="form_item"> <div class="form_element cf_heading"> <h1 class="cf_text">course finder</h1> </div> <div class="cfclear"> </div> </div> <div class="form_item"> <div class="form_element cf_dropdown"> <label class="cf_label" style="width: 200px;">Step 1: Choose type of course</label> <select name="optone" class="cf_inputbox" size="1" onchange="setOptions(document.ChronoContact_course_finder.optone.options[document.ChronoContact_course_finder.optone.selectedIndex].value);"> <option value=" " selected="selected">Choose Option</option> <option value="85">Beauty courses</option> <option value="69">Complimentary courses</option> <option value="80">Teaching courses</option> <option value="83">Fitness courses</option> </select> </div> <div class="cfclear"> </div> </div> <div class="form_item"> <div class="form_element cf_dropdown"> <label class="cf_label" style="width: 200px;">Step 2: Choose a subject</label> <select size="1" name="opttwo" class="cf_inputbox" > <option value=" " selected="selected">Choose Option</option> </select> <!--<input type="button" name="go" value="Value Selected" onclick="window.open(document.ChronoContact_course_finder.opttwo.options[document.ChronoContact_course_finder.opttwo.selectedIndex].value);">--> </div> <div class="cfclear"> </div> </div> <div class="form_item"> <div class="form_element cf_button"> <input type="submit" name="go" value="search" onclick="window.open(document.ChronoContact_course_finder.opttwo.options[document.ChronoContact_course_finder.opttwo.selectedIndex].value);"> </div> <div class="cfclear"> </div> </div> Many thanks, Paul Hi guys, I have a simple calculator on my website which has a few options selectable by radio buttons. When the user adds selections - the total price of their order is automatically calculated and displayed in a <div> for them to see. The client then can deselect options or add according to their budget. The code which deals with this is as follows (just sections of it but you get the point ....) In the <HEAD> Code: <script type = "text/javascript"> var allprices = []; var index = 0; function chkrads(frmName,rbGroupName) { var chosen = ""; var radios = document[frmName].elements[rbGroupName]; for (var i=0; i <radios.length; i++) { if (radios[i].checked) { chosen = radios[i].value; } } if (chosen == 0) {printprice = 0} if (chosen == 1) {printprice = 99} if (chosen == 2) {printprice = 150} if (chosen == 3) {printprice = 250} if (chosen == 21) {printprice = 200} if (chosen == 22) {printprice = 300} if (chosen == 30) {printprice = 50} if (chosen == 41) {printprice = 50} if (chosen == 42) {printprice = 70} if (chosen == 43) {printprice = 90} if (rbGroupName == "size") {index = 0} if (rbGroupName == "colour") {index = 1} if (rbGroupName == "frame") {index = 2} if (rbGroupName == "glass") {index = 3} if (rbGroupName == "hook") {index = 4} if (rbGroupName == "delivery") {index = 5} allprices[index] = printprice; var totalprice = 0; for (var i =0; i <allprices.length; i++) { if (!isNaN(allprices[i])) { totalprice = totalprice + allprices[i]; } } document.getElementById("result").style.display = "block"; document.getElementById("result").innerHTML = totalprice; } </script> Then in the <BODY> Code: <form name= "myform" style="font-size:11px; font-family:Arial, Helvetica, sans-serif;"> <input type = "radio" name = "size" value = "0" onclick = "chkrads('myform', 'size')"> <b>0</b> <input type = "radio" name = "size" value = "1" onclick = "chkrads('myform', 'size')"> <b>1</b> <input type = "radio" name = "size" value = "2" onclick = "chkrads('myform', 'size')"> <b>2</b> <input type = "radio" name = "size" value = "3" onclick = "chkrads('myform', 'size')"> <b>3</b> <br /><br /><br /><br /> <input type = "radio" name = "colour" value = "0" onclick = "chkrads('myform', 'colour')"><b>No</b> <input type = "radio" name = "colour" value = "21" onclick = "chkrads('myform', 'colour')"><b>black</b> <input type = "radio" name = "colour" value = "22" onclick = "chkrads('myform', 'colour')"><b>Multi Colour</b> <br /><br /><br /><br /> <input type = "radio" name = "frame" value = "0" onclick = "chkrads('myform', 'logo')"><b>No</b> <input type = "radio" name = "frame" value = "30" onclick = "chkrads('myform', 'logo')"><b>Yes</b> <br /><br /><br /><br /> <input type = "radio" name = "glass" value = "0" onclick = "chkrads('myform', 'glass')"><b>No</b> <input type = "radio" name = "glass" value = "51" onclick = "chkrads('myform', 'glass')"><b>Yes</b> <br /><br /><br /><br /> <input type = "radio" name = "hook" value = "0" onclick = "chkrads('myform', 'hook')"><b>0</b> <input type = "radio" name = "hook" value = "41" onclick = "chkrads('myform', 'hook')"><b>1</b> <input type = "radio" name = "hook" value = "42" onclick = "chkrads('myform', 'hook')"><b>2</b> <input type = "radio" name = "hook" value = "43" onclick = "chkrads('myform', 'hook')"><b>3</b> <br /><br /><br /><br /> <input type = "radio" name = "delivery" value = "0" onclick = "chkrads('myform', 'delivery')"><b>No</b> <input type = "radio" name = "delivery" value = "61" onclick = "chkrads('myform', 'delivery')"><b>Yes</b> </form> This all calculates the cost and then supplies the answer into this code: Code: <div id="result" style="display:none;"><strong></strong> <span id="totalprice"></span> </div> This all works exactly as I want - my question is this .... I have added an HTML contact form at the bottom of the page which goes off to a Form2Email PHP script. (All working fine) I really want to autofill one of the sections of this form "QUOTED PRICE" with the value calculated by my earlier product calculator. The form looks like so: Code: <form id="ContactForm" method="post" action="FormToEmail.php" class="input2"> <label>Name: <input name="name" type="text" id="name" value="" size="" maxlength="80" class="input"/></label> <br /><br /> <label>QUOTED PRICE: <input name="QUOTED PRICE" type="text" id="QUOTED PRICE" value="" size="" maxlength="80" class="input"/></label> <br /><br /> <label> <input type="submit" class="submit" name="submit" id="submit" value="submit"/> </label> </form> Does anyone know how to achieve this?! It would be a massive help! Hi all, I am building a custom validator. I don't want any suggestions on using a jQuery framework, i just want to ask a few question on how best to continue. Code: <script type="text/javascript"> //Validator Strings And Expressions. var Letters = /^[A-Za-z]+$/; var Numbers = /^[0-9]+$/; var Alphanumeric = /^[A-Za-z0-9]+$/; var Email = /^[a-z0-9][a-z0-9~_\-]*(\.[a-z][a-z0-9~_\-]*)*@(([a-z0-9][a-z0-9_\-]*\.)+[a-z]{2,4}|[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3})$/i; var Telephone = "0123456789- +()"; document.onkeyup = function(event){ //IE doesn't pass in the event object var event = event || window.event; //IE uses srcElement as the target var target = event.target || event.srcElement; var strId = target.id switch(target.id){ case "M_FIRSTNAME": validEmpty(strId,"* Please enter your 'First Name'."); validChars(strId,Letters,"* Your 'First Name' contains invalid characters."); break; case "M_LASTNAME": validEmpty(strId,"* Please enter your 'Last Name'."); validChars(strId,Letters,"* Your 'Last Name' contains invalid characters."); break; case "M_EMAIL": validEmpty(strId,"* Please enter your 'E-mail Address'."); validChars(strId,Email,"* Your 'E-mail Address' should be in the format you@email.com."); break; case "M_EMAIL_CONF": validEmpty(strId,"* Please confirm your 'E-mail Address'."); validMatch(strId,"M_EMAIL","Your 'E-mail Address' does not match.") break; case "M_USERNAME": validEmpty(strId,"* Please enter your 'Username'."); validChars(strId,Alphanumeric,"* Your 'Username' contains invalid characters."); validRange(strId,6,12,"* Your 'Username' should be between 6-12 characters."); OnCheckAvailability(strId); break; case "M_PASSWORD": validEmpty(strId,"* Please enter your 'Password'."); validChars(strId,Alphanumeric,"* Your 'Password' contains invalid characters."); validRange(strId,6,12,"* Your 'Password' should be between 6-12 characters."); break; case "M_PASSWORD_CONF": validEmpty(strId,"* Please confirm your 'Password'."); validMatch(strId,"M_PASSWORD","Your 'Password does not match.'") break; } //document.write(return true); }; document.onclick = function(event){ //IE doesn't pass in the event object var event = event || window.event; //IE uses srcElement as the target var target = event.target || event.srcElement; var strId = target.id switch(target.id){ case "M_TERMS": validCheck(strId,"* Please accept our Terms and Conditions."); break; } }; </script> This is the "on page" validation. This, as you can see calls functions held in an included file onkeyup. This all works well, also the username check ajax call works great. However I have 2 questions that I need to sort before this will work correctly. 1. Using M_USERNAME form as an example. If I start typing in there it will begin validating, which is great, However, if i typed in "matt_thomas" based on the validations, Empty:Pass, ValidChars:Fail, Range:Pass, Check:Pass. So I know that it isn't empty, it's the correct length and it's not already in the DB. But it fails because of the "_". This should mean that I receive the error i have setup for that failure. But I don't. Because I don't stop on a Fail, I receive the success message of the last function. So my question is; How Can I stop running any more functions when one fails? 2. Looking at the above code, How can I make sure that a submit will only work when ALL fields validate correctly? Is this possible? I'm sure it is, but Can't see the woods for the trees right now Thanks for any advice you can give. Even if you can just suggest something to look for. Also sorry in advance but I don't understand alot of "tech" jargon lol, so please keep it simple. Help, i need to edit my code to submit the form so that it will submit the data once clicked on. I am using this tutorial he http://www.switchonthecode.com/tutor...-jquery-plugin here is my code so far: my JS file: // run rating jQuery.fn.ratings = function(stars, initialRating) { //Save the jQuery object for later use. var elements = this; //Go through each object in the selector and create a ratings control. return this.each(function() { //Make sure intialRating is set. if(!initialRating) initialRating = 0; //Save the current element for later use. var containerElement = this; //grab the jQuery object for the current container div var container = jQuery(this); //Create an array of stars so they can be referenced again. var starsCollection = Array(); //Save the initial rating. containerElement.rating = initialRating; //Set the container div's overflow to auto. This ensure it will grow to //hold all of its children. container.css('overflow', 'auto'); //create each star for(var starIdx = 0; starIdx < stars; starIdx++) { //Create a div to hold the star. var starElement = document.createElement('div'); //Get a jQuery object for this star. var star = jQuery(starElement); //Store the rating that represents this star. starElement.rating = starIdx + 1; //Add the style. star.addClass('jquery-ratings-star'); //Add the full css class if the star is beneath the initial rating. if(starIdx < initialRating) { star.addClass('jquery-ratings-full'); } //add the star to the container container.append(star); starsCollection.push(star); //hook up the click event star.click(function() { //set the containers rating containerElement.rating = this.rating; // document.voteform.submit(); //When clicked, fire the 'ratingchanged' event handler. //Pass the rating through as the data argument. elements.triggerHandler("ratingchanged", {rating: this.rating}); }); star.mouseenter(function() { //Highlight selected stars. for(var index = 0; index < this.rating; index++) { starsCollection[index].addClass('jquery-ratings-full'); } //Unhighlight unselected stars. for(var index = this.rating; index < stars; index++) { starsCollection[index].removeClass('jquery-ratings-full'); } }); container.mouseleave(function() { //Highlight selected stars. for(var index = 0; index < containerElement.rating; index++) { starsCollection[index].addClass('jquery-ratings-full'); } //Unhighlight unselected stars. for(var index = containerElement.rating; index < stars ; index++) { starsCollection[index].removeClass('jquery-ratings-full'); } }); } }); }; $(document).ready(function() { $('#example-1').ratings(10).bind('ratingchanged', function(event, data) { $('#example-rating-1').text(data.rating); }); }); My html: PHP Code: echo '<form action="stream.php?task=vote" name="voteform" method="post"> '; echo ' <div id="example-1"></div> <input id="example-rating-1" type="hidden" name="score" value="0"/>'; echo '</form>'; Heres what i want it to do, I want it to submit the form once a star has been clicked, i already achieved this with the document.voteform.submit() in comments in the JS file but i cant seem to get the input to change so that it submits the actual user vote value. Please help me Why do I get "Object doesn't support method" error when clicking my links? Code: <script> function approve(){ document.forms['approve'].submit(); } function decline(){ document.forms['decline'].submit(); } </script> <form method="POST" name="approve" action=""> <input type="hidden" name="STATUS" value="APPROVED"> </form> <form method="POST" name="decline" action=""> <input type="hidden" name="STATUS" value="DECLINED"> </form> <p><a href="#" onClick="javascript: approve()" ; >Click here to APPROVE this request.</a></p> <p><a href="#" onClick="javascript: decline()" ; >Click here to DECLINE this request.</a></p> I would like an image to be the button for a form to be submitted, but a sound is to play onclick for 3 seconds before the submit happens. It sounds easy, with a setTimeout delay, but I can't get it to wait: Code: <script type="text/javascript"> function delay(){ mySoundObj1.TGotoAndPlay('/piano','start'); setTimeout('delay2()',3000) // piano sound lasts for 3 seconds } </script> <script type="text/javascript"> function delay2(){ // nothing here I guess... } </script> <FORM METHOD="POST" ACTION="do something"> <INPUT type="image" onsubmit="delay();return true;" src="image/image.gif" width="60" height="60" type="submit"> </form> Can anyone do this? I mean maybe it is not possible? Hi, I currently have a form which is submitted using a html submit button. I was wondering what the best way is of using ajax to submit the page without the use of a submit button, and when the page submits, a message is displayed saying thank you for your booking. Thanks. I have written some code below which hopefully changes teh value of the flag using JavaScript, I now want to request the value of the flag to see if it's a 1 or a 2? Code: <script> function collatedata() { document.f1.flag.value=1; document.f1.submit(); } function generateinvoices() { document.f1.flag.value=2; document.f1.submit(); } </script> <input type="hidden" name="flag" id="flag" /> <a href="javascript:collatedata();" class="button"><span>Collate</span></a> <a href="javascript:generateinvoices();" class="button"><span>Generate</span></a> the showUser function has ajax in it that calls a php file that accesses a db to perform some calculations. I wanted to use the clicked function to force required dropdowns to be selected but I cannot seem to get the submit button to do anything. It does nothing when you click it. Not sure how to proceed, have looked everywhere. If anyone has any advice I would really appreciate it. Code: <form id="forecastfilter" action="indexo_beats.php" method="get" onsubmit="clicked(this.value='yes')"> <div class="fc">Date:</div> <select name="date" onchange="showUser(this.value)"> <option value="">-- </option> <option value="Date: Past Hour">Past hour</option> <option value="Date: Past week">Past week</option> <option value="Date: Past month">Past month</option> <option value="Date: Past year">Past year</option> </select> <br /> <div class="fc">Wideouts:</div> <select name="wideouts" onchange="showUser(this.value)"> <option value="">-- </option> <option value="Wideouts: Higher">Revised Higher</option> <option value="Wideouts: Unchanged">Remains Unchanged</option> <option value="Wideouts: Lower">Revised Lower</option> </select> <br /> <div class="fc">QBs:</div> <select name="qbs" onchange="showUser(this.value)"> <option value="">-- </option> <option value="QBs: beat">Above Analyst Estimates</option> <option value="QBs: inline">Inline with Analyst Estimates</option> <option value="QBs: miss">Below Analyst Estimates</option> </select> <br /> <div class="fc">Football:</div> <select name="football" onchange="showUser(this.value)"> <option value="">-- </option> <option value="Football: beat">Above Analyst Estimates</option> <option value="Football: inline">Inline with Analyst Estimates</option> <option value="Football: miss">Below Analyst Estimates</option> </select> <br /> <div class="fc">Sentiment:</div> <select name="sentiment" onchange="showUser(this.value)"> <option value="">-- </option> <option value="Sentiment: good">Good</option> <option value="Sentiment: neutral">Neutral</option> <option value="Sentiment: bad">Bad</option> </select> <div class="searchbutton"> <input type="button" value="Search Draft" /> </div> </form> I have a javascript code to let people subscribe to our newsletter. I would like to get a mail each time a person get subscribed to our newsletter. The code to let people subscribed to our newsletter is: [I] <!-- newsletter subscribe below here --> <script language="Javascript" type="text/javascript"> var fieldstocheck = new Array(); fieldnames = new Array(); function checkform() { for (i=0;i<fieldstocheck.length;i++) { if (eval("document.subscribeform.elements['"+fieldstocheck[i]+"'].value") == "") { alert("Please enter your "+fieldnames[i]); eval("document.subscribeform.elements['"+fieldstocheck+"'].focus()"); return false; } } return true; } function addFieldToCheck(value,name) { fieldstocheck[fieldstocheck.length] = value; fieldnames[fieldnames.length] = name; } </script> <form action="http://www.investinginmongolia.com/phplist/?p=subscribe&id=2" method="post" name="subscribeform"> <p class="linkleft12">Our Newsletter:</p> <p class="linkleft12">Email: <input name="email" style="width: 105px" type="text" value="" /> <script language="Javascript" type="text/javascript">addFieldToCheck("email","Email Address");</script> <input name="list[2]" type="hidden" value="signup" /></p> <p class="linkleft12"> <input name="subscribe" onclick="return checkform();" type="submit" value="Subscribe" /></p> </form> <!-- newsletter subscribe ends here --> I also would like that an e-mail is send automatically to info@yurt-ger-yourte.com through http://www.yurt-ger-yourte.com/cgi-sys/FormMail.cgi Thanks for your help. Bernard I hope someone can help with this. I needed a form for my website and found one i liked so used there code, however i cannot get mine to work properly, i believe the problem exists here, however not sure what to do with it: <form action="contact.htm" method="post" name="contactForm" onsubmit="return validateForm()" > <p><strong>Contact information: </strong></p> <input type=hidden name="httpref" value="http://www.karenshealthandfitness.com/contact.htm"> also do i need a php file with this or something along those lines? Sorry if that sound lame, i am not the greatest at this just fumble my way through. I would like you to ask for a ltl bit assistance. Here is my problem: I have a form with few input lines and textarea, and after a form i have three buttons: [Close] [Preview] [Submit] And here is what i need: Then visitor click [Preview]- the forms data should be passed to pop_up window for preview (something like submited to pop up window) for example "pop_up_preview.php" but the main page should be left at it is (for editing data) But then user clicks [Submit], a forms data is passed to another regular page, for example "validate_data.php" Thank you in advance for assistance and i hope soon to see example how to deal with that And sorry for my poor english Ok - I'm using an 'off the peg' shopping cart (Mal's e-commerce) that posts items to the cart using a standard form with a submit button. What I want to do is send an item to the cart 'automatically', that is without the user actually filling a form or pressing a 'submit' button. What I send to the cart will be dependant upon the value of a cookie that will have been set at some earlier point in the session. My plan was to use document.write statements to build the 'form' and send it to the shopping cart... Here is the kind of form i will be creating: <form method="post" /> <input type="hidden" name="product" value="XXXXXXXX" /> <input type="hidden" name="price" value="0.00" /> <input type="hidden" name="qty" value="1" /> <input type="submit" value="add to basket" /> </form> 1) 1st problem the product value "XXXXXXXX" actually needs to be 'constructed' out of text plus the value held in the cookie eg... 'here is your COOKIEVALUE product' what i was going to try here was "here is your" + COOKIEVALUE + "product" which doesn't work - but that's what I'm trying to achieve. 2) 2nd problem is the submit 'button' needs to be an automatic 'invisible' action - i don't actually want to give them a button to click i just want to submit it from the coding. Hope that makes some kind of sense! I'm trying to submit a form without refreshing the page and I'm not having much luck. The form just resets and nothing is added to the database. The php script works fine as when I use form action - everything is added to the db. Here's the html form: Code: <div id="form"> <form method="post" action="" id="form"> <label for="sections" id="wybierz">Wybierz sekcje</label> <select id="sections" name="sections"> <option value="sekcjaA">Sekcja A</option> <option value="sekcjaB">Sekcja B</option> </select> <!-- Chose font & background color --> <label for="fontcolor1" id="colorsLabel">Wybierz kolor czcionki/ tla </label> <input class="color" id="fontcolor" name="fontColor" value="F0000F" /> <input class="color" id="bgcolor" name="bgcolor" value="ebebeb" /> <!-- Chose font --> <label for="font" id="choseFontLabel">Wybierz typ/ rozmiar czcionki<abbr title="Wybierz typ oraz rozmiar czcionki">(?)</abbr></label> <select id="font" name="font"> <option value="Arial" id="arial">Arial</option> <option value="Comic Sans Ms">Comic Sans MS</option> <option value="Courier New">Courier New</option> <option value="Georgia">Georgia</option> <option value="Impact" id="impact">Impact</option> <option value="Tahoma">Tahoma</option> <option value="Times New Roman">Times New Roman</option> <option value="Verdana">Verdana</option> <option value="Geneva">Geneva</option> <option value="Trebuchet MS">Trebuchet MS</option> </select> <!-- End chose font --> <!-- Chose font size --> <select id="fontSize" name="fontSize"> <option value="9">9px</option> <option value="10">10px</option> <option value="11">11px</option> <option value="12">12px</option> <option value="13">13px</option> <option value="14">14px</option> <option value="15">15px</option> <option value="16">16px</option> <option value="17">17px</option> <option value="18">18px</option> <option value="19">19px</option> <option value="20">20px</option> </select> <!-- End chose font size --> <!-- Chose line height --> <label for="lineHeight" id="lineHeightLabel">Wybierz wysokosc interlini/ odstep miedzy znakami</label> <select id="lineHeight" name="lineHeight"> <option value="8">8px</option> <option value="10">10px</option> <option value="11">11px</option> <option value="12">12px</option> <option value="13">13px</option> <option value="14">14px</option> <option value="15">15px</option> <option value="16">16px</option> <option value="17">17px</option> <option value="18">18px</option> <option value="19">19px</option> <option value="20">20px</option> <option value="21">21px</option> <option value="22">22px</option> <option value="23">23px</option> <option value="24">24px</option> <option value="25">25px</option> <option value="26">26px</option> <option value="27">27px</option> <option value="28">28px</option> <option value="29">29px</option> <option value="30">30px</option> </select> <!-- End chose line height --> <!-- Chose letter spacing --> <select id="letterSpacing" name="letterSpacing"> <option value="1">1px</option> <option value="2">2px</option> <option value="3">3px</option> <option value="4">4px</option> <option value="5">5px</option> <option value="6">6px</option> <option value="7">7px</option> <option value="8">8px</option> <option value="9">9px</option> <option value="10">10px</option> </select> <!-- End chose letter spacing --> <select id="fontStyle" name="fontStyle"> <option value="Normal">Normal</option> <option value="Italic">Italic</option> <option value="Bold">Bold</option> </select> <label for="tekst" id="wprowadz">Wprowadz tekst</label> <input type="button" value="PL" id="PL" onclick="readyTextPL();" /> <input type="button" value="ENG" id="ENG" onclick="readyTextENG();" /> <input type="button" value="Lorem..." id="lorem" onclick="readyTextLorem();" /> <textarea cols="45" rows="5" name="tekst" id="tekst" onclick="clearTextarea();"></textarea> <label for="add" id="addLabel">Dopisz <abbr title="Dopisz do wybranej sekcji">(?)</abbr></label> <input type="checkbox" value="Dodaj" id="add" /> <input type="button" value="Wykonaj" id="wykonaj" onclick="copyText();" /> <input type="button" value="Wyczysc Formularz" id="clear" onclick="clearAll();" /> <input type="submit" value="Zapisz" id="save" class="save" /> <span class="success" style="display:none"> Registration Successfully</span> </form> here's the script file I'm using: Code: // JavaScript Document $('.save').click(function(){ var sections = $('#sections').val(); var fontColor = $('#fontcolor').val(); var bgcolor = $('#bgcolor').val(); var font = $('#font').val(); var fontSize = $('#fontSize').val(); var lineHeight = $('#lineHeight').val(); var letterSpacing = $('#letterSpacing').val(); var fontStyle = $('#fontStyle').val(); //Datastring to pass through var dataString = 'sections=' + sections + '&fontColor' + fontColor + '&bgcolor' + bgcolor + '&font' + font + '&fontSize' + fontSize + '&lineHeight' + lineHeight + '&letterSpacing' + letterSpacing + '&fontStyle' + fontStyle; $.ajax({ type: "POST", url: "update.php", data: dataString, success: function(){ $('#success').fadeIn(200).show();} }); }); any ideas what's wrong? I am trying to get my form which is in PHP to submit when pressing the Enter key This is what I am using Code: <script type="text/javascript"> function submitFormWithEnter(myfield,e) { var keycode; if (window.event) { keycode = window.event.keyCode; } else if (e) { keycode = e.which; } else { return true; } if (keycode == 13) { myfield.form.submit(); return false; } else { return true; } } </script> PHP Code: <div id='aboutForm'> <span class='headerbox'><b>Your Profile Headline:</b></span> <span class='textbox'><input type='text' name='headline' class='zip' size='67 ' value='$headline' onKeyPress="return submitFormWithEnter(this,event)\"></span> </div> Anyway I can get this to work? Seems to be an issue with the "text" input |