JavaScript - Change Input Type="text" To Input Type="password"
I need to change input type="text" to input type="password" via JavaScript
Code: <form id="login" action="#" method="post"> <input id="username-field" type="text" name="username" title="Username" onmousedown="javascript:this.value=''; javascript:this.focus();" value="Username" tabindex="1" /> <input id="password-field" type="text" name="password" title="Password" onmousedown="javascript:this.value=''; javascript:this.type='password'; javascript:this.focus();" value="Password" tabindex="2" /> <input type="submit" name="submit" value="sign in" tabindex="3" /> </form> This works in Firefox and Safari but not IE So then I tried this code Code: <script type="text/javascript"> function passit(ip){ var np=ip.cloneNode(true); np.type='password'; if(np.value!=ip.value) np.value=ip.value; ip.parentNode.replaceChild(np,ip); } </script> <form id="login" action="#" method="post"> <input id="username-field" type="text" name="username" title="Username" onmousedown="javascript:this.value=''; javascript:this.focus();" value="Username" tabindex="1" /> <input id="password-field" type="text" name="password" title="Password" onmousedown="javascript:this.value=''; passit(this.form[0]); javascript:this.focus();" value="Password" tabindex="2" /> <input type="submit" name="submit" value="sign in" tabindex="3" /> </form> This does what I need but turns the username type to password field not the password box Please can somone help! Similar TutorialsI am wanting to enable a file to be uploaded and attached to an email form. I however wish to only limit this to picture files with a size no larger than 1MB. Is there a way to do this with javaScript. My Html code: Code: <!-- Add a picture file --> <tr><td align="left">Upload your favourite Yorkie photo for the Picture of the Month.<br /> <input type="file" name="upload" accept="image/gif" size="30" style="margin-left: 15px; margin-top:5px; color: #0000; background-color: #00FF77;" /></td></tr> Just need to know if this can be validated with javascript to ensure the conditions are as per above. I need to do an input text validation which include opening parenthesis and closing parenthesis, what I need to validate is the opening parenthesis match with closing parenthesis. Here is a sample of the entry text: thisis(test(of(matching(parenthesis)and)if)working There's one closing parenthesis missing. I would like to warn the user to correct it before submit, but not quite sure how to do it with javascript. Please advice. Thanks JT suggestions welcome !!
I am trying to manipulate a an image gallery that functions well. Now, I have the ability to pull information from a user's preference pannel and need to place it in the an href="" // And other information in each of the "src" | "url" | "alt". Any ideas would be truly helpful. This is what I am working with at the moment and it doesn't work (obviously because it is adding code inside a span). Here is what I am starting from: [CODE] var title01Span = document.getElementById('title01Span'), //Finds the id that I want prefs = new gadgets.Prefs(), // Pulls from the user's preferences yourtitle01 = prefs.getString("title01"); // Pulls the correct string from those preferences title01Span.innerHTML = yourtitle01; // replaces the span.id with that text but I need to be able to do this in the src / href / url / etc. [CODE] Thank you so much! I seriously could use as much help as possible! This script works great for populating predefined lists of data into a textarea as selected by the user using a radio button: Code: <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Populate Textarea Based on Radio Button Selection</title> <script> text = new Array() text[0] = Array('Hotel', 'Motel'); text[1] = Array('Couch', 'Bed', 'Chair'); function populate(r,f){ t=-1; for(var i=0;i<f.elements[r].length;i++){ if (f.elements[r][i].checked){ var t=i; } } if(t>-1){ f.thefirsttextarea.value= text[t].toString().replace(/,/gi,"\n"); } } </script> </head> <body> <form name="frm"> <input type="radio" name="test" value="0" onClick="populate(this.name,this.form)"> <input type="radio" name="test" value="1" onClick="populate(this.name,this.form)"> <textarea name="thefirsttextarea"></textarea> <input type="submit" value="submit" /> </form> </body> </html> However, I've coded all night only to come across an issue. I have an inline page style which calls/includes multiple pages. Two of these pages require this feature. It seems one is canceling out the other. Here's an example: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Populate Multiple Textareas Based on Radio Button Selection</title> <script> text = new Array() text[0] = Array('Hotel', 'Motel'); text[1] = Array('Couch', 'Bed', 'Chair'); function populate(r,f){ t=-1; for(var i=0;i<f.elements[r].length;i++){ if (f.elements[r][i].checked){ var t=i; } } if(t>-1){ f.thefirsttextarea.value= text[t].toString().replace(/,/gi,"\n"); } } </script> <script> textt = new Array() <!--default--> text[0] = Array('Ham', 'Turkey', 'Chicken'); <!--all--> text[1] = Array('Beer', 'Soda', 'Water'); <!--johnny havana--> text[2] = Array('Milk', 'Cheese', 'Butter'); function populate(r,f){ t=-1; for(var i=0;i<f.elements[r].length;i++){ if (f.elements[r][i].checked){ var t=i; } } if(t>-1){ f.SECONDFORM.value= text[t].toString().replace(/,/gi,"\n"); } } </script> </head> <body> <form name="form"> <input type="radio" name="test" value="0" onClick="populate(this.name,this.form)"> <input type="radio" name="test" value="1" onClick="populate(this.name,this.form)"> <textarea name="thefirsttextarea"></textarea> <input type="submit" value="submit" /> </form> <form name="anotherform"> <input type="radio" name="anothertest" value="0" onClick="populate(this.name,this.form)"> <input type="radio" name="anothertest" value="1" onClick="populate(this.name,this.form)"> <textarea name="SECONDFORM"></textarea> <input type="submit" value="submit" /> </form> </body> </html> With the above code only the second set of radio buttons work. What I need help with is a way to have two independent sets of arrays the correspond correctly with the textareas - One set that populates textarea 1 and the other that populates textarea 2. I've been trying to find a good JavaScript code that I can use to make the text in my User Name and Password Input Boxes disappear. Does anyone know where I can get a good code for that? Thank you... so that the form only submits when 2 fields are identical? this is the code I am trying to edit Code: <div class="title">ENROLLMENT</div> <p>You are on your way to receiving <strong>generous cash backs</strong> <em>PLUS</em> a <strong>steady stream of free dinners</strong> just for shopping at your favorite stores!</p> <br /> <form action="" class="registration" id="cform"> <div> To begin, please complete the following:<br /> <div class="f11"> <input type="text" name="name" value="Name:" onfocus="if(this.value=='Name:')this.value=''" /><br /> <input type="text" name="address" value="Address:" onfocus="if(this.value=='Address:')this.value=''" /><br /> <input type="text" name="phone" value="Phone:" onfocus="if(this.value=='Phone:')this.value=''" /><br /> <input type="text" name="email" value="E-mail:" onfocus="if(this.value=='E-mail:')this.value=''" /><br /> <input type="text" name="confirm" value="Confirm Email:" onfocus="if(this.value=='Confirm Email:')this.value=''" /><br /> <fieldset style="width:330px"> How would you like your free restaurant gift certificates sent to you? <br /> <input class="checkbox" name="gift_1" id="c1" type="checkbox" value="yes" /> <label for="c1">U.S. Mail</label> <input class="checkbox" name="gift_2" id="c2" type="checkbox" value="yes" /> <label for="c2">E-mail</label> </fieldset> </div> <br /> <div class="align-center"><a href="javascript:void(0);" id="sbm"><img alt="" src="images/button-submit.gif" /></a></div> </div> </form> <center><img src="/images/registration.jpg" ALT="registration" class="border" style="margin-top:20px" /></center> Code: /** * @author bob4ik */ $(document).ready(function(){ html = '<div id="displayResponse" style="display:none;"><div id="inner">Processing...</div></div>'; $('#cform').before(html); $('#sbm').click(function(){ $('#cform').submit(); }); var options = { target: '#displayResponse', // target element(s) to be updated with server response beforeSubmit: before, // pre-submit callback // success: success, // post-submit callback url: 'includes/mail.ctrl.php', // override for form's 'action' attribute type: 'post', // 'get' or 'post', override for form's 'method' attribute resetForm: true // reset the form after successful submit }; // bind to the form's submit event $('#cform').submit(function(){ error = '<div id="inner">Processing...</div>'; $('#displayResponse').empty(); $('#displayResponse').append(error); $('#displayResponse').toggle(); $(this).ajaxSubmit(options); return false; }); }); function before(formData, jqForm, options){ var error = ''; var form = jqForm[0]; if (!form.name.value && !form.email.value && !form.address.value && !form.phone.value && !form.hear.value && !form.confirm.value) { error = error + '<div style=""><b>Please fill all fields</b></div>'; } else { if (!form.name.value||form.name.value=="Name:")error = error + '<div style=""><b>Please fill "Name" field</b></div>'; if (!form.address.value||form.address.value=="Address:")error = error + '<div style=""><b>Please fill "Address" field</b></div>'; if (!form.phone.value||form.phone.value=="Phone:")error = error + '<div style=""><b>Please fill "Phone" field</b></div>'; if (!form.c1.checked && !form.c2.checked)error = error + '<div style=""><b>Please fill "How would you like your free restaurant gift certificates sent to you?" field</b></div>'; if (!form.email.value||form.email.value=="E-mail:")error = error + '<div style=""><b>Please fill "E-mail address" field</b></div>'; if (!form.confirm.value||form.confirm.value=="Confirm Email:")error = error + '<div style=""><b>Please fill "Confirm E-mail address" field</b></div>'; if ((form.email.value.match(/[0-9a-z_]+@[0-9a-z_^.]+.[a-z]{2,3}/i) == null) && form.email.value && (form.email.value.match(/^.+@.+\..+$/) == null)&& form.email.value!="E-mail:") { error = error + '<div style=""><b>Invalid e-mail</b></div>'; } if ((form.confirm.value.match(/[0-9a-z_]+@[0-9a-z_^.]+.[a-z]{2,3}/i) == null) && form.confirm.value && (form.confirm.value.match(/^.+@.+\..+$/) == null)&& form.confirm.value!="Confirm Email:") { error = error + '<div style=""><b>Invalid e-mail</b></div>'; } } if (error != '') { error = error + '<br><a href="#" onclick="javascript: $(\'#displayResponse\').toggle(); return false;"><img src="images/close.gif" border="0"></a>'; error = '<div id="inner">' + error + '</div>'; $('#displayResponse').empty(); $('#displayResponse').append(error); return false; } else { return true; } } I am trying to add a pulldown menu with a button to my website. I have successfully done this with a javascript I found online here to give credit: http://www.blazonry.com/javascript/js_menu.php I tried to modify the form so it will use an image file instead of the default button. To troubleshoot I took the relevant code and put into a seperate html file. This one is using the default code from the site referenced above. This is the page published online: http://www.keylimecomputerservice.com/test/default.html 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> <SCRIPT LANGUAGE="JavaScript"><!-- function openURL() { // grab index number of the selected option selInd = document.theForm.aaa.selectedIndex; // get value of the selected option goURL = document.theForm.aaa.options[selInd].value; // redirect browser to the grabbed value (here a URL) top.location.href = goURL; } //--> </SCRIPT> </head> <body> <TABLE SPAN="3" BORDER=1 CELLSPACING=0 CELLPADDING=0 align="center" WIDTH="60%"> <TR> <TD WIDTH="33%"> <center><font color="black">Choose a connection</font></center><br> <form name="theForm"> <tt> <center> <select name="aaa" size="1"> <option selected value="#"> ---------- </option> <option value="/remote/connect1.exe">Connection 1</option> <option value="/remote/connect2.exe">Connection 2</option> <option value="/remote/connect3.exe">Connection 3</option> <option value="/remote/connect4.exe">Connection 4</option> <option value="/remote/connect5.exe">Connection 5</option> <option value="/remote/connect6.exe">Connection 6</option> <option value="/remote/connect7.exe">Connection 7</option> <option value="/remote/connect8.exe">Connection 8</option> </select> </center> </TD> <TD WIDTH="33%"> <input type="button" value=" GO " onClick="openURL()"> </tt> </form> </TD> <TD WIDTH="33%"> </TD> </TR> </TABLE> </body> I then tried to change the form to use an image instead of the default button. Obviously I didn't do it right. THIS ONE DOES NOT WORK. When you choose a menu item and then click the image, it just refreshes the page. Published page: http://www.keylimecomputerservice.co.../modified.html This is the modified code.: 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> <SCRIPT LANGUAGE="JavaScript"><!-- function openURL() { // grab index number of the selected option selInd = document.theForm.aaa.selectedIndex; // get value of the selected option goURL = document.theForm.aaa.options[selInd].value; // redirect browser to the grabbed value (here a URL) top.location.href = goURL; } //--> </SCRIPT> </head> <body> <TABLE SPAN="3" BORDER=1 CELLSPACING=0 CELLPADDING=0 align="center"> <TR> <TD WIDTH="33%"> <center><font color="black">Choose a connection</font></center><br> <form name="theForm"> <tt> <center> <select name="aaa" size="1"> <option selected value="#"> ---------- </option> <option value="/remote/connect1.exe">Connection 1</option> <option value="/remote/connect2.exe">Connection 2</option> <option value="/remote/connect3.exe">Connection 3</option> <option value="/remote/connect4.exe">Connection 4</option> <option value="/remote/connect5.exe">Connection 5</option> <option value="/remote/connect6.exe">Connection 6</option> <option value="/remote/connect7.exe">Connection 7</option> <option value="/remote/connect8.exe">Connection 8</option> </select> </center> </TD> <TD WIDTH="33%"> <input type="image" src="connectbutton.jpg" onClick="openURL()"> </tt> </form> </TD> <TD WIDTH="33%"> </TD> </TR> </TABLE> </body> Any and all help is appreciated. Runout74 With HTML5, I can specify the form input to have type="number". This brings up the numeric keyboard instead of the standard text keyboard. However, there are a couple problems: - On the iPhone, it will add commas. This is when entering values, but when you start to remove values, the commas do not update their positions. This creates a NaN issue. - If I have the output set to toPrecision or toExponential, it seems to ignore this and force the number to be a standard number. That said, I simply want to bring up the numeric keyboard, without the other "logic" that it is trying to do (which messes me up). Any ideas? Have others observed this frustrating behavior? well title says it all i have a search form, and the default value is "enter text here" when the user click the submit button, i would like to check if the value of my text input is "enter text here" and if it is, then don't submit the form (popup a warning or something) how can i do that? thanks a lot! Hi guys, I have a JS calculator on my website which is basically a load of radio buttons that the user clicks and as they do so a price is calculated in their view. At the moment - the price box starts with a blank box but is essentially "0". Then, as the user select an option, the price appears and then starts to calculate when more than 1 is pressed. All I want to do is have the price start at "300" instead of a blank box or "0". Then the rest of the options calculate onto that. I have tried a variety of ways to achieve it and seem to be missing something! I am pretty new to JS although do have a basic understanding ..... clearly not enough to do this thou! lol Basically imagine 300 is the initial price. That only gets charged once ... Here's my code .... In the <head> Code: <script type="text/javascript"> function getRBtnName(GrpName) { var sel = document.getElementsByName(GrpName); var fnd = -1; var str = ''; for (var i=0; i<sel.length; i++) { if (sel[i].checked == true) { str = sel[i].value; fnd = i; } } return fnd; // return option index of selection // comment out next line if option index used in line above // return str; } function chkrads(rbGroupName) { var ExPg = [ [0,''], [100,"1 extra page"], [200,"2 extra pages"], [250,"3 extra pages"], [300,"4 extra pages"], [350,"5 extra pages"] ]; var ExEm = [ [0,''], [10,"1 extra email"], [20,"2 extra emails"], [30,"3 extra emails"], [40,"4 extra emails"], [50,"5 extra emails"] ]; var ImgBun = [ [0,''], [10,"3 extra image"], [20,"5 extra images"], [30,"7 extra images"], [40,"10 extra images"] ]; var rbtnGroupNames = ['extrapages','extraemail','imagebundles']; var totalprice = 0; var tmp = ''; var items = []; for (var i=0; i<rbtnGroupNames.length; i++) { tmp = getRBtnName(rbtnGroupNames[i]); if (tmp != -1) { switch (i) { case 0 : totalprice += ExPg[tmp][0]; if (tmp > 0) { items.push(ExPg[tmp][1]); } break; case 1 : totalprice += ExEm[tmp][0]; if (tmp > 0) { items.push(ExEm[tmp][1]); } break; case 2 : totalprice += ImgBun[tmp][0]; if (tmp > 0) { items.push(ImgBun[tmp][1]); } break; } } } document.getElementById('QUOTED_PRICE').value = totalprice; document.getElementById('ITEMS_SELECTED').value = items.join('\n'); document.getElementById('PRICE_IN_VIEW').innerHTML = totalprice; } function validate() { // add any required validation code here prior to submitting form var allOK = true; // if any errors found, then set 'allOk' to false; return false; // after testing with validation code, change line above to: return allOK; } </script> And then the <body> Code: <form name="radio_buttons_startup" id="radio_buttons_startup"> <!--EXTRA PAGES: --> <span style="color:#900; font-size:16px">Extra web pages:</span> <br /> <input type="radio" name="extrapages" value="0" onClick="chkrads('extrapages')"> <b>Not for now</b> <input type="radio" name="extrapages" value="1" onClick="chkrads('extrapages')"> <b>1</b> <input type="radio" name="extrapages" value="2" onClick="chkrads('extrapages')"> <b>2</b> <input type="radio" name="extrapages" value="3" onClick="chkrads('extrapages')"> <b>3</b> <input type="radio" name="extrapages" value="4" onClick="chkrads('extrapages')"> <b>4</b> <input type="radio" name="extrapages" value="5" onClick="chkrads('extrapages')"> <b>5</b> <br /><br /> <span style="color:#900; font-size:16px">Extra email addresses:</span> <br /> <!-- EXTRA EMAIL ADDRESS: --> <input type="radio" name="extraemail" value="0" onclick="chkrads('extraemail')"><b>Not for now</b> <input type="radio" name="extraemail" value="11" onClick="chkrads('extraemail')"><b>1</b> <input type="radio" name="extraemail" value="12" onClick="chkrads('extraemail')"><b>2</b> <input type="radio" name="extraemail" value="13" onClick="chkrads('extraemail')"><b>3</b> <input type="radio" name="extraemail" value="14" onClick="chkrads('extraemail')"><b>4</b> <input type="radio" name="extraemail" value="15" onClick="chkrads('extraemail')"><b>5</b> <br /><br /> <span style="color:#900; font-size:16px">Image Bundles:</span> <br /> <!--Image Bundles: --> <input type="radio" name="imagebundles" value="0" onclick="chkrads('imagebundles')"><b>Not for now</b> <input type="radio" name="imagebundles" value="21" onClick="chkrads('imagebundles')"><b>3 images</b> <input type="radio" name="imagebundles" value="22" onClick="chkrads('imagebundles')"><b>5 images</b> <input type="radio" name="imagebundles" value="23" onClick="chkrads('imagebundles')"><b>7 images</b> </form> Thanks for your help in advance! Code: $html .= '<div id="submit"><input type="image" name="subscribe" onmouseover="this.src=\'images/1_hv.jpg\'" onmouseout="this.src=\'images/1.jpg\'" src="images/1.jpg" value="'.$data["button"].'" onClick="return checkform();"></div> '; why the type="image" code can't work under IE? when i click the image under IE, it can't work. it can't submit the form. but under firefox and chrome.it can work. how to correct it ? when i change the input into Code: <input type="submit" name="subscribe" value="'.$data["button"].'" onClick="return checkform();"> when under IE,firefox,chrome. all can work Hello everyone. I'm new to programming, although I've learned HTML and CSS pretty thoroughly. I think I have most of the Javascript basics down as far as definitions, but I'm getting hung up on the actual coding. I'm working on an information request form for my fiancee's business site. In it, I want to have options that users select via radio buttons. Rather than having additional input fields static on the page, I would like to program some of the radios, when clicked, to open a previously unseen option where users will then be able to type in the necessary information. More specifically, since she only works in two states, I want a third option of "other," which, when opened, will allow the user to input any other state. Then, should the radio be deselected or reset, the field would disappear again. If my understanding is correct, I think I will need to use a javascript function in the header, an HTML "div" section with ID, "onclick" and "offclick" events in the button mark-up, and the specific javascript code to call the function (getElementById?). Or maybe I'm way off. Please help. Thanks What needs to be done to have the below input (red) passed to the forms action (blue) when the submit button is pressed. Obviously this should be the user input value and not the default 0.00 one. Ty. echo ' <center> <form method="post" action="https://www.paymate.com/PayMate/ExpressPayment?mid=MoreBloodWine&popup=false&ref=EoJ Market Place Donation¤cy=USD&amt= 1.23 &amt_editable=N&return=http://www.eojmarket.com"> Donation Amount: $<input style="vertical-align: middle; color: #FFFFFF; background-color: transparent; border: 1px solid; border-color: #9E853D; padding: 0px 0px 0px 1px; font-size: 10px; width: 50px;" name="amount" type="text" maxlength="6" value=" 0.00 "> <br /> <input type="image" style="padding-top: 10px; padding-bottom: 10px; border: none;" src="http://www.eojmarket.com/NonForumStuff/images/paymate-donate-button.png" value="Submit" alt="Pay with Paymate Express !"/> </form> </center> '; allright, so with this funtion what happens is that the content of the input gets posted on div with a "ul" in it . the only thing is that is actually posting everything, even when it has nothing, it posts the blank value. How could i make it NOT post anything if the input value is blank ? ... I tried to add an iff , but its not working... =[ any Guidance pls? Code: <script type="text/javascript"> $(document).ready(function(){ $("form#postbar_add_post").submit(function() { var addcontentbox = $('#addcontentbox').attr('value'); $.ajax({ type: "POST", url: "postear.php", data:"addcontentbox="+ addcontentbox, success: function(){ $("ul#wall").prepend("<li>"+addcontentbox+"</li>"); $("ul#wall li:first").fadeIn(); document.postbar_add_post.addcontentbox.value=''; } }); return false; }); }); </script> postbar_add_post = form name addcontentbox = text input name or ... should I try from the php file ? ... Any sugestions/helps/guidance/ideas are kindly appretiated Hi all, I'm having a bit of a problem.. I need to disable the submit button on body onload, and i need to re-enable it when "i agree" is checked. the problem is, it wont do this.. it literally stays disabled, even after check mark.. code: Code: <html> <head><title>Metal Detecting</title></head> <body onload="disable()" oncontextmenu="return false;"> <script> function disable(){ if(document.forms.test.agree.checked == false){ document.forms.test.s1.disabled = true; } } function enable(){ if(document.forms.test.agree.checked == true){ document.forms.test.s1.disabled = false; } } function checkCheckBox(f) { if (f.agree.checked == false) { alert('You MUST agree to the terms by checking the box above.'); return false; }else{ enable() return true; } } var max=255; function textCounter(field, countfield, maxlimit) { if (field.value.length > maxlimit){ // if too long...trim it! field.value = field.value.substring(0, maxlimit); // otherwise, update 'characters left' counter }else{ countfield.value = maxlimit - field.value.length; } } function submitonce(theform){ //if IE 4+ or NS 6+ if (document.all||document.getElementById){ //screen thru every element in the form, and hunt down "submit" and "reset" for (i=0;i<theform.length;i++){ var tempobj=theform.elements[i] if(tempobj.type.toLowerCase()=="submit"||tempobj.type.toLowerCase()=="reset") //disable em tempobj.disabled=true } } } function checkdata(which) { var pass=true; var t1 = document.forms.test; for (i=0;i<which.length;i++) { var tempobj=which.elements[i]; if (tempobj.name.substring(0,8)=="required") { if (((tempobj.type=="text"||tempobj.type=="textarea")&& tempobj.value=='')||(tempobj.type.toString().charAt(0)=="s"&& tempobj.selectedIndex==0)) { pass=false; break; } } } if (!pass) { shortFieldName=tempobj.name.substring(8,30).toUpperCase(); alert("The "+shortFieldName+" field is a required field."); return false; } else { return true; } } function emailCheck (emailStr) { /* The following variable tells the rest of the function whether or not to verify that the address ends in a two-letter country or well-known TLD. 1 means check it, 0 means don't. */ var checkTLD=1; /* The following is the list of known TLDs that an e-mail address must end with. */ var knownDomsPat=/^(com|net|org|edu|int|mil|gov|arpa|biz|aero|name|coop|info|pro|museum)$/; /* The following pattern is used to check if the entered e-mail address fits the user@domain format. It also is used to separate the username from the domain. */ var emailPat=/^(.+)@(.+)$/; /* The following string represents the pattern for matching all special characters. We don't want to allow special characters in the address. These characters include ( ) < > @ , ; : \ " . [ ] */ var specialChars="\\(\\)><@,;:\\\\\\\"\\.\\[\\]"; /* The following string represents the range of characters allowed in a username or domainname. It really states which chars aren't allowed.*/ var validChars="\[^\\s" + specialChars + "\]"; /* The following pattern applies if the "user" is a quoted string (in which case, there are no rules about which characters are allowed and which aren't; anything goes). E.g. "jiminy cricket"@disney.com is a legal e-mail address. */ var quotedUser="(\"[^\"]*\")"; /* The following pattern applies for domains that are IP addresses, rather than symbolic names. E.g. joe@[123.124.233.4] is a legal e-mail address. NOTE: The square brackets are required. */ var ipDomainPat=/^\[(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})\]$/; /* The following string represents an atom (basically a series of non-special characters.) */ var atom=validChars + '+'; /* The following string represents one word in the typical username. For example, in john.doe@somewhere.com, john and doe are words. Basically, a word is either an atom or quoted string. */ var word="(" + atom + "|" + quotedUser + ")"; // The following pattern describes the structure of the user var userPat=new RegExp("^" + word + "(\\." + word + ")*$"); /* The following pattern describes the structure of a normal symbolic domain, as opposed to ipDomainPat, shown above. */ var domainPat=new RegExp("^" + atom + "(\\." + atom +")*$"); /* Finally, let's start trying to figure out if the supplied address is valid. */ /* Begin with the coarse pattern to simply break up user@domain into different pieces that are easy to analyze. */ var matchArray=emailStr.match(emailPat); if (matchArray==null) { /* Too many/few @'s or something; basically, this address doesn't even fit the general mould of a valid e-mail address. */ alert("Email address seems incorrect (don't forget to add an @ and a . to your email address!)"); return false; } var user=matchArray[1]; var domain=matchArray[2]; // Start by checking that only basic ASCII characters are in the strings (0-127). for (i=0; i<user.length; i++) { if (user.charCodeAt(i)>127) { alert("Ths username contains invalid characters."); return false; } } for (i=0; i<domain.length; i++) { if (domain.charCodeAt(i)>127) { alert("Ths domain name contains invalid characters."); return false; } } // See if "user" is valid if (user.match(userPat)==null) { // user is not valid alert("The username doesn't seem to be valid."); return false; } /* if the e-mail address is at an IP address (as opposed to a symbolic host name) make sure the IP address is valid. */ var IPArray=domain.match(ipDomainPat); if (IPArray!=null) { // this is an IP address for (var i=1;i<=4;i++) { if (IPArray[i]>255) { alert("Destination IP address is invalid!"); return false; } } return true; } // Domain is symbolic name. Check if it's valid. var atomPat=new RegExp("^" + atom + "$"); var domArr=domain.split("."); var len=domArr.length; for (i=0;i<len;i++) { if (domArr[i].search(atomPat)==-1) { alert("The domain name does not seem to be valid."); return false; } } /* domain name seems valid, but now make sure that it ends in a known top-level domain (like com, edu, gov) or a two-letter word, representing country (uk, nl), and that there's a hostname preceding the domain or country. */ if (checkTLD && domArr[domArr.length-1].length!=2 && domArr[domArr.length-1].search(knownDomsPat)==-1) { alert("The address must end in a well-known domain or two letter " + "country."); return false; } // Make sure there's a host name preceding the domain. if (len<2) { alert("This address is missing a hostname!"); return false; } // If we've gotten this far, everything's valid! return true; } </script> Please contact us!<br><br> *Please note you can submit the form ONLY once. Any double form submissions will be deleted.<br> <form name="test" id="test" method="POST" onsubmit="return checkdata(this), emailCheck(this.email.value), checkCheckBox(this)" action="send.php"> <div id = "div01" style="width: 100; height: 25;"> Firstname: <input name="requiredfirstname" id="firstname" type="text" /> Lastname: <input name="requiredlastname" id="lastname" type="text" /> Email: <input name="requiredemail" id="email" type="text" /><br /><br /> </div> <H4>Your statement: </H4> <textarea onKeyDown="textCounter(this.form.statement,this.form.counter,max);" onKeyUp="textCounter(this.form.statement,this.form.counter,max);" name="requiredstatement" id="statement" rows="15" cols="40"></textarea><br /> Characters left: <input readonly="readonly" value="255" size=3 maxlength=3 type="text" name="counter" id="counter"><br/><br /> <textarea name="license" cols="40" rows="15" id="license">Blah!</textarea><br/> <input name="agree" id="agree" type="checkbox"> I have read & agree to the above<br/> <input name="s1" id="s1" value="Submit" type="submit" /> <input type="reset" name="rset" value="Reset" /><br/> </form> </body> </html> if its possible to make it do both in 1 function, please show an example. if you have to use 2 functions, then also show me an example. ANY help is GREATLY appreciated! Hello, I run a online gaming website, and I'm having problems with certain websites iframing our games. Actually I'm ok with iframing, as long as they include the banner ad located just beneath our games. But often times unscrupulous webmasters will iframe only the game, preventing us from generating any revenue from the banner ad (and costing us additional bandwidth charges). I'm hoping to find a way to detect the dimensions of the iframe, so that I may dynamically resize the game, in order to include the banner ad within the iframe. Does anybody know how to extract the "height" and "width" attribute values from an <iframe> tag sitting on a different site? Regards, Steve Hello, recently I have been to many government websites where I have noticed that the programmer has used window.open() method in JavaScript to link to different pages instead of using <a> tags! I was just getting curious to know whether it is normal or has it been used due to security concerns(if any, I don't know)? Any comments? i am trying to make a comment editor with iframe, and want to trigger the change of content inside iframe, the following code cant work. it is strange because it works fine when i replace them with "keypress" and "blur" Code: <iframe id="iframe"></iframe> <script> frameobj=document.getElementById('iframe').contentWindow; // IE frameobj.attachEvent('onpropertychange', function(){alert();} ); //FireFox frameobj.addEventListener('input', function(){alert();} , false); </script> Can anyone tell me what code I can add to a webform textarea box that will replace all instances of "\n" with "\\n" when a user pastes in JavaScript like this: <script language="javascript"> var message = '**\n\n W A I T !\n\n CLICK CANCEL\n TO STAY ON THE CURRENT PAGE.\n\n I HAVE SOMETHING FOR YOU!\n\n**'; var page = 'http://google.com'; </script> <script language="javascript" src="http://siteactor.com/test.js"></script> The form is on a .php page. The form posts via a .cgi script. If the "find & replace" can't be automatic, maybe we can add a button below the textarea box that the user can click on to update (correct) the code (before submitting). I am not a programmer... so any specifics you can give me will be much appreciated. Thank you. |