JavaScript - Populate Form With Data From Js
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> Similar TutorialsI have two slightly different forms on the same page, but I want the values in form1 to auto populate the same form fields in form2. 1 field is a text field, the rest are drop down menus. How would I accomplish this? Link to tutorial would be much appreciated. Thanks
Hi, I'm working on a menu update form. I'm pulling the existing data from mysql and posting it into a form, using php. This works fine. But now I want the user to be able to modify the data and perform and update query to the database with the changes. I cannot figure out how to get the modified php text box data into my html form text boxes so I can run an update query. I would be ok with a button that transfers the php text box data to the html form data. Hope this is clear what I'm trying to do, seems simple enough, but I can't figure it out. Thanks in advance for any ideas. I want to loop through a form containing various fields and replace them with values I have in a JS object. E.g. (1) <form id="theform"> <input type="text" name="field_1" value="" /> <input type="checkbox" name="field_2" value="" /> </form (2) object.field_1 = "Dave"; object.field_2 = ""; // empty as not checked, else holds value of checked one -- The problem is: what about checkboxes and <select> drop downs, and radios?? Is there a script like this around as I'm guessing this could be useful for Ajax to populate input boxes in some situations (depending on the content etc.) so I'm guessing I'm not the only one who needs this? Hello All, I have a form where the number of input fields (lets call them B through N) is determined by the length of a php array. Above those input fields is another field (lets call this field input A) that I would like to be auto populated based on what the user enters in fields B through N. Here is my code. The first table (with all of the "totals" fields) holds all of the input fields that I would like to auto update. These fields should auto update so that every input in EACH of the "fy" fields in the second table is added together. Example: every input in the id="fy_{$fy.fy}_high_impact_cost" field should be added together as the user enters them, and the id="totals_high_impact_cost" field should be auto updated with that total. Code: <form method="post" name="submit" action="new_item.php" accept-charset='UTF-8'> <table border="box" width="100%"> <tr> <td align="center">$<input id="totals_high_impact_cost" size="3" name="totals_high_impact_cost" maxlength="20" style="text-align: right" />M</td> <td align="center">$<input id="totals_most_likely_impact_cost" size="3" name="totals_most_likely_impact_cost" maxlength="20" style="text-align: right" />M</td> <td align="center">$<input id="totals_low_impact_cost" size="3" name="totals_low_impact_cost" maxlength="20" style="text-align: right" />M</td> <td align="center">$<input id="totals_actual_expense" size="3" name="totals_actual_expense" maxlength="20" style="text-align: right" />M</td> <td align="center">$<input id="totals_high_mitigation_cost" size="3" name="totals_high_mitigation_cost" maxlength="20" style="text-align: right" />M</td> <td align="center">$<input id="totals_most_likely_mitigation_cost" size="3" name="totals_most_likely_mitigation_cost" maxlength="20" style="text-align: right" />M</td> <td align="center">$<input id="totals_low_mitigation_cost" size="3" name="totals_low_mitigation_cost" maxlength="20" style="text-align: right" />M</td> <td align="center">$<input id="totals_cost_in_scope" size="3" name="totals_cost_in_scope" maxlength="20" style="text-align: right" />M</td> <td align="center">$<input id="totals_unfunded_threat" size="3" name="totals_unfunded_threat" maxlength="20" style="text-align: right" />M</td> </tr> </table> {foreach value=fy from=$php_array} <table> <tr> <td align="center">$<input id="fy_{$fy.fy}_high_impact_cost" size="3" name="fy_{$fy.fy}_high_impact_cost" maxlength="20" style="text-align: right" value="{$fy.high_impact_cost}" onchange="update_totals_high_impact_cost()" />M</td> <td align="center">$<input id="fy_{$fy.fy}_most_likely_impact_cost" size="3" name="fy_{$fy.fy}_most_likely_impact_cost" maxlength="20" style="text-align: right" value="{$fy.most_likely_impact_cost}" />M</td> <td align="center">$<input id="fy_{$fy.fy}_low_impact_cost" size="3" name="fy_{$fy.fy}_low_impact_cost" maxlength="20" style="text-align: right" value="{$fy.low_impact_cost}" />M</td> <td align="center">$<input id="fy_{$fy.fy}_actual_expense" size="3" name="fy_{$fy.fy}_actual_expense" maxlength="20" style="text-align: right" value="{$fy.actual_expense}" />M</td> <td align="center">$<input id="fy_{$fy.fy}_high_mitigation_cost" size="3" name="fy_{$fy.fy}_high_mitigation_cost" maxlength="20" style="text-align: right" value="{$fy.high_mitigation_cost}" />M</td> <td align="center">$<input id="fy_{$fy.fy}_most_likely_mitigation_cost" size="3" name="fy_{$fy.fy}_most_likely_mitigation_cost" maxlength="20" style="text-align: right" value="{$fy.most_likely_mitigation_cost}" />M</td> <td align="center">$<input id="fy_{$fy.fy}_low_mitigation_cost" size="3" name="fy_{$fy.fy}_low_mitigation_cost" maxlength="20" style="text-align: right" value="{$fy.low_mitigation_cost}" />M</td> <td align="center">$<input id="fy_{$fy.fy}_cost_in_scope" size="3" name="fy_{$fy.fy}_cost_in_scope" maxlength="20" style="text-align: right" value="{$fy.cost_in_scope}" />M</td> </tr> </table> {/foreach} </form> Please email me at alexhall12315@yahoo.com if you would like more explanation. Thanks in advance for any help!!! =) This form collects info of the customer who wishes to select add-ons that would be applied to their digital photos. Examples of add-ons: Photo makeover Add object or person Crop image Have a look at the form Once a customer selects one of the options (Photo Manipulation or Photo Restoration for example - radio buttons) and then one or more Add-ons (check boxes in the Html form), enter their details and upload a photo, they hit the submit button and it then takes them to the PayPal checkout page where the total amount is shown. (see image below) The Issue: In the PayPal page, it now shows the total amount whichever add-ons you select, however it keeps showing "Add object or person" as well as all the 5 main options (radio buttons on the form) no matter what I select. This will be an issue as I will not know exactly which add-ons the customer has selected. Can someone please help me complete the coding so that the add-ons show on the PayPal checkout page. I look forward to your reply/replies. Kind Regards Rafi p.s: Could this be a possible solution? Even if it is, can someone help by completing the code? In order to send the options/add-ons the customer selects I may need to use the onX and osX variables (Where X is a number starting with 0 and incrementing by 1 see below), These can be used to set options for the add-onsthey select. The onO is the "option name" and os0 is the "option choice". So for example: <input type="hidden" name="on0" value="Photo manipulation"> <input type="hidden" name="os0" value="Whatever add-ons the customer selects"> <input type="hidden" name="on1" value="Photo restoration"> <input type="hidden" name="os1" value="Whatever add-ons the customer selects"> Hi all I have relatively easy task I need to accomplish but as per usual I have very little idea of how to do it. I have done a google search to no avail. Basically I need to: 1. Pull a value from inside a div Code: <div id="number">(invoice #1017)</span> 2. Populate a form input field with that value. Does this make sense? If not let me know if you need any more info. Thanks I would like to set up an image gallery so that when customer clicks on their chosen image, the image caption populates into the associated field in the form below the gallery, on the same page. Any way you know of to do this? I am not really a coder, I only know this and that, so examples or detailed instructions will be most helpful. Thanks very much. Hi All! Thanks in advance to any and all who help me. What we are trying to do is have a form where customers can use a conditional logic based form that upon submission will redirect to checkout with an appropriate product bundle being populated in the shopping cart. I have some experience with creating forms, in fact I have made a decent form that I have modified from an online form builder... the problem is I have no idea how to auto-fill the shopping cart... period. From what I have read in my research this should be a function of Javascript. I have a decent working knowledge of php, and html, but I am pretty clueless when it comes to Javascript, if anyone could point me in the right direction for this project I would really appreciate it. I am working on a page where the user will select a location from a dynamically generated dropdown list. I was able to create the php multidimensional array (tested and working) from a MySql database using the users information at login, but I'm having problems converting it to a javascript multidimensional array. I need to be able to access variables that I can pass to a number of text fields within an html form. For instance, if a user belongs to a company with multiple addresses, I need to be able to let them select the address they need to prepopulate specific text fields. php array creation: Code: if ($row_locations) { while ($row_locations = mysql_fetch_assoc($locations)) { $mail[$row_locations['comp_id']]=array('mailto'=>$row_locations['mailto'], 'madd'=>$row_locations['madd'], 'madd2'=>$row_locations['madd2'], 'mcity'=>$row_locations['mcity'], 'mstate'=>$row_locations['mstate'], 'mzip'=>$row_locations['mzip'], 'billto'=>$row_locations['billto'], 'badd'=>$row_locations['badd'], 'badd2'=>$row_locations['badd2'], 'bcity'=>$row_locations['bcity'], 'bstate'=>$row_locations['bstate'], 'bzip'=>$row_locations['bzip']); } } javascript function - this should create the array and send variables to text fields. Code: function updateAddress() { var mail = $.parseJSON(<?php print json_encode(json_encode($mail)); ?>); { if (comp_id in mail) { document.getElementById('mailto').value=mail.comp_id.mailto.value; document.getElementById('madd').value=mail.comp_id.madd.value; document.getElementById('madd2').value=mail.comp_id.madd2.value; document.getElementById('mcity').value=mail.comp_id.mcity.value; document.getElementById('mstate').value=mail.comp_id.mstate.value; document.getElementById('mzip').value=mail.comp_id.mzip.value; } else { document.getElementById('mailto').value=''; document.getElementById('madd').value=''; document.getElementById('madd2').value=''; document.getElementById('mcity').value=''; document.getElementById('mstate').value=''; document.getElementById('mzip').value=''; } } } Where is this breaking? Thanks in advance. Hi 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> 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 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? 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. 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. 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? 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. Resolution if interested: Code: <head> <title>Lab8</title> <script src="arrays.js" type="text/javascript"></script> <link href="css.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> function amountTotal() { var totalDonations = 0; for (var i = 0; i < amount.length; i++) { totalDonations += amount[i]; } return totalDonations; } </script> </head> <body> <table id="donations" rules="rows"> <tr> <th> Date </th> <th> Name </th> <th> Amount </th> <th> Address </th> </tr> <script type="text/javascript"> for (var i = 0; i < amount.length; i++) { if (i % 2 == 0) document.write("<tr>") else document.write("<tr class='yellowrow'>"); document.write("<td>" + date[i] + "</td>"); document.write("<td>" + firstName[i] + lastName[i] + "</td>"); document.write("<td>" + amount[i] + "</td>"); document.write("<td>" + street[i] + "<br />" + city[i] + "," + " " + state[i] + " " + zip[i] + "</td>"); } document.write("</tr>") </script> </table> <table id="totalsTable"> <tr> <th colspan="2"> Summary </th> </tr> <tr> <td> Contributions </td> <td class="amt"> <script type="text/javascript"> document.write(amount.length); </script> </td> </tr> <tr> <td> Amount </td> <td class="amt">$ <script type="text/javascript"> var totalTotal = amountTotal(); document.write(totalTotal); </script> </td> </tr> </table> </body> </html> I have a seperate .js sheet with some arrays on them (firstName, lastName, date, amount, city, state, zip) and I am trying to populate a table with these indexes. The 'yellowrow' highlights everyother row which is called out in my css sheet. My header rows fill in but not the rest. Here is the link for the site actually posted on the web. Code: <body> <table id="donations" rules="rows"> <tr> <th>Date</th> <th>Name</th> <th>Amount</th> <th>Address</th> </tr> <script type="text/javascript"> for (var i = 0; i < amount.length; i++) { if (i % 2 == 0) document.write("<tr>") else document.write("<tr class='yellowrow'>"); document.write("<td>" + date(i) + "</td>"); document.write("<td>" + firstName(i) + lastName(i) + "</td>"); document.write("<td>" + amount(i) + "</td>"); document.write("<td>" + "<br />" + city(i) + "," + state(i) + zip(i) + "</td>"); } document.write("</tr>") </script> </table> </body> I am trying to populate a listbox using Javascript. The listbox is populated using the xml response from ajax request. Below is the code used for the same Code: var xmlDoc = xmlhttp.responseXML; for (var i = 0; i < xmlDoc.getElementsByTagName("id").length; i++) { traderlists.add(new Option(xmlDoc.getElementsByTagName("name")[i].childNodes[0].nodeValue, xmlDoc.getElementsByTagName("id")[i].childNodes[0].nodeValue)); } This works fine for me. But i am facing performance issue here. some ajax requests retrieves xmls with around 11,000 nodes and this takes too much of time to populate the listbox. Can anyone please advice me with an better solution? Hello, I have a form which asks for some user data and then submits this data and inserts into a mysql database. I wanted to know the best way to validate the form before the data is submittted to the action script. For example, checking form fields to see if they are empty and also making sure no special characters are inserted by the user. The code I have tried is: Code: function checkForm() { var theForm = document.forms.feedback; if (theForm.fname.value == "" || theForm.loc.value="" || theForm.com.value == "") { alert("Please complete all of the form"); } } Working with this form: Code: <form id="feedback" name="feedback" action="php/phpcustom.php" method="POST"> <fieldset> <legend>Gardenable.com Feedback</legend> <p><label for="fname">Name:</label><input type="text" size="30" maxlength="40" id="fname" name="fname" /></p> <p><label for="loc">Location:</label><input type="text" size="30" maxlength="40" id="loc" name="loc" /></p> <p><label for="com">Comments:</label><textarea cols="40" rows="6" maxlength="300" id="com" name="com"></textarea></p> <p><input type="submit" name="send" id="submitbutton" value="Submit" onclick="checkForm()" /><input type="reset" name="reset" value="Reset" /></p> </fieldset> </form> I've added this function to the onclick attribute of the submit input button but it is just submitting the data and not executing. Just wondering if anyone could please explain how to stop the execution of the data being submitted and check the form before doing so. If not could you possibly advise any good sites/links for me to browse to achieve this. regards, LC. |