JavaScript - Help Needed With 'simple' Seo Javascript Form
Hi Coders...
I'm building a 'really simple' JavaScript program to help editors write SEO-friendly META titles and META descriptions. The idea is you have 3 text boxes, each on a separate line: BOX 1 - META TITLE [ i.e. "Cool website page" ] BOX 2 - FILE NAME [ i.e. "This is a really cool web page about cool stuff"] BOX 3 - META DESCRIPTION [ i.e. "cool-web-page" ] As the editor types in the boxes, a serp listing is displayed as it would appear on Google (and ideally how it would appear on Bing and Yahoo): Cool website page www.coolwebsite.com/cool-web-page This is a really cool web page about cool stuff Kudos to any one who could point a JavaScript newbie in the right direction Similar TutorialsI have a page with options, and I need to hide options unless a certain choice is selected. So say you have a select box for male and female, if they select male, I need it to show male options, and if they select female, it shows female options. How can I hide things until selected and then show the textboxes and stuff? Thank you! I will be completely up front about this, its school work. At the end of a basic html class I missed several classes for family reasons and missed just about everything on Javascript. The book we used basically didnt cover anything over it, was all in class learning I missed. Anyone who could help would be so helpful. One function is partial, one is blank, thats what is supposed to be added/corrected to the following code Code: <html> <head> <script language="javascript" type="text/javascript"> function processScore() { var score = 0; if ( ...checked) {score = score + 1;} if (...checked) {score = score + 1;} document.answerForm.score.value = score; // Display the correct answers document.answerForm.answer1.value = " "; // put the correct value here document.answerForm.answer2.value = " "; // put the correct value here } //End of function processScore function clearForm() { // using the a javascript method clear all forms } </script> </head> <body style="font-family:tahoma; font-size:15px; line-height:200%; width:80%; margin-left:auto; margin-right:auto;"> <hr color="red" width="60%" size="5"> <form name="question1" id="question1"> 1. Which of the following is the document considered to be?<br/> <input type = "radio" name="choiceRB"> a. object<br /> <input type = "radio" name="choiceRB"> b. property<br /> <input type = "radio" name="choiceRB"> c. method<br /> </form> <hr color="green" width="60%" size="5"> <form name="question2" id="question2"> 2. Which method of the window can be used to display a message to the user?<br/> <input type = "radio" name="choiceRB"> a. display()<br /> <input type = "radio" name="choiceRB"> b. message()<br /> <input type = "radio" name="choiceRB"> c. alert()<br /> </form> <hr color="red" width="60%" size="5"> <input type="button" value="Grade the Quiz" onclick=?> <input type="button" value="Start Over" onclick=?> <form name="answerForm" id="answerForm"> <p><strong>Correct Answers:</strong><br/></p> Question 1: <input type="text" name="answer1" size="1"><br /> Question 2: <input type="text" name="answer2" size="1"><br /> <p>You scored <input type="text" name="score" size = "1"> out of 2</p> </form> <br /> </body> </html> thnx in advance to anyone who can help Problem solved thanks to Philip M. ____________________________________________________________________________________ Here is the source code: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <HTML> <HEAD> <TITLE>Order Forms</TITLE> <SCRIPT> /******************************* Form Calculations ************************************/ function calculate(fld, price) { // fld will equal pw1 or pe1 var dir = fld.name.charAt(1); // used to determine whether it is the East or West Form var num = fld.name.charAt(2); // what Item number is it var quant = fld.options[fld.selectedIndex].value; // how many of the items did the User choose var subtotal = eval(quant * price); // the eval converts a string to an Object property - in this case the value // dir = East or West & num = Item number // with this information we can post the result to appropriate Form & // to the appropriate Field on the Form eval('document.order.t' + dir + num).value = fix(subtotal); var total = 0; // this loop sums the totals for each of the Items to give us the Grand Total for that Form for (i = 1; i < 11; i++) { // does that particular Item have a "total" - in other words did the User choose this Item var itemTotal = eval('document.order.t' + dir + i).value; // total is a running sum of the Form's "subtotals" if (parseFloat(itemTotal) > 0) total += parseFloat(itemTotal); } // prior to sticking in the Grand Total into the Total Field we need to "dollarize" the number eval('document.order.total' + dir ).value = fix(total); } // a number like 6.6 should ultimately read as $6.60 and not $6.6 // a number like 6.6275 should ultimately read as $6.63 // the fix(total) function takes care of these particular problems function fix(total) { // ie, total == 6.6275 var dollars = Math.floor(total); // dollars = 6 // browsers sometimes have rounding errors - 662.75 - 600 = 62.75 var cents = (total * 100) - (dollars * 100); cents = Math.round(cents); // 63 if (cents < 10) cents = "0" + cents; // .998 will become 1.00 so we need to increment the dollar value by one if (cents == 100) dollars++; // if cents equal 0 then dollars equal total or total + 1 incase of .998 if (dollars == total || dollars == Math.floor(total) + 1) cents = "00"; total = dollars + "." + cents; // 6.63 return total; } /******* End of Form Calculations ********/ </SCRIPT> </HEAD> <BODY BGCOLOR="#FFFFFF"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td><form action="sendemail.php" method="post" name="order" id="order" onSubmit="return ValidateInput(this)"></td> <td><input type="hidden" name="Formulaire de commande site Pain et Passion" value=""></td> <td></td> <td></td> </tr> <tr> <td>Product</td> <td>Price</td> <td>Quantity</td> <td>Total</td> </tr> <tr> <td>Item 1</td> <td>1.99</td> <td><SELECT NAME="pw1" SIZE="1" ONCHANGE="calculate(this, 1.99)"> <OPTION VALUE="0">0</OPTION> <OPTION VALUE="1">1</OPTION> <OPTION VALUE="2">2</OPTION> <OPTION VALUE="3">3</OPTION> <OPTION VALUE="4">4</OPTION> <OPTION VALUE="5">5</OPTION> <OPTION VALUE="6">6</OPTION> <OPTION VALUE="7">7</OPTION> <OPTION VALUE="8">8</OPTION> <OPTION VALUE="9">9</OPTION> <OPTION VALUE="10">10</OPTION> <OPTION VALUE="11">11</OPTION> <OPTION VALUE="12">12</OPTION> <OPTION VALUE="13">13</OPTION> <OPTION VALUE="14">14</OPTION> <OPTION VALUE="15">15</OPTION> <OPTION VALUE="16">16</OPTION> <OPTION VALUE="17">17</OPTION> <OPTION VALUE="18">18</OPTION> <OPTION VALUE="19">19</OPTION> <OPTION VALUE="20">20</OPTION> </SELECT></td> <td><INPUT TYPE="text" NAME="tw1" SIZE="10" VALUE></td> </tr> <tr> <td>Item2</td> <td>2.99</td> <td><SELECT NAME="pw2" SIZE="1" ONCHANGE="calculate(this, 2.99)"> <OPTION VALUE="0">0</OPTION> <OPTION VALUE="1">1</OPTION> <OPTION VALUE="2">2</OPTION> <OPTION VALUE="3">3</OPTION> <OPTION VALUE="4">4</OPTION> <OPTION VALUE="5">5</OPTION> <OPTION VALUE="6">6</OPTION> <OPTION VALUE="7">7</OPTION> <OPTION VALUE="8">8</OPTION> <OPTION VALUE="9">9</OPTION> <OPTION VALUE="10">10</OPTION> <OPTION VALUE="11">11</OPTION> <OPTION VALUE="12">12</OPTION> <OPTION VALUE="13">13</OPTION> <OPTION VALUE="14">14</OPTION> <OPTION VALUE="15">15</OPTION> <OPTION VALUE="16">16</OPTION> <OPTION VALUE="17">17</OPTION> <OPTION VALUE="18">18</OPTION> <OPTION VALUE="19">19</OPTION> <OPTION VALUE="20">20</OPTION> </SELECT></td> <td><INPUT TYPE="text" NAME="tw2" SIZE="10" VALUE></td> </tr> <tr> <td>item3</td> <td>3.99</td> <td><SELECT NAME="pw3" SIZE="1" ONCHANGE="calculate(this, 3.99)"> <OPTION VALUE="0">0</OPTION> <OPTION VALUE="1">1</OPTION> <OPTION VALUE="2">2</OPTION> <OPTION VALUE="3">3</OPTION> <OPTION VALUE="4">4</OPTION> <OPTION VALUE="5">5</OPTION> <OPTION VALUE="6">6</OPTION> <OPTION VALUE="7">7</OPTION> <OPTION VALUE="8">8</OPTION> <OPTION VALUE="9">9</OPTION> <OPTION VALUE="10">10</OPTION> <OPTION VALUE="11">11</OPTION> <OPTION VALUE="12">12</OPTION> <OPTION VALUE="13">13</OPTION> <OPTION VALUE="14">14</OPTION> <OPTION VALUE="15">15</OPTION> <OPTION VALUE="16">16</OPTION> <OPTION VALUE="17">17</OPTION> <OPTION VALUE="18">18</OPTION> <OPTION VALUE="19">19</OPTION> <OPTION VALUE="20">20</OPTION> </SELECT></td> <td><INPUT TYPE="text" NAME="tw3" SIZE="10" VALUE></td> </tr> <tr> <td>Item3</td> <td>1.99</td> <td><SELECT NAME="pw4" SIZE="1" ONCHANGE="calculate(this, 1.99)"> <OPTION VALUE="0">0</OPTION> <OPTION VALUE="1">1</OPTION> <OPTION VALUE="2">2</OPTION> <OPTION VALUE="3">3</OPTION> <OPTION VALUE="4">4</OPTION> <OPTION VALUE="5">5</OPTION> <OPTION VALUE="6">6</OPTION> <OPTION VALUE="7">7</OPTION> <OPTION VALUE="8">8</OPTION> <OPTION VALUE="9">9</OPTION> <OPTION VALUE="10">10</OPTION> <OPTION VALUE="11">11</OPTION> <OPTION VALUE="12">12</OPTION> <OPTION VALUE="13">13</OPTION> <OPTION VALUE="14">14</OPTION> <OPTION VALUE="15">15</OPTION> <OPTION VALUE="16">16</OPTION> <OPTION VALUE="17">17</OPTION> <OPTION VALUE="18">18</OPTION> <OPTION VALUE="19">19</OPTION> <OPTION VALUE="20">20</OPTION> </SELECT></td> <td><INPUT TYPE="text" NAME="tw4" SIZE="10" VALUE></td> </tr> <tr> <td>Item4</td> <td>3.99</td> <td><SELECT NAME="pw5" SIZE="1" ONCHANGE="calculate(this, 3.99)"> <OPTION VALUE="0">0</OPTION> <OPTION VALUE="1">1</OPTION> <OPTION VALUE="2">2</OPTION> <OPTION VALUE="3">3</OPTION> <OPTION VALUE="4">4</OPTION> <OPTION VALUE="5">5</OPTION> <OPTION VALUE="6">6</OPTION> <OPTION VALUE="7">7</OPTION> <OPTION VALUE="8">8</OPTION> <OPTION VALUE="9">9</OPTION> <OPTION VALUE="10">10</OPTION> <OPTION VALUE="11">11</OPTION> <OPTION VALUE="12">12</OPTION> <OPTION VALUE="13">13</OPTION> <OPTION VALUE="14">14</OPTION> <OPTION VALUE="15">15</OPTION> <OPTION VALUE="16">16</OPTION> <OPTION VALUE="17">17</OPTION> <OPTION VALUE="18">18</OPTION> <OPTION VALUE="19">19</OPTION> <OPTION VALUE="20">20</OPTION> </SELECT></td> <td><INPUT TYPE="text" NAME="tw5" SIZE="10" VALUE></td> </tr> <tr> <td>Item5</td> <td>2.99</td> <td><SELECT NAME="pw6" SIZE="1" ONCHANGE="calculate(this, 2.99)"> <OPTION VALUE="0">0</OPTION> <OPTION VALUE="1">1</OPTION> <OPTION VALUE="2">2</OPTION> <OPTION VALUE="3">3</OPTION> <OPTION VALUE="4">4</OPTION> <OPTION VALUE="5">5</OPTION> <OPTION VALUE="6">6</OPTION> <OPTION VALUE="7">7</OPTION> <OPTION VALUE="8">8</OPTION> <OPTION VALUE="9">9</OPTION> <OPTION VALUE="10">10</OPTION> <OPTION VALUE="11">11</OPTION> <OPTION VALUE="12">12</OPTION> <OPTION VALUE="13">13</OPTION> <OPTION VALUE="14">14</OPTION> <OPTION VALUE="15">15</OPTION> <OPTION VALUE="16">16</OPTION> <OPTION VALUE="17">17</OPTION> <OPTION VALUE="18">18</OPTION> <OPTION VALUE="19">19</OPTION> <OPTION VALUE="20">20</OPTION> </SELECT></td> <td><INPUT TYPE="text" NAME="tw6" SIZE="10" VALUE></td> </tr> <tr> <td>Item6 </td> <td>4.99</td> <td><SELECT NAME="pw7" SIZE="1" ONCHANGE="calculate(this, 4.99)"> <OPTION VALUE="0">0</OPTION> <OPTION VALUE="1">1</OPTION> <OPTION VALUE="2">2</OPTION> <OPTION VALUE="3">3</OPTION> <OPTION VALUE="4">4</OPTION> <OPTION VALUE="5">5</OPTION> <OPTION VALUE="6">6</OPTION> <OPTION VALUE="7">7</OPTION> <OPTION VALUE="8">8</OPTION> <OPTION VALUE="9">9</OPTION> <OPTION VALUE="10">10</OPTION> <OPTION VALUE="11">11</OPTION> <OPTION VALUE="12">12</OPTION> <OPTION VALUE="13">13</OPTION> <OPTION VALUE="14">14</OPTION> <OPTION VALUE="15">15</OPTION> <OPTION VALUE="16">16</OPTION> <OPTION VALUE="17">17</OPTION> <OPTION VALUE="18">18</OPTION> <OPTION VALUE="19">19</OPTION> <OPTION VALUE="20">20</OPTION> </SELECT></td> <td><INPUT TYPE="text" NAME="tw7" SIZE="10" VALUE></td> </tr> <tr> <td>Item7</td> <td>5.99</td> <td><SELECT NAME="pw8" SIZE="1" ONCHANGE="calculate(this, 5.99)"> <OPTION VALUE="0">0</OPTION> <OPTION VALUE="1">1</OPTION> <OPTION VALUE="2">2</OPTION> <OPTION VALUE="3">3</OPTION> <OPTION VALUE="4">4</OPTION> <OPTION VALUE="5">5</OPTION> <OPTION VALUE="6">6</OPTION> <OPTION VALUE="7">7</OPTION> <OPTION VALUE="8">8</OPTION> <OPTION VALUE="9">9</OPTION> <OPTION VALUE="10">10</OPTION> <OPTION VALUE="11">11</OPTION> <OPTION VALUE="12">12</OPTION> <OPTION VALUE="13">13</OPTION> <OPTION VALUE="14">14</OPTION> <OPTION VALUE="15">15</OPTION> <OPTION VALUE="16">16</OPTION> <OPTION VALUE="17">17</OPTION> <OPTION VALUE="18">18</OPTION> <OPTION VALUE="19">19</OPTION> <OPTION VALUE="20">20</OPTION> </SELECT></td> <td><INPUT TYPE="text" NAME="tw8" SIZE="10" VALUE></td> </tr> <tr> <td>Item8</td> <td>1.99</td> <td><SELECT NAME="pw9" SIZE="1" ONCHANGE="calculate(this, 1.99)"> <OPTION VALUE="0">0</OPTION> <OPTION VALUE="1">1</OPTION> <OPTION VALUE="2">2</OPTION> <OPTION VALUE="3">3</OPTION> <OPTION VALUE="4">4</OPTION> <OPTION VALUE="5">5</OPTION> <OPTION VALUE="6">6</OPTION> <OPTION VALUE="7">7</OPTION> <OPTION VALUE="8">8</OPTION> <OPTION VALUE="9">9</OPTION> <OPTION VALUE="10">10</OPTION> <OPTION VALUE="11">11</OPTION> <OPTION VALUE="12">12</OPTION> <OPTION VALUE="13">13</OPTION> <OPTION VALUE="14">14</OPTION> <OPTION VALUE="15">15</OPTION> <OPTION VALUE="16">16</OPTION> <OPTION VALUE="17">17</OPTION> <OPTION VALUE="18">18</OPTION> <OPTION VALUE="19">19</OPTION> <OPTION VALUE="20">20</OPTION> </SELECT></td> <td><INPUT TYPE="text" NAME="tw9" SIZE="10" VALUE></td> </tr> <tr> <td>Item9 (not working)</td> <td>5.99</td> <td><SELECT NAME="pw10" SIZE="1" ONCHANGE="calculate(this, 5.99)"> <OPTION VALUE="0">0</OPTION> <OPTION VALUE="1">1</OPTION> <OPTION VALUE="2">2</OPTION> <OPTION VALUE="3">3</OPTION> <OPTION VALUE="4">4</OPTION> <OPTION VALUE="5">5</OPTION> <OPTION VALUE="6">6</OPTION> <OPTION VALUE="7">7</OPTION> <OPTION VALUE="8">8</OPTION> <OPTION VALUE="9">9</OPTION> <OPTION VALUE="10">10</OPTION> <OPTION VALUE="11">11</OPTION> <OPTION VALUE="12">12</OPTION> <OPTION VALUE="13">13</OPTION> <OPTION VALUE="14">14</OPTION> <OPTION VALUE="15">15</OPTION> <OPTION VALUE="16">16</OPTION> <OPTION VALUE="17">17</OPTION> <OPTION VALUE="18">18</OPTION> <OPTION VALUE="19">19</OPTION> <OPTION VALUE="20">20</OPTION> </SELECT></td> <td><INPUT TYPE="text" NAME="tw10" SIZE="10" VALUE></td> <tr> <td><p align="right">grand total <img src="arrow.png" width="32" height="32" border="0" alt="" align="absmiddle"></p></td> <td><input type="text" name="totalw" size="10" style="background: #87cefa;"></td> <td align="left"><input type="submit" value="SEND YOUR ORDER" style="background: #87cefa;"></td> </tr> </tr> <tr> <td>Name</td> <td><input type="text" name="name"></td> <td></td> <td></td> </tr> <tr> <td>e-mail</td> <td><input type="text" name="e-mail"></td> <td></td> <td></td> </tr> <tr> <td>Phone</td> <td><input type="text" name="phone"></td> <td></td> <td></td> </tr> </table> </FORM> </BODY> </HTML> Below is some code I wrote for my assignment that is due tonight; however, I can't seem to get any of the validation features to work. Can someone help me? I'm really new to javascript and struggling through it, but really want to figure this out. Here are the things I'm trying to do: -Validate each textbox to make sure they aren't empty -Validate one textbox to make sure that the text entered is numeric only -Validate the two email addresses for proper email format -Validate the two email addresses to make sure they are exactly alike -Show all of your errors at once, in one alert box, not individually. -Only check for matching emails if the first is valid. Here is my attempt at the code: [CODE] <script type="text/javascript"> <!-- Hide from older browsers var ProductInquiryForm; function Validate( ProductInquiryForm ) { formName = ProductInquiryForm; } function ValidEmail( EmailSearch ) { var txtEmail = EmailSearch.value; var intAtSign = txtEmail.indexOf("@"); var intLastDot = txtEmail.lastIndexOf("."); if( txtEmail == "" || txtEmail == null ) { return false; } if( intAtSign == -1 || intLastDot == -1 ) { return false; } if( intLastDot < intAtSign ) { return false; } if( intLastDot - intAtSign == 1 ) { return false; } if( intLastDot >= txtEmail.length-2 ) { return false; } else { return true; } } function ValidEmail( ConfirmEmailSearch ) { var txtEmail = ConfirmEmailSearch.value; var intAtSign = txtEmail.indexOf("@"); var intLastDot = txtEmail.lastIndexOf("."); if( txtEmail == "" || txtEmail == null ) { return false; } if( intAtSign == -1 || intLastDot == -1 ) { return false; } if( intLastDot < intAtSign ) { return false; } if( intLastDot - intAtSign == 1 ) { return false; } if( intLastDot >= txtEmail.length-2 ) { return false; } if (EmailSearch!= ConfirmEmailSearch) { return false; } else { return true; } } function ApprovedEmail ( ConfirmEmailSearch ) { if( HasText(EmailSearch) && ValidEmail(EmailSearch) && HasText(ConfirmEmailSearch) && ValidEmail(ConfirmEmailSearch)) { return true; } else { alert("A valid email must be entered and match in both fields!"); return false; } } function validateZIP(ZIPSearch) { if( ZIPSearch.value != 0||1||2||3||4||5||6||7||8||9) { alert("Please enter digits only for the ZIP code."); return false; } if (field.length!=5) { alert("Please enter no more than 5 digits for your ZIP code."); return false; } function HasText( ProductSearchDescription ) { if( ProductSearchDescription.value.length != 0 ) { return true; } else { alert("Please enter your product needs."); return false; } } // Stop hiding --> </script> <noscript> This site uses JavaScript code for validation and calculations based on user input. </noscript> <form name="form1" id="form1" method="post" action="intercept-searchform.asp" onsubmit="return Validate(this)"> <div> <label for="EmailSearch">Email Address:</label> <input name="EmailSearch" type="text" class="TextBox" id="EmailSearch" /> </div> <div> <label for="ConfirmEmailSearch">Confirm Email Address:</label> <input name="ConfirmEmailSearch" type="text" class="TextBox" id="ConfirmEmailSearch" /> </div> <div> <label for="ZIPSearch">ZIP Code</label> <input name="ZIPSearch" type="zip" class="zip" id="zip" /> </div> <div> <label for="ProductSearchDescription">Describe the product you are looking for.</label> <textarea name="ProductSearchDescription" id="ProductSearchDescription" class= "Comments" rows="6" cols="50"></textarea> </div> <br /> <div id="buttons"> <input name="Submit" type="Submit" value="Submit" /> <input name="Reset" type="Reset" /> </div> </form> [CODE] Thank you so much to anyone willing to help give me some guidance! I'm trying to do a simple validation to see if the field is blank, if it is, I want to write a message to a div. I've added the function call to an onclick. It seems to be set off no matter if there is a value or not, and what's more, the fields are clearing out when the link is clicked. My brain is mush right now, so what am I missing? Code: function validateThis() { document.getElementById('messages').innerHTML = '' var theMessage = ''; var reqMsg = 'must have a value.'; for (var i = 0; i <document.theForm1.elements.length; i++) { if (document.theForm1.elements[i].value = ' ') { theMessage += document.theForm1.elements[i].name +' ' + reqMsg +'<br/>'; }} document.getElementById('messages').innerHTML = theMessage; } Hello, On my client's site: www.twdcycling.com he wanted a place where people could make suggestions for his blog. I accomplished the simple form using a textarea field and even put a little text that clears on clicks and reappears on blur. When you go there--go to the bottom left. It also actually works. The problem is that (besides the fact that so far no one has cared to make a suggestion) somehow the form is (this is what I believe) being submitted automatically. I don't believe a human is clicking submit. When I click submit w/o clicking in the field the default text that I have in the field already gets submitted in the generated email. So I now need to work on my validation in my php file that sends the email. For background I obtained my php file from html-form-guide.com here the file is in its entirety: Code: <?php if(!isset($_POST['submit'])) { //This page should not be accessed directly. Need to submit the form. echo "error; you need to submit the form!"; } $name = $_POST['name']; $visitor_email = $_POST['email']; $message = $_POST['message']; //Validate first if(empty($name)||empty($visitor_email)) { echo "Name and email are mandatory!"; exit; } if(IsInjected($visitor_email)) { echo "Bad email value!"; exit; } $email_from = 'tom@amazing-designs.com';//<== update the email address $email_subject = "New Form submission"; $email_body = "You have received a new message from the user $name.\n". "Here is the message:\n $message". $to = "tom@amazing-designs.com";//<== update the email address $headers = "From: $email_from \r\n"; $headers .= "Reply-To: $visitor_email \r\n"; //Send the email! mail($to,$email_subject,$email_body,$headers); //done. redirect to thank-you page. header('Location: thank-you.html'); // Function to validate against any email injection attempts function IsInjected($str) { $injections = array('(\n+)', '(\r+)', '(\t+)', '(%0A+)', '(%0D+)', '(%08+)', '(%09+)' ); $inject = join('|', $injections); $inject = "/$inject/i"; if(preg_match($inject,$str)) { return true; } else { return false; } } ?> It does have some validation code, and it also is set up to handle more parameters than I needed. I tried to just pare it down to the one simple thing (I just need the user to type anything they want into my text area) My reasoning is that I should be able to go get some simple validation snippet to make it so that if there is the possibility something is causing the form to just "fire off" w/o a human clicking, the validation shouldn't allow it to send, cause the text field is empty. But one would think if that is happening my default text would allow it to send, but oddly enough, no! when I get the email (last one at 5:49 am) it was a blank email! So its like some robot is doing two things: clicking in the field to empty it and THEN clicking submit! Weird, I know. But the validation code would fix this if only I knew how. (But on another note, if I try to send an empty box my default text pops back in when I click submit--proving that its happening automatically. I tried all morning yesterday to implement a snippet from several sources. Here's a couple of examples of what I added: Code: function emptyvalidation(entered, alertbox) { // Emptyfield Validation by Henrik Petersen / NetKontoret // Explained at www.echoecho.com/jsforms.htm // Please do not remove this line and the two lines above. with (entered) { if (value==null || value=="") {if (alertbox!="") {alert(alertbox);} return false;} else {return true;} } } I didn't modify this code at all....maybe where I went wrong here. Should "value" correspond to text area name "message"? (about the only thing I didn't try) Here's another one --this one from W3 schools: Code: function validateForm() { var x=document.forms["myForm"]["fname"].value; if (x==null || x=="") { alert("First name must be filled out"); return false; } } this is how it was on the source site, all I changed was "myForm" and "fname" to "blog_suggestion" But when testing both these snippets separately what happened is that on submit I just go to my php page (which is just blank) I'm assuming code I'm adding is crashing the script somehow. And then of course no thank you page and no email sent. Finally here is my current php page in its entirety, followed by the form code on the home page... Code: <?php if(!isset($_POST['submit'])) { //This page should not be accessed directly. Need to submit the form. echo "error; you need to submit the form!"; } $message = $_POST['message']; //Validate first if(empty($message)) { echo "Please enter a suggestion before clicking submit."; exit; } $email_from = 'f7digitaldesign@gmail.com';//<== update the email address $email_subject = "SOMEONE HAS SUBMITTED A SUGGESTION FOR THE BLOG!"; $email_body = "\n $message". $to = "f7digitaldesign@gmail.com";//<== update the email address $headers = 'From: '.$email_from."\r\n". 'Reply-To: '.$email_from."\r\n" . //Send the email! mail($to,$email_subject,$email_body,$headers); //done. redirect to thank-you page. header('Location: thank-you.html'); // Function to validate against any email injection attempts function IsInjected($str) { $injections = array('(\n+)', '(\r+)', '(\t+)', '(%0A+)', '(%0D+)', '(%08+)', '(%09+)' ); $inject = join('|', $injections); $inject = "/$inject/i"; if(preg_match($inject,$str)) { return true; } else { return false; } } ?> I tried to modify the validation I got w/ this to produce the "echo" message "Please enter a suggestion before clicking submit." But let's be honest, by now you know I don't know what in the heck I'm doing (it doesn't seem to matter). Form code: Code: <form name="blog_suggetion" method="post" action="send_form_blogidea.php"> <span class="bloginfotext" ><textarea name="message" rows="14" cols="12" onfocus="clearValue(this, 'Please submit ideas for our blog here—we’d love to hear from you!')" onclick="this.value='';" onblur="if (this.value == '') {this.value = 'Please submit ideas for our blog here—we’d love to hear from you!';}" ></textarea></span> <div style="font-size:6px; color:#FFF;">sdsadfds</div> <input type="submit" name='submit' value="submit"> </form> Any time spent and help offered for this is greatly appreciated!! Also if you need to/want to test the field, I don't care--send me a message. I'll know someone cares! Brian I am very new to javascript and really can't figure out what I am doing wrong. I am trying to make a 1 page store that allows you to type in an item and select the color and size you want for that item. If you don't fill in a field, an alert message should tell you that. If all the fields are filled in, a "thank you for purchasing ____________" message should appear in a text area at the bottom of the page. This is my current code: Code: <html> <head> <script> function processform() { if ( document.form1.item1.value == "") { alert("No Item Chosen") } else { chosen = "" len = document.form1.c1.length for (i = 0; i <len; i++) { if (document.form1.c1[i].checked) { chosen = document.form1.c1[i].value } } if (chosen == "") { alert("No Color Chosen") } } else { itemname = document.form1.item1.value; itemcolor = document.form1.c1.value; itemsize = document.form1.size.value; document.form1.txtarea1.value = "Thank you for purchasing a " + itemsize + " " + itemcolor + " " + itemname; } } </script> </head> <body> <h1>Store</h1> <br/><br/> <form name="form1"> <h4>What item would you like to buy?</h4> <input type="text" name="item1" value="" /><br /> <br/><br/> <h4>Color</h4> <input type="radio" name="c1" value="blue" /> Blue<br /> <input type="radio" name="c1" value="red" /> Red<br /> <input type="radio" name="c1" value="green" /> Green<br /> <input type="radio" name="c1" value="yellow" /> Yellow<br /> <br/><br/> <h4>Size</h4> <select name="size"> <option value="small">Small</option> <option value="medium">Medium</option> <option value="large">Large</option> <option value="extra large">Extra Large</option> </select> <br/><br/> <button onclick="processform()">Purchase</button> <br/><br/> <textarea rows="2" cols="40" name = "txtarea1"> </textarea> </form> </body> </html> When I press the purchase button, no alert message is shown, nor does anything get displayed in the textarea. What am I doing wrong? I'm trying to make an xhtml form that validates itself through a javascript function. I have the form up but for some reason I can't get it to validate. I'm not even sure if I linked things correctly. Here's what I have: the xhtml file <?xml version = ″1.0″ encoding = ″utf-8″ ?> <!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> <script src="gas24.js" type="text/javascript"></script> <h2> Registration Form </h2> <title> Javascript Form Validation Homework </title> </head> <body> <table border=""> <form name="validation_form" method="post" onsubmit="return validate()"> <tr> <td> <t>Name: <input type="text" name="YourName" size="10" maxlength="10"/> </td> </tr> </br> <tr> <td> E-mail Address: <input type="text" name="YourEmail" size="10" maxlength="24"/> </td> </tr> </br> <tr> <td> Password: <input type="password" name="YourPassword" size="10" maxlength="10"/> </td> </tr> </br> <tr> <td> Re-Type Password: <input type="password" name="passwordConfirmed" size="10" maxlength="10"/> </td> </tr> </br> <tr> <td> Your Gender: <input type="radio" name="MaleBox" Value="Male"> Male <input type="radio" name="FemaleBox" Value="Female"> Female </td> </tr> </br> <tr> <td> Comments: <input type="text" name="Comments" size="100" maxlength="500" value=""/> </td> </tr> <tr> <td> <input type="submit" value="Submit"/> </td> </tr> </form> </table> <p></p> </body> </html> The javascript file: I've tried two things. This: <SCRIPT LANGUAGE="JavaScript"> function validation() { var x=document.forms["validation_form"]["YourName"].value; if (x==null || x=="") { alert("First name must be filled out"); return false; } } And this: function validation() if ( document.validation_form.YourName.value == "" ) { alert( "Please type your name."); valid = false; } if ( document.validation_form.YourPassword.value =! "document.validation_form.Confirm.value" ) { alert ( "Please confirm your password." ); valid = false; } I would greatly appreciate it if somebody could tell me what I'm doing wrong. Hi everyone, I am converting a program that displays the payment options as a list of check boxes to a drop down list. I have tried using onBlur(), etc. but the program is displaying my error that says I didn't select a payment method. Here is the code, thanks for any hints or help! Code: <html> <head> <title>Order form</title> <meta http-equiv="Content-Type" content="text/javascript"> <script type="text/javascript"> function total() { var subtotal=0; var total=0; var adjustment=1; payment=false; var elmnts=document.payform.elements; for (var x=0; x<(document.payform.elements['item[]'].length); x++) { if (document.payform.elements['item[]'][x].checked) { subtotal=subtotal+parseFloat(document.payform.elements['item[]'][x].value); } } for (var x=0; x<(document.payform.pay.length); x++) { if (document.payform.pay[x].checked) { adjustment=document.payform.pay[x].value; payment=true; } } if (payment) { total=subtotal*adjustment; total = total.toFixed(2); document.payform.display.value="subtotal: "+subtotal+"\rAdjustment: "+adjustment+"\rTotal: "+total; } else { window.alert("Please choose payment type."); } } </script> </head> <body> <form name="payform"> <table border="0" cellpadding="5"> <tr> <td width="250" valign="top"> <b>Please buy some stuff!</b><br /> <input type="checkbox" name="item[]" value="14.99" />Chang $14.99<br /> <input type="checkbox" name="item[]" value="12.99" />Chartreuse verte $12.99<br /> <input type="checkbox" name="item[]" value="13.99" />Gnocchi di nonna Alice $13.99<br /> <input type="checkbox" name="item[]" value="14.99" />Gudbrandsdalsost $14.99<br /><br /> <b>Choose payment methods</b><br /> <select name = "pay" size = 0> <option value = "0"></option> <option value = "1.2">Monday order (20% service charge)</option> <option value = "1.1">Personal check (10% service charge)</option> <option value = ".8">Visa (preferred -- 20% discount)</option> <option value = "1.2">MasterCard (10% discount)</option> <option value = "1.2">Discover (10% discount)</option> </select> <br /><br /> <input type="button" value="Process Order" onClick="total()" /> <input type="reset" value="Reset Form" /> </td></tr> <tr> <td width="200" valign="bottom"> <textarea name="display" rows="5" cols="35"></textarea></td> </tr> </table> </form> </body> </html> Hello i need help with a simple single field javascript login form, i am building a small website for I and my classmates. i want it to be able to redirect each user to a specific page when a corresponding passcode is entered, i know its unsafe but we dont plan on keeping valuable information on the site, i dont know about MSQL and dont even wish to use it, the code works at this level but am unable to add users since i dont understand javascript if someone could help me i will be very grateful thanks in advance /*here is the code i got so far*/ <tittle> Enter Passcode to proceed </title> <h1 style="font-family:Comic Sans Ms;text-align="center";font-size:20pt; color:#00FF00;> </h1> <form name="login"> Passcode: <input type="text" name="userid"/> <input type="button" onclick="check(this.form)" value="Login"/> <input type="reset" value="Cancel"/> </form> <script language="javascript"> function check(form)/*function to check userid */ { if(form.userid.value == "JohnDoe") /* checkes userid */ { window.open("johndoe.php")/*target page */ } else { alert("Invalid Passcode, please try again!")/*error message*/ } } I have built a signup form which has several text inputs and text areas. Their labels are set as their values. When the user focuses on the field, the label text is cleared to accept text input. When focus is changed to another field. The field checks if text has been entered. If it has not, it then resets the value back to the default label value. For example: Code: <input type="text" name="company_name" size="50" class="textInput" value="Company Name" onfocus="if(this.value=='Company Name')this.value='';" onblur="if(this.value=='')this.value='Company Name';" /> What I would like to do is have some simple javascript which checks the fields on submit. If any of the required fields still have the default label value, then I would like to change the colour of the label value in the input to red and disable the form submit until the value is corrected. Most of the inputs and text areas will accept any text, though one is an email text input. I don't think any fancy validation is needed for this email input , other than checking to be sure a '@' has been entered. Since the website that this form will be contained in runs jQuery, I have looked into some plugins for form validation. However, these seem to be over-complicated for what I need. I want to keep this as simple and light as possible. Oh, and also, I am not allowed to use anything php based as this is not allowed to run on our servers for security reasons... Any advice or suggestions are much appreciated! I'm in search for a simple and clean timed rotation script. I have these quotes, and right now they're coded so that a single quote displays and changes upon refresh. The script is really clean, and I would like to maintain the cleanliness but make the images rotate every couple of seconds. Here's the script... Code: <script type="text/javascript"> quote = new Array(3); quote[0] = "Quote 1"; quote[1] = "Quote 2"; quote[2] = "Quote 3"; index = Math.floor(Math.random() * quote.length); document.write(quote[index]); </script> It's probably a really simple piece of coding, but I'm still new to JavaScript, so it's obviously out of my range. I appreciate anyone who will help in excel i want to replace the word bebo with a value in cell B1 this is the line CREATE TABLE IF NOT EXISTS `bebo` ( `id` int(10) NOT NULL auto_increment,`beboid` varchar(255) default '0',`status` varchar(255) default 'No Comment Posted',PRIMARY KEY (`id`)) in column B i have a load of values so i need an excel formula to replace bebo so that it will take values from B1 to B26 any ideas please? I know this is not the correct section to be posting in but couldnt find a relative section on this site.. Thanks for your help Not new to programming but I am to JQuery (and j/script in general). I need to query a mysql database to return a small amount of data (some text) based on a user code (e.g. MrABC). I could use an iFrame and PHP but if the internet connection is down I do not want error messages displayed - the intended audience have limited cognitive capabilities and will not cope with ERROR 404 etc... Essentially I need to be able to create a function that can be called with a parameter of the usercode and which returns the text from the lookup. What I put in the function is a complete mystery to me ... I found a menu I really like at the top of the page at www-dot-sachscreative-dot-com but can't figure out how it works from the source code. Can someone tell me how to make something like it which is browser independent and uses javascript and/or CSS? It's been years since I did javascript work and I've forgotten must of what I used to know. Thanks.
I'm looking to find a script... My client wants his users to be able to enter their zip code into a "check coverage area" text box. Then, on submit, it should return a message saying whether zip code is covered by his business. It seems like this would be a simple (ish) "if-else" script, listing the covered zip codes, but I'm not very experienced in javascript. Can anyone direct me to a free or cheap script that I could use and adapt for this? Thanks soooo much. Hello all, As I am new to java scripts, I usually solve thing with trial and error. What I need is a very simple java script for a count down timer, after searching here I found this: ---------------------- Code: <font style="font-size:72px" color="#FF0000" face="Arial"> <script type = "text/javascript"> var page = "http://www.google.com"; //The page to redirect to function getSeconds() { startTimer (3); // 36 hours } var timeInSecs; var ticker; function startTimer(secs){ timeInSecs = parseInt(secs); ticker = setInterval("tick()",1000); tick(); // to start counter display right away } function tick() { var secs = timeInSecs; if (secs>0) { timeInSecs--; } else { window.location = page; // stop counting at zero // and start again if required } var hours= Math.floor(secs/3600); secs %= 3600; var mins = Math.floor(secs/60); secs %= 60; var result = ( (mins < 10) ? "0" : "" ) + mins + ":" + ( (secs < 10) ? "0" : "" ) + secs; document.getElementById("countdown").innerHTML = result; } </script> <body onload = "getSeconds()"> <span id="countdown" style="font-weight: bold;" ></span> ----------------------------- I modified some stuff, as I defined the font face and size, the color as well, and I added a var to open a certain page when the time is over (as I said before, all these modifications came right with trial and error). So, is that script good? or are there better scripts that do the same job? And, can someone please provide me with a script that does the same functionality of the script I mentioned but instead of showing digits it shows: 01 minutes 31 seconds ? Thank you so much. I imagine this would be very simple for someone who knows javascript. I want to have three fields. First field is "posted speed limit", second field is "actual speed" and third field will be the output field. All the script needs to do it subtract the posted speed from the actual speed and add a ZERO to the end; which is the amount of the speeding ticket. The minimum fine is $100, however. So, 5 miles over the speed limit would be $100 (minimum value) 15 miles over the speed limit would be $150 (add a zero) 35 miles over the speed limit would be $350. etc. I know very little Javascript, if anyone could help me out with this, I'd appreciate it. Thanks, Sean new to JavaScript, simple question... question: how do i determine an output from a prompt to be bold? e.g. a user enters "hello" and the output printed from the prompt becomes bold one=parseFloat(prompt('enter number',0.bold)); I have a script that works good, but it says undefined underneath, this must mean an error. But I cant work out how to get rid of it. This is the html it is a transistional XHTML doc type. Code: <div id="slidedom"> <script type="text/javascript" src="js-files/slider.js"></div></script> Then I have the js file which I will have to post all of as I am not sure of the error bit. Code: var variableslide=new Array() //variableslide[x]=["path to image", "OPTIONAL link for image", "OPTIONAL text description (supports HTML tags)"] variableslide[0]=['images/sign-1.gif'] variableslide[1]=['images/sign-3.gif'] variableslide[2]=['images/sign-4.gif'] //configure the below 3 variables to set the dimension/background color of the slideshow var slidewidth='188px' //set to width of LARGEST image in your slideshow var slideheight='60px' //set to height of LARGEST iamge in your slideshow, plus any text description var slidebgcolor='#FFF' //configure the below variable to determine the delay between image rotations (in miliseconds) var slidedelay=3000 ////Do not edit pass this line//////////////// var ie=document.all var dom=document.getElementById for (i=0;i<variableslide.length;i++){ var cacheimage=new Image() cacheimage.src=variableslide[i][0] } var currentslide=0 function rotateimages(){ contentcontainer='<center>' if (variableslide[currentslide][1]!="") contentcontainer+='<a href="'+variableslide[currentslide][1]+'">' contentcontainer+='<img src="'+variableslide[currentslide][0]+'" border="0" vspace="3">' if (variableslide[currentslide][1]!="") contentcontainer+='</a>' contentcontainer+='</center>' if (variableslide[currentslide][2]!="") contentcontainer+=variableslide[currentslide][2] if (document.layers){ crossrotateobj.document.write(contentcontainer) crossrotateobj.document.close() } else if (ie||dom) crossrotateobj.innerHTML=contentcontainer if (currentslide==variableslide.length-1) currentslide=0 else currentslide++ setTimeout("rotateimages()",slidedelay) } if (ie||dom) document.write('<div id="slidedom" style="width:'+slidewidth+';height:'+slideheight+'; background-color:'+slidebgcolor+'"></div>') function start_slider(){ crossrotateobj=dom? document.getElementById("slidedom") : ie? document.all.slidedom : document.slidensmain.document.slidenssub if (document.layers) document.slidensmain.visibility="show" rotateimages() } if (ie||dom) start_slider() else if (document.layers) window.onload=start_slider I have taken out the credit, as I have changed it a bit, but will reinstate it later on. All I really need to know is how to define it in the XHTML maybe. Can anyone help? |