JavaScript - Form Data From Javascript
Hello,
I used a standard orderform which I expanded. With this form people can order some products. But when I submit the form with data from a javascript the mail is empty. Can anyone help? I am just a beginner.... You can try the form here Thanks in advance! Hein. Similar TutorialsHi guys, Been stuck for a few days with this scenario. Any help? The alert box appears on an error. But the submitting won't stop. The details are submitted and the form is processed. Any help is greatly appreciated... Code: <html> <head> <script type="text/javascript" src="email_helper/jscripts/tiny_mce/tiny_mce.js"></script> <script type="text/javascript"> tinyMCE.init({ // General options mode : "textareas", theme : "simple" }); </script> <script language="javascript"> function MM_openBrWindow(theURL,winName,features) { window.open(theURL,winName,features); } function err_check(){ var email = document.getElementById('to_email').value; if(email.length==0){ alert('Please Enter Email Address'); return false; } var AtPos = email.indexOf("@") var StopPos = email.lastIndexOf(".") if (AtPos == -1 || StopPos == -1) { alert("Please Enter Valid Email Address"); document.getElementById('email').focus(); return false; } email = document.getElementById('cc_email').value; if(email.length != 0){ var AtPos = email.indexOf("@") var StopPos = email.lastIndexOf(".") if (AtPos == -1 || StopPos == -1) { alert("Please Enter Valid Email Address"); document.getElementById('email').focus(); return false; } } var answer = confirm ("Send E-Mail?"); if (!answer){ return false; } } </script> <!-- /TinyMCE --> <style type="text/css"> body, table, td, th{ background-color:#CCCCCC; font-family: Arial; font-size:14px; } .que{ font-weight:bold; } </style> </head> <body> <form method="post" enctype="multipart/form-data"> <?php include 'library/database.php'; include 'library/opendb.php'; $query = mysql_query("SELECT email,contact,mobile FROM users WHERE user_id='$uid'") or die(mysql_error()); $row = mysql_fetch_row($query); $from_email = $row[0]; $from_person = $row[1]; $from_mobile = $row[2]; $query = mysql_query("SELECT customer_id FROM campaign_summary WHERE camp_id='$camp_id'") or die(mysql_error()); $row = mysql_fetch_row($query); $cusid = $row[0]; $query = mysql_query("SELECT email FROM client_info WHERE comp_id='$cusid'") or die(mysql_error()); $row = mysql_fetch_row($query); $toer = $row[0]; include 'library/closedb.php'; ?> <table width="100%" border="0"> <tr><td rowspan="4"><input type="submit" name="send_email" id="send_email" style="height:50px; width:100px;" value="SEND" onClick="return err_check();" /></td><td><span class="que">From : </span></td><td colspan="3"><?php echo $from_email; ?><input type="hidden" name="from_mail" id="from_mail" /><input type="hidden" name="camp_id" id="camp_id" value="<?php echo $camp_id;?>"/></td></tr> <tr><td><span class="que">To : </span></td><td colspan="3"><input name="to_email" id="to_email" style="width:250px;" value="<?php echo $toer;?>"/></td></tr> <tr><td><span class="que">CC : </span></td><td colspan="3"><input name="cc_email" id="cc_email" style="width:250px;"/></td></tr> <tr><td><span class="que">Subject : </span></td><td colspan="3"><input style="width:300px;" name="subject" id="subject" /></td></tr> <tr><td rowspan="1" colspan="2"> </td><td><input type="checkbox" name="ori_pdf" id="ori_pdf" checked /> PDF Quotation</td><td> </td><td> </td></tr><tr><td colspan="2"><span class="que">Credit Application</span></td><td><input type="checkbox" name="corporate" id="corporate"/>Corporate</td><td><input type="checkbox" name="individual" id="individual" />Individual</td><td><input type="checkbox" name="cash" id="cash" />Cash Account</td> </tr> <tr> <td colspan="2" rowspan="3"></td><td><input type="checkbox" name="tabloid" id="tabloid" />Tabloid Example</td> <td><input type="checkbox" name="broadsheet" id="broadsheet" />Broadsheet Example</td></tr> <tr><td><input type="checkbox" name="colmt" id="colmt" />Column Sizes Tabloid</td> <td><input type="checkbox" name="colmb" id="colmb" />Column Sizes Broadsheet</td></tr> <tr><td><input type="checkbox" name="maps" id="maps" />Maps / Distribution</td><td colspan="2" align="right">External Attachments <input id="upload_file" name="upload_file" type="file"/> </td></tr> <tr><td colspan="2"><span class="que">Message :</span></td><td colspan="3"> <textarea id="elm1" name="elm1" rows="15" cols="80" style="width: 100%"> <?php echo "<br><br><br>" . $from_person . "<br>" . $from_mobile; ?> </textarea> </td></tr> </table> </form> </body> </html> HTML: Code: <script src="./include/js/drinkValidation.js" type="text/javascript"></script> <form name="add-drinks" action="include/add-drink.php" method="POST" onSubmit="return addDrinkFormValidation(this);" enctype="multipart/form-data" > <span id="colour" class='modify_form'> <label for='drinkColour'>Spirit Colour:</label> <br /> <select name='drinkColour' tabindex=1> <option value='' >None</option> <option value='R' >R</option> <option value='G' >G</option> <option value='Y' >Y</option> </select> </span> <div class='modify_form'> <label for='drinkType'>Type:</label> <br /> <select name='drinkType' tabindex=1 onChange="HideObjects(this.value)"> <option value="">Select a Drink type:</option> <option value='Cask' >Cask Ales</option> <option value='Guest' >Guest Ale</option> <option value='Lager' >Lager</option> <option value='Bottled Beers' >Bottled Beer</option> <option value='Wines' >Wine</option> <option value='Ciders' >Cider</option> <option value='Softs' >Soft</option> <option value='Spirits' >Spirit</option> </select> </div> <div id="drinkABV" class='modify_form'> <label for='drinkABV'>ABV:</label> <br /> <input name='drinkABV' size='2' tabindex=4 maxlength="4" placeholder="ie: 4.2"/> <label for='drinkABV'>%</label> </div> <div id="name"class='modify_form'> <label for='name'>Name:</label> <br /> <input name='name' size='25' tabindex=3 placeholder="Drink name"/> </div> <div id="drinkInfo" class='modify_form'> <label for='drinkInfo'>Description:</label> <br /> <textarea name='drinkInfo' rows='5' cols='30' maxlength='255' tabindex=5 placeholder="Max 255 characters"></textarea> </div> <div id="pint" class='modify_form'> <label for='drinkPintPrice'>Pint (£):</label> <br /> <input name='drinkPintPrice' size='10' tabindex=8 /> </div> <div id="halfpint" class='modify_form'> <label for='drinkHalfPrice'>Half Pint (£):</label> <br /> <input name='drinkHalfPrice' size='10' tabindex=7 /> </div> <div id="drinkSpecialPrice" class='modify_form'> <label for='drinkSpecialPrice'>Offer Price (£):</label> <br /> <input name='drinkSpecialPrice' size='10'tabindex=6 /> </div> <div id="drinkbottlePrice" class='modify_form'> <label for='drinkbottlePrice'>Bottle/Spirit Price (£):</label> <br /> <input name='drinkbottlePrice' size='10'tabindex=6 /> </div> <br /> <br /> <input type="file" name="cons_image" /> <br /> <br /> <div id='submit'> <input type='submit' value='Add New Drink' /> </div> <br /> <p><b>Please add the information you wish to add then click Add New Drink</b></p> </form> Javascript containing validation Code: var ck_abv = /[0-9]{1,2}\\.[0-9]{1}$/; var ck_price = /[0-9]{1,2}\\.[0-9]{2}$/; var ck_name = /^[A-Za-z0-9 ]{3,20}$/; var ck_info = /^[A-Za-z0-9 ]{3,255}$/; alert ("Im in the file"); function addDrinkFormValidation(form){ var type = form.drinkType.value; var abv = form.drinkABV.value; var name = form.name.value; var info = form.drinkInfo.value; var pint = form.pint.value; var halfpint = form.halfpint.value; var bottle = form.drinkbottleprice.value; var offer = form.drinkSpecialprice.value; var errors = []; alert (form); alert (type); alert (abv); alert (info); alert (pint); alert (halfpint); alert ("Anything showing"); if(type==0){ errors[errors.length] = "Please select a drink type."; } if(!ck_name.test(name) || (name == "")){ errors[errors.length] = "Please enter a drink name."; } if(!ck_info.test(info) || (info == "")){ errors[errors.length] = "Please enter a drink description."; } if(!ck_abv.test(abv)){ errors[errors.length] = "Illegal character in ABV"; } if(!ck_price.test(pint)){ errors[errors.length] = "Illegal character in pint"; } if(!ck_price.test(halfpint)){ errors[errors.length] = "Illegal character in halfpint"; } if(!ck_price.test(bottle)){ errors[errors.length] = "Illegal character in Bottle/Spirit Price"; } if(!ck_price.test(offer)){ errors[errors.length] = "Illegal character in Offer price"; } if (errors.length > 0) { reportErrors(errors); return false; } return false; } function reportErrors(errors){ var msg = "Please Enter Valid Data...\n"; for (var i = 0; i<errors.length; i++) { var numError = i + 1; msg += "\n" + numError + ". " + errors[i]; } alert(msg); } For some reason i dont know why the javascript isnt reading the function even tho they are correctly named, the file is being read as the 1st test alert comes up. the 2nd one inside the function doesnt know. can anyone point in the right place or show me where i am going wrong. as you can see i have put both my entire form and and the java file up. so you can easily see what goes on #on a note i have multiple forms in a tab system if that has anything to do with it although i shouldnt see why it should. #oh and did i get my regex correct for ck_price e.g "9.99 or 10.99" and ck_abv eg "4.2 or 10.2 or 34" #im also using wampserver 2.1 with win7 and chrome if it's needed thanks ste I want to use Javascript to submit a form - without filling the form in physically Is this possible? Let's say a web page has a form that submit First Name and Last Name to the next page Instead of filling in the form and hitting submit, can I submit the data in variables and call the next page somehow using Javascript? Thanks OM Hello, Im pretty new at JavaScript still, and I am trying to add cookies to a page of my website, so that what is entered into form fields, is retained for future visits. Below is my code, and I am scratching my head as to why it is not working for me! I have viewed a few different cookie tutorials, and so far trying to shape them around what I am seeking, is leading me to my broken code. Javascript: Code: var today = new Date(); var expiry = new Date(today.getTime() + 100 * 24 * 3600 * 1000); function setCookie(name, value) { document.cookie=name + "=" + escape(value) + "; path=/; expires=" + expiry.toGMTString(); } function storeValues(form) { setCookie("name", contact.name.value); setCookie("email", contact.email.value); setCookie("phone", contact.phone.value); return true; } if(name = getCookie("name")) document.contact.name.value = name; if(email = getCookie("email")) document.contact.email.value = email; if(phone =getCookie("phone")) document.contact.phone.value = phone; HTML for the Form Code: <form action="mailto:ksim@dbk.com" method="POST" name="contact" onsubmit="return validateForm();" > <ul> <li> <strong>Name<font color="#5fb81e">*</font></strong> <div><input type="text" size="25" name="name" /></div> </li> <li> <strong>E-mail Address<font color="#5fb81e">*</font></strong> <div><input type="text" size="25" name="email" /></div> </li> <li> <strong>Phone Number<font color="#5fb81e">*</font></strong> <div><input type="text" size="25" name="phone" /></div> </li> <li> <strong>Prefered Type of Contact?<font color="#5fb81e">*</font></strong> <div><input type="radio" name="contact" value="email" id="contactem" /> E-mail<br /> <input type="radio" name="contact" value="phone" id="contactph" /> Phone</div> </li> <li> <strong>Reason For Contact?</strong> <div><input type="checkbox" name="reason" value="showinfo" />Show Information<br /> <input type="checkbox" name="reason" value="groupinfo" />Group Information<br /> <input type="checkbox" name="reason" value="collab" /> Collaboration<br /> <input type="checkbox" name="reason" value="misc" />Misc </div> </li> <li> <strong>What Are You Contacting About?<font color="#5fb81e">*</font></strong> <div><textarea name="message" rows="7" cols="28"></textarea></div> </li> <li> <strong></strong> <div><input type="button" value="Save" conclick="setCookie();"/><button type="reset">Reset</button><button type="submit">Submit</button> </div> </li> </ul> If anyone has some tips to point me in the right direction, and let me see the error of my ways (pun totally intended) I would appreciate it. Hello Friends In my jsp,Struts project i am using the javascript calendar control for selecting the date and by using function calcage() i am calculating the age of the user but problem occurs when the page refreshes OR when user updated the other values such as name ,contact no. Then the value of the age is set as 0 in the textfield as 0 So can you please tell me why this problem occurs And please give me solution 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); } } } I'm a long time lurker on here just barely created an account to ask this question. I work at a call center, and we use different webapps to fill out tickets. One I've used for a long time allows dynamically updating forms with javascript. I have a whole bunch of bookmarked javascript injections like: Code: javascript:if((top.detail.findObj('X31').value="Inquiry")!=""); That code will fill out most everything in that ticket, leaving me to fill in the details. I have one of those for all of the most common tickets, and can create and finish a ticket in less than 30 seconds when it takes others 3-4 minutes. I recently switched to a different system and I'm having trouble with my code. I'm a noob at javascript for sure, but I'm not new to programming. Anyway any pointers would be nice. The system we use doesn't allow me to see the source... I'm not sure how to explain it. It loads everything in a frame. In chrome I can right click then inspect element and get the ID but it the above javascript doesn't work. Examples: Old app source ex: Code: <label for="X31">Category:</label> was all i needed new app(before the body code is just code for the login form, etc): Code: <body onLoad="startit()" onUnload="stopit()"> </body> <div align="center" valign="center" id="LoadMessageID" style="position: relative; top:40%; color:#0069A5; font-size:100% ;"> <img src="/arsys/shared/images/Progress_NonModal-circle.gif" alt="wait image"/> Loading... </div> </html> formloader: Code: <form name="form1" action="/arsys/forms/bmcitsm/HPD:Incident+Management+Console/Default+User+View+(Support)/?cacheid=a22a36a8" method="post"> example of inspect element in chrome (something i want to change with javascript injection): Code: <input id="arid301602600" type="text" class="text " style="top:0; left:0; width:225; height:21;" readonly=""> i have know that JavaScript the data types are either:Primitive (number", "string", "boolean", "undefined",null), or Non-primitive (objects). but why the return values of using typeof can be "function"? i feel this collide with the above. hello i am trying to fire a form which after the call to retrieve the data, populate the form with the data. i can see from firebug that the json data is being captured, but cannot seem to be able to populate the form with it. i am using a jquery plugin facybox, that opens the form, but the fields are blank. i have attached my code and would be grateful if someone could tell me where i am going wrong? many thanks js code Code: <script type="text/javascript"> function edit(com, grid) { if (com == 'Edit') { if($('.trSelected').length>0){ if($('.trSelected').length>1){ alert('Please select just one row'); return; } var items = $('.trSelected'); var itemlist =''; for(i=0;i<items.length;i++){ itemlist+= items[i].id.substr(3); } $.ajax({ type: "POST", dataType: "json", url: "tempcontact.php", data: "items="+itemlist, success: function(data){ document.getElementById('id').value = data.id; document.getElementById('email').value = data.email; $("#flex1").flexReload(); } }); /*and so on then you can call facybox*/ jQuery.facybox({ div: "#editform"}); } else{ alert('Please select a row to edit.'); } } } </script> form Code: <div id="editform" style="display:none;"> <form action="conedit.php" method="post" class="webform"> <fieldset> <legend><span>Update Contact</span></legend> <br /> <div id="dataText">Please delete the fields if there is no data 'No data to display'.</div> <label for="id">ID:</label> <input id="id" name="id" class="text" type="text" value="" /> <label for="name">Full Name:</label> <input id="name" name="name" class="text" type="text" value="" /> <label for="email">Email address:</label> <input id="email" name="email" class="text" type="text" value="" /> <label for="phone">Telephone:</label> <input id="phone" name="phone" class="text" type="text" value="" /> <label for="mobile">Mobile:</label> <input id="mobile" name="mobile" class="text" type="text" value="" /> <label for="fax">Fax:</label> <input id="fax" name="fax" class="text" type="text" value="" /> <label for="notes">Notes:</label> <textarea name="notes" cols="25" rows="3"></textarea> </fieldset> <input class="submit" type="submit" name="submit" value="Update" /> </form> </div> I have a long survey form and once its submitted it gets recorded into a database. I would love to be able to save a PDF version of the HTML form with all their radio buttons and textfields filled out at the same time its submitted. It would need a unique name that matches their record in the database (maybe it pulls the data that was entered into one of the form fields for the name). Whether it gets uploaded to an ftp or just emailed to a mailbox doesn't really matter. The purpose of this is to basically have a visual interpretation of the data by a single user. Is something like this even possible? Hi, I have a rather complicated problem for me as it involves both php and js. And I'm getting lost... Let me explain: On a page, order.html, I have a form including the following fields: - name - comment When posted, it is linked to request.php and request.validation.js, to end up on confirmation.php. On confirmation.php, I would like to reuse the information entered in the fields on order.php (name, email, comment) to display them on the page. My issue I can't find how to 'take them along' in request.php / request.validation.js to confirmation.php where I'm trying to display them with : Code: Contact: <span id="name"><?php echo($_POST['name']); ?></span> etc. For reference, here are my files request.php and request.validation.js: PHP Code: <?php // CONFIGURATION -------------------------------------------------------------- // This is the email where the contact mails will be sent to. $config['recipient'] = 'mail@mail.com'; // This is the subject line for contact emails. // The variable %name% will be replaced with the reference ordered. $config['subject'] = 'Website enquiry from %name%'; // These are the messages displayed in case of form errors. $config['errors'] = array ( 'no_name' => 'Veuillez entrer votre nom.', 'no_email' => 'Votre adresse email est requise.', 'invalid_email' => 'Votre adresse email n est pas valide.', ); // END OF CONFIGURATION ------------------------------------------------------- // Ignore non-POST requests if ( ! $_POST) exit('Nothing to see here. Please go back to the site.'); // Was this an AJAX request or not? $ajax = (isset($_SERVER['HTTP_X_REQUESTED_WITH']) AND strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest'); // Set the correct HTTP headers header('Content-Type: text/'.($ajax ? 'plain' : 'html').'; charset=utf-8'); // Extract and trim contactform values $name = isset($_POST['name']) ? trim($_POST['name']) : ''; $email = isset($_POST['email']) ? trim($_POST['email']) : ''; $comment = isset($_POST['comment']) ? trim($_POST['comment']) : ''; // Take care of magic quotes if needed (you really should have them disabled) set_magic_quotes_runtime(0); if (get_magic_quotes_gpc()) { $name = stripslashes($name); $email = stripslashes($email); $comment = stripslashes($comment); } // Initialize the errors array which will also be sent back as a JSON object $errors = NULL; // Validate name if ($name == '' || strpos($name, "\r") || strpos($name, "\n")) { $errors['name'] = $config['errors']['no_name']; } // Validate email if ($email == '') { $errors['email'] = $config['errors']['no_email']; } elseif ( ! preg_match('/^[-_a-z0-9\'+*$^&%=~!?{}]++(?:\.[-_a-z0-9\'+*$^&%=~!?{}]+)*+@(?:(?![-.])[-a-z0-9.]+(?<![-.])\.[a-z]{2,6}|\d{1,3}(?:\.\d{1,3}){3})(?::\d++)?$/iD', $email)) { $errors['email'] = $config['errors']['invalid_email']; } // Validation succeeded if (empty($errors)) { // Prepare subject line $subject = str_replace('%name%', $name, $config['subject']); // Set date $todayis = date("l, F j, Y") ; // Prepare message $message = "Date: $todayis Nom: $name email: $email Commentai $comment"; // Additional mail headers $headers = 'Content-Type: text/plain; charset=utf-8'."\r\n"; $headers .= 'From: '.$email; // Send the mail if ( ! mail($config['recipient'], $subject, $message, $headers)) { $errors['server'] = 'Server problem'; } } if ($ajax) { // Output the possible errors as a JSON object echo json_encode($errors); } else { // Show a simple HTML feedback message in case of non-javascript support if (empty($errors)) { header('Location: ../steps/confirmation.php'); } else { echo '<h2>Oups!</h2>'; echo '<ul><li>'; echo implode('</li><li>', $errors); echo '</li></ul>'; echo '<br><br><a href="javascript:history.back(-1);">Retour</a>'; } } Code: /* * Request Form Validation v1.0 * By Simon Bouchard <www.simonbouchard.com> * You need at least PHP v5.2.x with JSON support for the live validation to work. */ jQuery(document).ready(function(){ jQuery('#requestform').submit(function() { // Disable the submit button jQuery('#requestform input[type=submit]') .attr('value', 'Send...') .attr('disabled', 'disabled'); // AJAX POST request jQuery.post( jQuery(this).attr('action'), { name:jQuery('#name').val(), email:jQuery('#email').val(), comment:jQuery('#comment').val(), }, function(errors) { // No errors if (errors == null) { document.location.href="confirmation.php"; } // Errors else { // Re-enable the submit button jQuery('#requestform input[type=submit]') .removeAttr('disabled') .attr('value', 'Envoyer'); // Technical server problem, the email could not be sent if (errors.server != null) { alert(errors.server); return false; } // Empty the errorbox and reset the error alerts jQuery('#requestform .errorbox').html('<ul></ul>').show(); jQuery('#requestform li').removeClass('alert'); // Loop over the errors, mark the corresponding input fields, // and add the error messages to the errorbox. for (field in errors) { if (errors[field] != null) { jQuery('#' + field).parent('li').addClass('alert'); jQuery('#requestform .errorbox ul').append('<li>' + errors[field] + '</li>'); } } } }, 'json' ); // Prevent non-AJAX form submission return false; }); }); Thanks for your help. M. Basically I have comments posted on articles and I want to allow users to report them if they find inappropriate content. I want them to be able to click on icon on the comment which will open up a pop-up. Then in the pop-up they can type why they are reporting the comment. Code: <script type="text/javascript"> function popup() { Report = window.open('/report.php','Report','width=350, height=400'); document.reportform.submit(); } </script> <form action="/report.php" name="reportform" method="post" target="Report"> <input type="hidden" name="reporter_id" value = "<?php echo $user_id; ?>" /> <input type="hidden" name="reported_id" value="<?php echo $row['uid'] ?>" /> <input type="hidden" name="comment_id" value="<?php echo $row['id'] ?>" /> <a href="#" name="reportform" class="submit" onclick="return popup();"> Report</a></form> I've been messing with this code for a while now. This code successfully brings up the pop-up, but it doesn't transfer the form data. My main coding language is PHP, and I'm in the process of learning Javascript. Can anyone help? I am trying to get around using server side scripting for an issue on a webpage. I have a basic html form like this: Code: <html> <body> <FORM NAME="myform" ACTION="" METHOD="GET">Enter something in the box: <BR> <INPUT TYPE="text" NAME="inputbox" VALUE=""><P> <INPUT TYPE="button" NAME="button" Value="Click" onClick="testResult (this.form)"> </body> </html> I know I can use JavaScript to capture the data like this: Code: function testResults (form) { var TestVar = form.inputbox.value; alert ("You typed: " + TestVar); } Instead of alerting it, can I save the data in an iframe? Will it stay there once they leave the page? I want the iframe to eventually contain info from lots of people's answers. I am wanting to simulate saving the answers to a text file on the server. I am working on my form. Once user put data in the form, I want to save it as cookie and display it in another page as form processor. In my html file therefore, I have Code: <form id="frmBuyer" method="get" action="FormProcessor_Cookies.html" enctype="application/x-www-form-urlencoded" onsubmit="return validate();" onreset="location.reload();"> which is basically validate all the data and once it meets the requirement, it goes to FormProcessor_Cookies.html. So, i put a function in my js file to get all the data as cookie as following. Code: function createCookie(){ document.cookie = first + "=" + encodeURIComponent(document.forms[0].FirstName.value); document.cookie = last + "=" + encodeURIComponent(document.forms[0].LastName.value); document.cookie = phone1 + "=" + encodeURIComponent(document.forms[0].PhoneA.value); document.cookie = phone2 + "=" + encodeURIComponent(document.forms[0].PhoneB.value); document.cookie = phone3 + "=" + encodeURIComponent(document.forms[0].PhoneC.value); document.cookie = email + "=" + encodeURIComponent(document.forms[0].Email.value); location.href = "cookie.html"; } and I called this function after it validates. Code: function validate(){ var blnError = false; var zip = document.getElementById("Zip").value; var textBoxthree = document.getElementById("third"); var textLengththree = textBoxthree.value.length; var textBoxtwo = document.getElementById("second"); var textLengthtwo = textBoxtwo.value.length; var textBoxone = document.getElementById("first"); var textLengthone = textBoxone.value.length; var patternZip = new RegExp("^([0-9]){5}(([ ]|[-])?([0-9]){4})?$"); if (document.forms[0].Zip.value == ""||!patternZip.test(document.forms[0].Zip.value)){ document.getElementById('E_Zip').style.display="inline"; document.forms[0].Zip.focus(); document.forms[0].Zip.style.backgroundColor="lemonchiffon" blnError = true; } else{ document.getElementById('E_Zip').style.display="none"; document.forms[0].Zip.style.backgroundColor="white" } var patternCity = new RegExp("^(?:[a-zA-Z]+(?:[.'\-,])?\s?)+$"); if (document.forms[0].City.value == ""||!patternCity.test(document.forms[0].City.value)){ document.getElementById('E_City').style.display="inline"; document.forms[0].City.focus(); document.forms[0].City.style.backgroundColor="lemonchiffon" blnError = true; } else{ document.getElementById('E_City').style.display="none"; document.forms[0].City.style.backgroundColor="white" } var patternAddress = new RegExp("^[a-zA-Z]+.*|.*[a-zA-Z]+|.*[a-zA-Z]+.*$"); if (document.forms[0].Address1.value == ""||!patternAddress.test(document.forms[0].Address1.value)){ document.getElementById('E_Address1').style.display="inline"; document.forms[0].Address1.focus(); document.forms[0].Address1.style.backgroundColor="lemonchiffon" blnError = true; } else{ document.getElementById('E_Address1').style.display="none"; document.forms[0].Address1.style.backgroundColor="white" } var patternConfirm = new RegExp("^[_a-zA-Z0-9\\-]+(\.[_a-zA-Z0-9\\-]+)*@[a-zA-Z0-9\\-]+(\.[a-aZ-Z0-9\\-]+)*(\.[a-z]{2,3})$"); if (document.forms[0].ConfirmEmail.value == "" ||!patternConfirm.test(document.forms[0].ConfirmEmail.value) ||document.forms[0].ConfirmEmail.value != document.forms[0].Email.value){ document.getElementById('E_ConfirmEmail').style.display="inline"; document.forms[0].ConfirmEmail.focus(); document.forms[0].ConfirmEmail.style.backgroundColor="lemonchiffon" blnError = true; } else{ document.getElementById('E_ConfirmEmail').style.display="none"; document.forms[0].ConfirmEmail.style.backgroundColor="white" } var patternEmail = new RegExp("^[_a-zA-Z0-9\\-]+(\.[_a-zA-Z0-9\\-]+)*@[a-zA-Z0-9\\-]+(\.[a-aZ-Z0-9\\-]+)*(\.[a-z]{2,3})$"); if (document.forms[0].Email.value == ""||!patternEmail.test(document.forms[0].Email.value)){ document.getElementById('E_Email').style.display="inline"; document.forms[0].Email.focus(); document.forms[0].Email.style.backgroundColor="lemonchiffon" blnError = true; } else{ document.getElementById('E_Email').style.display="none"; document.forms[0].Email.style.backgroundColor="white" } var patternPhoneA = new RegExp("^\\d{3}$"); var patternPhoneB = new RegExp("^\\d{3}$"); var patternPhoneC = new RegExp("^\\d{4}$"); if(patternPhoneC.test(document.forms[0].PhoneC.value) &&patternPhoneB.test(document.forms[0].PhoneB.value) &&patternPhoneA.test(document.forms[0].PhoneA.value)){ document.getElementById('E_Phone').style.display="none"; } if(patternPhoneC.test(document.forms[0].PhoneC.value)){ document.forms[0].PhoneC.style.backgroundColor="white"} if(patternPhoneB.test(document.forms[0].PhoneB.value)){ document.forms[0].PhoneB.style.backgroundColor="white"} if(patternPhoneA.test(document.forms[0].PhoneA.value)){ document.forms[0].PhoneA.style.backgroundColor="white"} if (!patternPhoneC.test(document.forms[0].PhoneC.value)){ document.getElementById('E_Phone').style.display="inline"; document.forms[0].PhoneC.focus(); document.forms[0].PhoneC.style.backgroundColor="lemonchiffon" } if (!patternPhoneB.test(document.forms[0].PhoneB.value)){ document.getElementById('E_Phone').style.display="inline"; document.forms[0].PhoneB.focus(); document.forms[0].PhoneB.style.backgroundColor="lemonchiffon" } if (!patternPhoneA.test(document.forms[0].PhoneA.value)){ document.getElementById('E_Phone').style.display="inline"; document.forms[0].PhoneA.focus(); document.forms[0].PhoneA.style.backgroundColor="lemonchiffon" } var patternLast = new RegExp("^[a-zA-Z]+.*|.*[a-zA-Z]+|.*[a-zA-Z]+.*$"); if (document.forms[0].LastName.value == ""||!patternLast.test(document.forms[0].LastName.value)){ document.getElementById('E_LastName').style.display="inline"; document.forms[0].LastName.style.backgroundColor="lemonchiffon" blnError = true; } else{ document.getElementById('E_LastName').style.display="none"; document.forms[0].LastName.style.backgroundColor="white" } var patternFirst = new RegExp("^[a-zA-Z]+.*|.*[a-zA-Z]+|.*[a-zA-Z]+.*$"); if (document.forms[0].FirstName.value == ""||!patternFirst.test(document.forms[0].FirstName.value)){ document.getElementById('E_FirstName').style.display="inline"; document.forms[0].FirstName.style.backgroundColor="lemonchiffon" blnError = true; } else{ document.getElementById('E_FirstName').style.display="none"; document.forms[0].FirstName.style.backgroundColor="white" } if (blnError == true){ document.getElementById('E_Alert').style.display="inline"; return false; } else { document.getElementById('E_Alert').style.display="none"; createCookie(); return true; } } Lastly, I tried to display all the cookies in my "FormProcessor_Cookies.html" page Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta name="author" content="" /> <meta name="description" content="Home" /> <meta name="keywords" content="Client Side Programming, JavaScript, CSS" /> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <meta http-equiv="Content-Language" content="en-us" /> <link rel="stylesheet" href="javascript.css"/> <script type="text/javascript" src="shopping.js"></script> <title>Homepage::Seunghun Jun</title> </head> <body> <div id="container"> <!-- Begin web page --> <div id="header"><!-- Header and Navigation --> <!-- Page Heading --><!-- Navigation --> <script type="text/javascript"> displayHeader(); </script> <br/><br/><br/><br/> </div> <div id="content"> <!-- Main Content --><div id="submited"> <script type="text/javascript"> /* <![CDATA[ */ document.write(documetn.cookie;); /* ]]> */ </script></div> </div><br/><br/><br/><br/> <div id="footer"> <!-- Footer --> <!-- Begin Footer Div--> <script type="text/javascript">displayFooter();</script> <!-- End Footer Div --> </div> <!--End web page --> </div> </body> </html> And its not showing any messages...I know I am asking to much...but could any expert can help me what is wrong and how I can fix this? I have some data on the client side in javascript arrays that I display to user in a html table on the webpage. I want to give an option to the user to save the data in excel. I thought of a solution that involves: 1. Create an http request and post the data as json 2. On server using jsp convert the json data to html table 3. Set the response headers to open the response in excel This solution works, but does not look optimal. Why to send a http request to server when all the data is there on client side. I tried creating a new document on the client side and open that in a new window. That does not open the document in excel as the response header is not set. Any suggestions on how to achieve this. I want to avoid http request to server. Thanks, Pawinder I wants to access server web page which data is continuously growing(streaming data), I want to buffered some of that data write it in responseText then again get next buffered data write it and so on (in AJAX). Is it possible? if yes how to do that? i have a web service at this url http://196.218.16.133/onlinereservat...p=HotelsSearch i use hotel search file with HotelSearch method and method will retrieve xml file contains the matched data. the varialbe that i made post with it is named : HotelData the data of the variable is a string file that contains an xml data like this Code: <HotelsParameters> <CityID>388</CityID> <UserName>admin</UserName> <UserPassword>admin</UserPassword> <DateFrom>4/12/2010</DateFrom> <DateTo>4/13/2010</DateTo> <NumberOfRooms>2</NumberOfRooms> <Room> <RoomSerial>1</RoomSerial> <Adults>1</Adults> <Child> <ChildSerial>1</ChildSerial> <ChildAge>5</ChildAge> </Child> </Room> <Room> <RoomSerial>2</RoomSerial> <Adults>2</Adults> <Child> <ChildSerial>1</ChildSerial> <ChildAge>8</ChildAge> </Child> </Room> <Room> <RoomSerial>3</RoomSerial> <Adults>3</Adults> <Child> </Child> </Room> <CurrencyID>162</CurrencyID> </HotelsParameters> i am trying to get the result by posting HotelData but i did not get the xml result file so can anyone help me my code is: Code: <script language="JavaScript"> function InitializeService() { service.useService("http://196.218.16.133/onlinereservation/service.asmx?WSDL", "HotelsSearch"); } var StrSearch; function GetAge() { StrSearch = document.DemoForm.StringSearch.value; service.HotelsSearchService.callService("HotelsSearch", StrYear); } function ShowResult() { alert(event.result.value); } </script> <form name="DemoForm"> Hotel Name : <input type="text" name="HotelData"/><br /> <button onclick="GetAge()">Get Age</button><br /> </form> the data in input filed is the previous xml file Hi guys I d like to know that is it possible to submit data to the server or to an email from the client using JAVAScript? I know that javascript is clientside,but if you work with Facebook, when you chat, just view its source, u ll see that is using Javascript? I d like to know,how is it possible? Please help ... bit urgent I am creating a small automated system where front-end is html query form and back-end database is MS excel. both at local PC only & in a single folder. problem is like a survey form. continuous data entry, error correction, read/wite all these are included. I created a program upto first entry; but the second, third, ... entries and it is continuous. pl help me regards K.Kaniraj |