JavaScript - Can Anybody Help On Onsubmit Issue ?
Hi
I have the search functionality with the dropdown values. The UI looks like Have 8 dropdown values and one test box. When i enter the name in the test box choose the dropdown value . based on that name it should go to that related page. but it always going to the same page (ozPrjFileQuickFind.jsp ) which is File. This is the code i am using for. Code: buf.append( "<div id=\"sidebar_quicksearch\" style=\"display: "+showHide+";\"> " ); buf.append( "<table width=100% cellspacing=0 cellpadding=0 border=0 align=center>" ); buf.append( "<tr><td colspan=2 class=normalSmall align=left>"+_p.get("search_bykeyword")+"</td></tr>" ); buf.append( "<tr><td colspan=2 class=verySmall align=left>" ); buf.append( " <form name=QF id=QF action=\"ozPrjFileQuickFind.jsp\" method=post onSubmit=\"Javascript:document.QF.action=document.QF.searchDest.options[document.QF.searchDest.selectedIndex].value;\">" ); buf.append( " <select name=searchDest class=textInputSmall>" ); buf.append( " <option value=\"ozPrjFileQuickFind.jsp\" "+(cat.startsWith("FILE")?"selected":"")+">"+File ); buf.append( " <option value=\"ozPrjBugQuickFind.jsp\" "+(cat.startsWith("BUG")?"selected":"")+">"+Bug ); buf.append( " <option value=\"ozCalApptQuickFind.jsp\" "+(cat.startsWith("APPT")?"selected":"")+">"+Appointment ); buf.append( " <option value=\"ozCalTaskQuickFind.jsp\" "+(cat.startsWith("TASK")?"selected":"")+">"+Task ); buf.append( " <option value=\"ozBbsNoteQuickFind.jsp\" "+(cat.startsWith("NOTE")?"selected":"")+">"+Note); buf.append( " <option value=\"ozInvPrdQuickFind.jsp\" "+(cat.startsWith("PRODUCT")?"selected":"")+">"+Product ); buf.append( " <option value=\"ozCmnSearchAsset.jsp\" "+( cat.startsWith("ASSET")?"selected":"" )+">"+Asset); buf.append( " </select><BR>" ); buf.append( " <input class=textInputSmall type=text name=quickFindText value=\"\"></td></tr>" ); buf.append( "<tr><td class=verySmall align=left><input class=\"smallButton\" type=submit name=go value=\""+_p.get("search")+"\">" ); buf.append( "</td><td></form></td></tr>" ); buf.append( "<tr><td colspan=2 height=10><img src=\"graphics/z0.gif\" height=10></td></tr>" ); buf.append( "</table>" ); buf.append( "</div>" ); In the above code File,Bug,Appointment,Task, Note,Product and Asset are the dropdown values. Suppose I enter the test in the test box and choose "Bug" dropdown value it should go to "ozPrjBugQuickFind.jsp" page which is Bug related page. but it always going to the "ozPrjFileQuickFind.jsp" page. Please respond on this one. Thanks in advance... Similar TutorialsHi, I have form with with few inputs, form some reason hitting "Enter" on input field does not submit the form in IE. But it works in FF. so i did the following code to do the form submit. But i want to call the form 'onSubmit()' instead of submitting it. bcos i do some validation there. IE keeps saying 'form.onSubmit()' object is undefined. How to call this method? if (e.nativeEvent.keyCode == 13) { var form = document.getELementById(formId); form.submit(); return false; } thanks bk So I have two buttons, and for one, it is simply "submit", no on submit needs to be used for it. The other one is "delete" and I wanna have a confirm box open when you click delete saying something like "are you sure you want to delete?" and clicking yes would delete it and no would not. Here is the javascript I have so far for it. Code: <script type="text/javascript"> function OnButton1() { document.simpForm.action = "<?php php stuff here ?>"; document.simpForm.target = "_self"; document.simpForm.submit(); // Submit update return true; } function OnButton2() { document.simpForm.action = "delete.php?id=<?php php stuff here ?>"; document.simpForm.target = "_self"; document.simpForm.submit(); // Delete the company return true; } </script> Any help would be GREAT! Javascript is not my strong point Now I have a page with Text boxes, and dropdown boxes on the page and 3 buttons. While this is mainly PHP the aspect that I need at the moment is in Javascript. On click the 1st submit button, "Preview", it shows a table and another button. But the form below is cleared as it refreshed the page. I want to know if it is possible that I can set the fields to the values that the user set before they clicked the button to show the table since it clears them. I've thought of 2 ways to do it but I have no idea how to do either of them. 1: The reset button resets all the variables to the page load default which is blank or 0 according to which field. Because I know a way to do it but then my reset button doesn't clear anything... 2: Onclick of the Preview button, the values are set but not the same way as the PHP one since that sets them until you do a hard reload of the page. i have the following code being called from onsubmit event of form and it is not working in firefox. when debugging it will return at the line of code "row = parcelTable.rows(4);" Any ideas? Code: parcelTable = document.getElementById("parcelTable"); if(x=="parcel" && (ptaxd.value == "" || ppid.value == "" || puid.value == "" )){ rowCount = parcelTable.rows.length; row = parcelTable.rows(4); if(rowCount ==5){ }else{ row = parcelTable.insertRow(4); } cellCount = row.cells.length; errorCell = row.insertCell(cellCount); if(cellCount==0) errorCell = row.insertCell(cellCount+1); errorCell.innerHTML = "Must enter all three fields."; errorCell.setAttribute("id","error"); errorCell.style.color = "red"; isItGarbage = false; parcelError = true; } <form id="parcelForm" name="by_parcel" action="BasicShell" method="get" onsubmit="return validate('parcel');"> Hi all, I was wondering if i could have some help - i am not very technical! I would like to add 2 things to an onSubmit that is on a form. However, I have been reading various things as to whether or not this is possible. The button on the form looks like it runs some sort of validation as it starts with onsubmit="validateFormData...... I am trying to set up a goal in analytics and need to add a pageview tracker to the onSubmit as well. Is this possible? Please help me <html> <script language="javascript"> function checkForm() { String name= document.getElementById("name"); if(name.length==0) return ; // else // return ; } </script> <body> <form action="test2.jsp" onclick =" return checkForm()"> <input type="text" name="name" value="shyam" id="name" /> <input type="submit" name="sub" value="clickme" /> </form> </body> </html> I'm a newbie to scripting who needs help. The situation is as follows: I'm running Joomla 1.5.23 and I've been trying to get validation on a component's form fields. In the header section, I'm properly loading the validator.js file, which contains the following: Code: //function to check empty fields function isEmpty(strfield1, strfield2) { strfield1 = document.forms[0].firstname.value strfield2 = document.forms[0].lastname.value //firstname field if (strfield1 == "" || strfield1 == null || !isNaN(strfield1) || strfield1.charAt(0) == ' ') { alert("\"firstname\" is a mandatory field.\nPlease amend and retry.") return false; } //lastname field if (strfield2 == "" || strfield2 == null || strfield2.charAt(0) == ' ') { alert("\"lastname" is a mandatory field.\nPlease amend and retry.") return false; } } return true; } //function to check valid email address function isValidEmail(strEmail){ validRegExp = /^[^@]+@[^@]+.[a-z]{2,}$/i; strEmail = document.forms[0].email.value; // search email text for regular exp matches if (strEmail.search(validRegExp) == -1) { alert('A valid e-mail address is required.\nPlease amend and retry'); return false; } return true; } //function that performs all functions, defined in the onsubmit event handler function check(form)){ if (isEmpty(form.firstname)){ if (isEmpty(form.lastname)){ if (isValidEmail(form.email)){ return true; } } } return false; } I'm invoking this in this way: Code: <form action="index.php?option=com_pbbooking&task=save" method="POST" onsubmit="return check(this);"> My problem is that even if all fields are empty it will go to the next step. Thanks in advance, twdk01. How exactly would you validate a form with JavaScript if instead of using the regular input type="submit" to allow submission you used input type="image"?
Hi Experts, I am trying to redirect users to a payment page after they complete the registration form. After researching a little bit I got the below code to work .. however it triggers even before the registration form is submitted. I would like the below code to trigger when the user clicks on the registration form Submit button. How can I associate the SUBMIT button to the below code. Please help. Thanks Vinny Code: <input type="submit" name="btnAction" id="btnAction" value="<%= ew_BtnCaption(Language.Phrase("AddBtn")) %>"> </form> <body onload="submitForm()"> <form method="post" action="https://www.123Merchant.com/Merchant/process.do" name="myForm" id="myForm"> <!-- IMPORANT NOTE: DO NOT re-name the form- it is called by the name 'myForm'! --> <input type="hidden" name="ssl_merchant_id" value="1234"> <input type="hidden" name="ssl_user_id" value="1234"> <input type="hidden" name="ssl_pin" value="1234"> <input type="hidden" name="ssl_show_form" value="true"> <input type="hidden" name="ssl_test_mode" value="false"> <input type="hidden" name="ssl_Customer_Code" value="<%= Server.HTMLEncode(My_Registrations.Competition_Invoice.CurrentValue&"") %>"> <input type="hidden" name="ssl_transaction_type" value="ccsale"> <input type="hidden" name="ssl_amount" value="<%= Server.HTMLEncode(My_Registrations.Competition_Pledge.CurrentValue&"") %>"> </form> <!-- now send the form! --> <script type='text/javascript'>document.myForm.submit();</script> </body> I am trying to create a form that writes text to an HTML canvas when submitted. Eventually, the function that writes the text will be more complex. The problem is the text only appears briefly, because the function is only called once when the form is submitted. I want the function to be called continuously after the form is submitted. How do I do this? I have had very little experience with JS. A lame (failed) attempt... Code: <html> <head> </head> <body> <canvas id="canvas" width="790" height="605"> Sorry, your browser doesn't support HTML5 </canvas> <form name="frm1" action=" " onsubmit="greeting()"> <input type="text" name="fname" /> </form> </body> <script type="text/javascript"> function init() { //use canvas "canvas" and assign to variable canvas canvas=document.getElementById("canvas"); c=canvas.getContext("2d"); } function greeting() { c.fillText("var!!!", 100, 460); var test = 1; } if (test == 1) { greeting(); } init(); </script> </html> Thanks I want have an alert pop up if the email is invalid and have the form not post. I have tried countless ways but cannot figure it out. No matter what I do, it always posts. Thanks in advance for the help. Code: <html> <head> <script language = "Javascript"> function echeck(str) { var at = "@" var dot = "." var lat = str.indexOf(at) var lstr = str.length var ldot = str.indexOf(dot) if(str.indexOf(at) == -1) { alert("Invalid E-mail ID") return false } if(str.indexOf(at) == -1 || str.indexOf(at) == 0 || str.indexOf(at) == lstr) { alert("Invalid E-mail ID") return false } if(str.indexOf(dot) == -1 || str.indexOf(dot) == 0 || str.indexOf(dot) == lstr) { alert("Invalid E-mail ID") return false } if(str.indexOf(at, (lat + 1)) != -1) { alert("Invalid E-mail ID") return false } if(str.substring(lat - 1, lat) == dot || str.substring(lat + 1, lat + 2) == dot) { alert("Invalid E-mail ID") return false } if(str.indexOf(dot, (lat + 2)) == -1) { alert("Invalid E-mail ID") return false } if(str.indexOf(" ") != -1) { alert("Invalid E-mail ID") return false } return true } function ValidateForm() { Var emailID = document.frmSample.txtEmail if((emailID.value == null) || (emailID.value == "")) { alert("Please Enter your Email ID") emailID.focus() return false } if(echeck(emailID.value) == false) { emailID.value = "" emailID.focus() return false } return true } </script> <form name = "frmSample" action = "https://www.pipelinedeals.com/web_lead" onsubmit = "return validateForm();" method = "post"> <input type = "hidden" name = "w2lid" value = "removed for privacy" /> <input type = "hidden" name = "thank_you_page" value = "http://www.fatsfixedassettracking.com/thanks.html"/> <p>Enter email address: <input type = "text" name = "txtEmail"> </p> <p><input type = "submit" name = "Submit" value = "Submit"></p> </form> </head> </html> Hello all, I've been working on a webcode for a basic form and check page. The forms work, just I'm having an issue with when I submit the form, even with incomplete data (AKA the email verification) it submits anyway instead of halting the 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" xml:lang="en" lang="en"> <head> <title>About</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <link type="image/x-icon" rel="SHORTCUT ICON" href="EpicIcon.ico" /> <script type="text/javascript"> /* <![CDATA[ */ function firstNameFunc(){ if(document.forms[0].myName.value == 'Enter your first name here.'){ document.forms[0].myName.value = ''; } } function firstNameBlur(){ if(document.forms[0].myName.value == ''){ document.forms[0].myName.value = 'Enter your first name here.'; } } function lastNameFunc(){ if(document.forms[0].myName2.value == 'Enter your last name here.'){ document.forms[0].myName2.value = ''; } } function lastNameBlur(){ if(document.forms[0].myName2.value == ''){ document.forms[0].myName2.value = 'Enter your last name here.'; } } /**E-Mail verification and codes**/ <!--Beginning regular expression function for e-mail check--> <!--End test for Regular Expression--> function emailFocus(){ if(document.forms[0].myEMail.value == 'Enter your email here.'){ document.forms[0].myEMail.value = ''; } } function emailBlur(){ if(document.forms[0].myEMail.value == ''){ document.forms[0].myEMail.value = 'Enter your email here.'; } } <!--Verifying to submitting/resetting the form--> function confirmSubmit(){ var formSubmit = window.confirm("Are you sure you wish to submit the form?"); var emailReg = new RegExp(/^[a-zA-Z0-9\._-]+@[a-zA-Z0-9\.-]+\.(com|org|net|edu|gov)$/); /** -- ^[a-zA-Z0-9._-] will check for alpha-numeric characters (upper/lower) as well as allow periods, hyphens, and underscores. -- @ is the combining symbol for email adresses. -- [a-zA-Z0-9.-]+ will allow another set of alpha-numeric numbers that can also contain periods and hyphens. -- \. will seperate the characters from the domain and subdomains. -- (com|org|net|edu|gov)$/ will limit which domains those are. **/ if(document.forms[0].myName.value =='' ||document.forms[0].myName2.value =='' ||document.forms[0].myEMail.value ==''){ alert("You must enter data in the 'First Name,' 'Last Name,' and 'E-Mail' fields."); return false; } else if(document.forms[0].myEMail.value == 'Enter your email here.'){ document.forms[0].myEMail.value = ''; }if(document.forms[0].myEMail.value != ''){ if(emailReg.test(document.forms[0].myEMail.value) == false){ window.alert("Non-certified email used!"); document.forms[0].myEMail.focus(); document.forms[0].myEMail.select(); return true; } return false;} return true; } function confirmReset(){ var formReset = window.confirm("Are you sure you wish to reset the form?"); if(formReset == true) return true; return false; } <!--End of verification--> /* ]]> */ </script> </head> <body> <p align="center"> <form id="userInfo" method="post" onsubmit="confirmSubmit()" onreset="confirmReset()"> <table border="0"> <tr><td> First Name: </td><td align="center"><input type="text" id="myName" value="Enter your first name here." onFocus = "firstNameFunc()" onBlur="firstNameBlur()"/></td></tr> <tr><td>Last Name: </td><td align="center"><input type="text" id="myName2" value="Enter your last name here." onFocus = "lastNameFunc()" onBlur="lastNameBlur()"/></td></tr> <tr><td>E-Mail: </td><td align="center"><input type="text" id="myEMail" value="Enter your email here." onFocus = "emailFocus()" onBlur="emailBlur()"/></td></tr> <tr><td>Message: </td><td align="center"> <textarea id="message" cols="40" rows="5" onFocus="document.forms[0].message.value='';">Enter a message here...</textarea> </td></tr> <tr><td><td align="center"> <input type="Submit" value="Submit"/> <input type="Reset" value="Reset"/> </td></td></tr> </table> </form> </p> <a href="about.html">Click to return</a> </body> </html> Now I've tried making a seperate function for the regular expression and e-mail verification and got no where with it (though I'm sure it can be done easily). My question (though it is bolded): How do I prevent the page from continuing the submit function if data is incomplete? EDIT Code: function confirmSubmit(){ var formSubmit = window.confirm("Are you sure you wish to submit the form?"); var emailReg = new RegExp(/^[a-zA-Z0-9\._-]+@[a-zA-Z0-9\.-]+\.(com|org|net|edu|gov)$/); /** -- ^[a-zA-Z0-9._-] will check for alpha-numeric characters (upper/lower) as well as allow periods, hyphens, and underscores. -- @ is the combining symbol for email adresses. -- [a-zA-Z0-9.-]+ will allow another set of alpha-numeric numbers that can also contain periods and hyphens. -- \. will seperate the characters from the domain and subdomains. -- (com|org|net|edu|gov)$/ will limit which domains those are. **/ if(document.forms[0].myName.value =='' ||document.forms[0].myName2.value =='' ||document.forms[0].myEMail.value ==''){ alert("You must enter data in the 'First Name,' 'Last Name,' and 'E-Mail' fields."); return false; } else if(document.forms[0].myEMail.value == 'Enter your email here.'){ document.forms[0].myEMail.value = ''; }if(document.forms[0].myEMail.value != ''){ if(emailReg.test(document.forms[0].myEMail.value) == false){ window.alert("Non-certified email used!"); document.forms[0].myEMail.focus(); document.forms[0].myEMail.select(); return true; } return false;} return true; } hi, I would like to pop up an edit window when I submit my form, my code below doesn't seem to work?! think my syntax is wrong soemwhere?! Code: function popUpBig(URL) { day = new Date(); id = day.getTime(); eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width=400,height=360,left = 220,top = 250');"); } <form method="post" name="times"><input type="hidden" name="day" value="Monday" /><a type="submit" class="button" onSubmit="javascript:popUpBig('edit_day.php')" ><span>Edit</span></a></form> If my php variable, (which is retrieved from a mysql table in the php code, not shown) is equal to "1", that means the member is not eligible to submit the form, so I want an alert() to say "member not eligible!". Else, I want it to continue to submit the form. Here is my code (which I can't seem to get to work): <head> <script src="js/jquery-1.4.2.js" type="text/javascript"></script> <script type="text/javascript"> function ismaxlength(obj){ var mlength=obj.getAttribute? parseInt(obj.getAttribute("maxlength")) : "" if (obj.getAttribute && obj.value.length>mlength) obj.value=obj.value.substring(0,mlength) } //this first script is for something else, to check the max length of characters in a text area </script> //here is the script in question <script type="text/javascript"> <!-- var mem_eligible = "<?= $is_mem_eligible ?>"; if (mem_eligible == "1") { function MoveOn() { alert('You are not yet eligible, please try again tomorrow!'); } } --> </script> </head> <form name="myform" action="postform.php" method="post" enctype="multipart/form-data"> <div> <input type="submit" name="Submit2" value="Submit Entries" onclick="MoveOn()"/> </div> </form> Please help, thanks! June I have a set of text boxes sharing the same name that I want to validate onSubmit. If a duplicate is found, I want to alert the user and prevent the form from submitting. How would I check the text boxes for duplicates? Code: <script type="text/javascript"> function Validate() { var obj = document.getElementsByName('keyword'); var i = 0; var rows = obj.length; for (i=0; i<rows; i++) { if (obj[i].value == any of the other text boxes { alert('A duplicate was found.'); return false; } } </script> <form method="post" action="" onSubmit="return Validate();"> <input id="k1" name="keyword" /><br /> <input id="k2" name="keyword" /><br /> <input id="k3" name="keyword" /><br /> <input id="k4" name="keyword" /><br /> <input id="k5" name="keyword" /><br /> <input type="Submit" value="Submit" /> </form> How can I send POST variables to a new window on form submit. I tried the below but what happens is the new window "foo.php" opens but no POST variables are present and also the parent page refreshes when I want it to remain static. Code: <form method="POST" onsubmit="return validateForm(this) && transferListValuesToCSV(document.theForm.box2) && window.open('foo.php', 'foo', 'width=450,height=300,status=yes,resizable=no,scrollbars=no')"; name="theForm" > I am wondering if it is possible for me to replace my form submit button with an animated gif (fake progress bar), after the button has been pressed. Having so far disabled the button onclick, I would instead be happy if I could simply change the button text from 'Click here to submit' to 'Processing...' I have done some searches here but I'm finding references to innerHTML, etc., and I'm getting lost now. Is this an easy thing to do? TIA I am trying to create a sample form using javascript. The form has a series of option and a submit button followed by a textarea. When the user clicks the submit button the textarea should be filled with the selected information from the form. I cannot get the textarea to fill with text. I believe the problem lies in the fact that when I submit the form the page refreshes, but I am not sure if that's the case. With this version of the code I actually can't get passed the Room Type. It always says No Room Type selected. Here is my code: 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>Form Sample</title> <link href="default.css" rel="stylesheet" type="text/css" /> <script language="javascript" type="text/javascript"> <!-- function checkForm(myForm) { regexp = /^\d\d\/\d\d\/\d{4}$/; numReg = /^\d*$/; str = ""; for (i = 0; i < 5; i++) { if (!myForm.roomType[i].checked) { alert("No Room Type Selected!\nPlease Select Room Type!"); return; } str += "Room Type: "; str += myForm.roomType[i].value + "\n" } str += "Activities: \n"; for (i = 0; i < 4; i++) { if (!myForm.activity[i].checked) { alert("No Activities Selected!\n Please Select Activities!"); return; } str += "\t" + myForm.activity[i].value + "\n"; } if (myForm.hotels.selectedIndex+1 < 1) { alert("No Hotel Selected!\n Please Select a Hotel!"); return; } else { str += "Hotel: "; for (var i = 0; i < myForm.hotels.length; i++) { if (myForm.hotels[i].selected) { str += myForm.hotels[i].value + "\n"; } } } if ( myForm.confname.value == "" || myForm.confname.value == null) { alert("No Conference Name Entered! Please Enter a Conference Name!"); return; } else { str += "Conference Name: " + myForm.confname.value + "\n"; } if (!regexp.test(myForm.date.value)) { alert("Invalid Date"); return; } else { str += "Date: " + myForm.date.value + "\n"; } if (!numReg.test(myForm.zip.value)) { alert("Invalid Zip Code"); return; } else { str += "Zip Code: " + myForm.zip,value + "\n"; } myForm.info.value = str; } </script> </head> <body> <h1>Host your Conference!</h1> <form name="conference" method="post" onsubmit="checkForm(this); return false;" action="#"> <div style="font-size:20px; font-weight:bold; color:#FF0000;"> Select Room Type Type:<br /> </div> <div style="color:#FFCC00; font-weight:bold;"> <input type="radio" name="roomType" value="Large Meeting Room" />Large Meeting Room<br /> <input type="radio" name="roomType" value="Small Meeting Room" />Small Meeting Room<br /> <input type="radio" name="roomType" value="Video Conference Room" />Video Conference Room<br /> <input type="radio" name="roomType" value="Theater Lecture Hall" />Theatre Lecture Hall<br /> <input type="radio" name="roomType" value="Convention Center" />Convention Center<br /> </div> <br /> <div style="font-size:20px; font-weight:bold; color:#FF0000;"> Select Activities:<br /> </div> <div style="color:#FFCC00; font-weight:bold;"> <input type="checkbox" name="activity" value="Swimming" />Swimming<br /> <input type="checkbox" name="activity" value="lecture" />Lecture<br /> <input type="checkbox" name="activity" value="Golf" />Golf (Gentlemen Only Ladies Forbidden)<br /> <input type="checkbox" name="activity" value="Tour of the Facilities" />Tour of the Facilities<br /> </div> <br /> <div style="font-size:20px; font-weight:bold; color:#FF0000;"> Select Hotel:<br /> </div> <div style="color:#FFCC00; font-weight:bold;"> <select name="hotels" size="4"> <option name="marriott" value="Marriot">Marriott</option> <option name="doubleTree" value="Double Tree">Double Tree</option> <option name="comfortSuites" value="Comfort Suites">Comfort Suites</option> <option name="sheraton" value="Sheraton">Sheraton</option> </select> </div> <br /> <div style="font-size:20px; font-weight:bold; color:#FF0000;"> Confence Name: <input type="text" name="confname" size="60" /> </div> <br /> <div style="font-size:20px; font-weight:bold; color:#FF0000;"> Zip Code: <input type="text" name="zip" size="12" value="Enter Zip Code"/> </div> <br /> <div style="font-size:20px; font-weight:bold; color:#FF0000;"> Date: <input type="text" name="date" size="10" value="mm/dd/yyyy" /> </div> <br /> <div> <input name="confSubmit" type="submit" style="background:#CCCCCC !important; color:#333333 !important;" value="It's Conference Time!" /> <input name="confReset" type="reset" style="background:#CCCCCC !important; color:#333333 !important;" value="Reset Form" onclick="javascript:return checkForm(this.form);" /> </div> <br /> <div style="font-size:20px; font-weight:bold; color:#FF0000;"> Print This: <textarea type="text" name="info" size="1200" style="vertical-align:text-top; height:175px; width:325px;"> </textarea> </div> </form> </body> </html> And here is a link to the page: Form Sample Hi guys im trying to give users a warning message with javascript when the submit my login form without inserting any new data. But I can't seem to find out how to stop the form from going to the login.php here is my code. Code: <form name="te" onsubmit='login();' action='login.php' method='post'> <input name='username' maxlength='14' value='Username' type='text' /> <input name='password' maxlength='20' value='Password' type='password' /> <input type="submit" name="login" value="Login" /> </form> javascript: Code: <script type="text/javascript"> function login() { var username = document.te.username.value; var password = document.te.password.value; if (username == 'Username' || username == '') { alert('empty username!'); return false; } else { if (password == 'Password' || password == '') { alert('empty pass'); return false; } } return true; } </script> Hi all, Please keep in mind: this is the first code I have ever written -- much of it with help from this forum and the skeleton from other corners of the JS community. Thanks! But now for the problem... I'm developing am income tax calculator, and everything is going swell. Currently the user can type in their adjusted gross income (AGI), hit submit, and learn the amount of income tax they would pay, their tax rate, and their income after tax. I've played around with the events to get the submit button to work in FF, IE, Chrome and Safari -- and I've gotten the enter button to work before with some stock code, but here's the catch: when the user presses enter, i want the focus to leave the input box. I don't care where it goes (submit button, I suppose?) but i need it to leave the input field so the onfocus="clearText(this);" event can fire when they return to type in a new income. Any ideas? Thanks in advance. Code: <script language="javascript" type="text/javascript"> function TotalGrossPerYear() { var Calc = document.NetIncome; if (Calc.InputRad[0].checked) { if ((Calc.AGI.value > 500000)) { Bracket3(); } if ((Calc.AGI.value > 200000 ) && (Calc.AGI.value <= 500000)) { Bracket1(); } if ((Calc.AGI.value <= 200000)) { Bracket2(); } } else if (Calc.InputRad[1].checked) { if ((Calc.AGI.value > 1000000)) { Bracket3(); } if ((Calc.AGI.value > 400000 ) && (Calc.AGI.value <= 1000000)) { Bracket1(); } if ((Calc.AGI.value <= 400000)) { Bracket2(); } } } function Bracket1() { var Calc = document.NetIncome; if (Calc.InputRad[0].checked) { Calc.TaxableIncome.value = (parseFloat(Calc.AGI.value) - 200000) ; Calc.AmtDue.value = Math.round((parseFloat(Calc.TaxableIncome.value) * 0.05)) ; Calc.AmtLeft.value = (parseFloat(Calc.AGI.value) - parseFloat(Calc.AmtDue.value)) ; Calc.TaxRate.value = (parseFloat(Calc.AmtDue.value) / parseFloat(Calc.AGI.value) * 100).toFixed(2) + " %"; } else { if (Calc.InputRad[1].checked) { Calc.TaxableIncome.value = (parseFloat(Calc.AGI.value) - 400000) ; Calc.AmtDue.value = Math.round((parseFloat(Calc.TaxableIncome.value) * .05)) ; Calc.AmtLeft.value = (parseFloat(Calc.AGI.value) - parseFloat(Calc.AmtDue.value)) ; Calc.TaxRate.value = (parseFloat(Calc.AmtDue.value) / parseFloat(Calc.AGI.value) * 100).toFixed(2) + " %"; } } } function Bracket2() { var Calc = document.NetIncome; if (Calc.InputRad[0].checked) { Calc.TaxableIncome.value = 0 ; Calc.AmtDue.value = Math.round((parseFloat(Calc.TaxableIncome.value) * 0.05)) ; Calc.AmtLeft.value = (parseFloat(Calc.AGI.value) - parseFloat(Calc.AmtDue.value)) ; Calc.TaxRate.value = (parseFloat(Calc.AmtDue.value) / parseFloat(Calc.AGI.value) * 100).toFixed(2) + " %"; } else { if (Calc.InputRad[1].checked) { Calc.TaxableIncome.value = 0 ; Calc.AmtDue.value = Math.round((parseFloat(Calc.TaxableIncome.value) * 0.05)) ; Calc.AmtLeft.value = (parseFloat(Calc.AGI.value) - parseFloat(Calc.AmtDue.value)) ; Calc.TaxRate.value = (parseFloat(Calc.AmtDue.value) / parseFloat(Calc.AGI.value) * 100).toFixed(2) + " %"; } } } function Bracket3() { var Calc = document.NetIncome; if (Calc.InputRad[0].checked) { Calc.TaxableIncome.value = (parseFloat(Calc.AGI.value) - 200000) ; Calc.AmtDue.value = Math.round((parseFloat(Calc.TaxableIncome.value) - 300000) * 0.09) + (300000 * 0.05) ; Calc.AmtLeft.value = (parseFloat(Calc.AGI.value) - parseFloat(Calc.AmtDue.value)) ; Calc.TaxRate.value = (parseFloat(Calc.AmtDue.value) / parseFloat(Calc.AGI.value) * 100).toFixed(2) + " %"; } else { if (Calc.InputRad[1].checked) { Calc.TaxableIncome.value = (parseFloat(Calc.AGI.value) - 400000) ; Calc.AmtDue.value = Math.round((parseFloat(Calc.TaxableIncome.value) - 600000) * .09) + (600000 * 0.05) ; Calc.AmtLeft.value = (parseFloat(Calc.AGI.value) - parseFloat(Calc.AmtDue.value)) ; Calc.TaxRate.value = (parseFloat(Calc.AmtDue.value) / parseFloat(Calc.AGI.value) * 100).toFixed(2) + " %"; } } } function Couple() { var Calc = document.NetIncome; Calc.AGI.value = ""; Calc.TaxableIncome.value = "--------"; Calc.AmtDue.value = "--------"; Calc.AmtLeft.value = "--------"; Calc.TaxRate.value = "--------"; } function Individual() { var Calc = document.NetIncome; Calc.AGI.value = ""; Calc.TaxableIncome.value = "--------"; Calc.AmtDue.value = "--------"; Calc.AmtLeft.value = "--------"; Calc.TaxRate.value = "--------"; } function clearText(thefield){ if (thefield.value==thefield.value) thefield.value = "" } </script> </head> and the html... Code: <body> <form name=NetIncome> <table border=5> <th align=left> <ol> <li>Select Individual or Joint filing status. <li>Enter your Adjusted Gross Income. <li>Submit to calculate. <li>Please reset after each calculation. </ol> </th> <tr> <td><font size=5><input type=radio name=InputRad value=PerHour onclick="Individual()"><u>Individual</u> <input type=radio name=InputRad value=PerYear onclick="Couple()"><u>Joint</u></font></td> </tr> <tr><td><input type=text name=AGI size=30 id="txtExamplethree" onfocus="clearText(this);" onsubmit="TotalGrossPerYear();" onblur="this.value=this.value.replace(/[^\d\.]/g, '');" value="Select filing status" maxlength="20" />Adjusted Gross Income </td></tr> <tr><td><input type=text name=TaxableIncome id="txtExampletwo" readonly="readonly" size=30 value="">Taxable Income</td></tr> <tr><td><input type=text name=AmtDue id="txtExampleone" size=30 readonly="readonly" value="">Amount Due in Taxes</font></td></tr> <tr><td><input type=text name=AmtLeft id="txtExample" size=30 readoanly="readonly" value="">Income after Tax</font></td></tr> <tr><td><input type=text name=TaxRate size=10 readonly="readonly">Tax Rate</td></tr> <tr><td align=center><input type="button" value="Submit" onfocus="TotalGrossPerYear(); formatNumber(); formatNumberone(); formatNumbertwo(); formatNumberthree();" /><input type=reset value="Reset Form"></td></tr> </table> </form> |