JavaScript - [b] Onsubmit() ... Doesnt Work [/b]
<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> Similar TutorialsIm new to javascript and trying to make a form validator, ive succeeded but its left me confussed as to setting variables. my original code was Code: function applyform() { var name = document.getElementById('mainname'); var lvl = document.getElementById('mainlvl'); var class = document.getElementById('mainclass'); var role = document.getElementById('mainrole'); var reason = document.getElementById('reason'); var age = document.getElementById('age'); var mic = document.getElementById('microphone'); var voice = document.getElementById('voice'); if(notempty(name, "Please enter your main characters name")){ if(dropselect(lvl, "Please select your characters level")){ if(dropselect(class, "Please select your characters class")){ if(dropselect(role, "Please select your characters role")){ if(notempty(reason, "Please tell us why you wish to join us")){ if(notempty(age, "Please state your age")){ if(notempty(mic, "Please state if you have a microphone")){ if(notempty(voice, "Please state if you will use voice communication during events")){ return true; } } } } } } } } return false; } using this stoped all my javascript functions working but i cant see any fault with it. I've changed the code now to Code: function applyform() { if(notempty(document.getElementById('mainname'), "Please enter your main characters name")){ if(dropselect(document.getElementById('mainlvl'), "Please select your characters level")){ if(dropselect(document.getElementById('mainclass'), "Please select your characters class")){ if(dropselect(document.getElementById('mainrole'), "Please select your characters role")){ if(notempty(document.getElementById('reason'), "Please tell us why you wish to join us")){ if(notempty(document.getElementById('age'), "Please state your age")){ if(notempty(document.getElementById('microphone'), "Please state if you have a microphone")){ if(notempty(document.getElementById('voice'), "Please state if you will use voice communication during events")){ return true; } } } } } } } } return false; } this works fine but i don't get why my first bit of code didnt work and id really appreciate someone explaining it to me. thanks in advance Can anyone please tell me what im doing wrong? Code: <script type = "text/javascript"> function submitallforms() { setTimeout('document.forms[0].submit()',100); setTimeout('document.forms[1].submit()',200); setTimeout('document.forms[2].submit()',300); } </script> <NOSCRIPT>This shopping-cart needs JavaScript. Please enable JavaScript in your browser's preferences.</NOSCRIPT> <script> if(typeof navigator.cookieEnabled=="boolean" && !navigator.cookieEnabled) alert("You need to enable Cookies in your browser, before this shopping-cart will work for you!"); </script> <!-- <script src=noper-language-pdt.utf8.js></script> --> <script src=http://www.mlpdecals.com/cgi/nopercart.js></script> <FORM name="0" action="shoppingcart.htm" method=GET onSubmit="return AddToCart(this)"> <font class=bigtext><b>Special Instructions:</b></font><br> <input type=text size=32 maxlength=200 name=USERTEXT> <input type=hidden _PRICE="0.00" _QUANTITY="1" _NAME="special-instructions" _ID="nSPCI"> </FORM> <br><br> <FORM name="0" action="shoppingcart.htm" method=GET onSubmit="return AddToCart(this)"> <font class=bigtext><b>Special Instructions:</b></font><br> <input type=text size=32 maxlength=200 name=USERTEXT> <input type=hidden _PRICE="0.00" _QUANTITY="1" _NAME="special-instructions" _ID="nSPCI"> </FORM> <br> <br> <input type=submit value="Submit" onclick="submitallforms();"> I use a basic pop-up window code that i have used for many years. I probably need to update it, but i was wondering why it will work for every browser but IE8. Can anyone help? Code: function popUp(URL) { day = new Date(); id = day.getTime(); eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=0,location=0,statusbar=1,menubar=0,resizable=0,width=600,height=400,left = 540,top = 325');"); } Code: <a href="javascript:popUp('/email/agent/aid/<?php echo $this->agent->pers_code?>')" > can anyone see something that may cause the problem? Thanks for any help! Hey guys I have a stupid problem, my teacher asked us to DONT use javadscript in html (like onchange ="....") If i use following js in html my page works: <select id="car" name="car" onchange="configurator()"> If i delete that last piece and try to code it in a .js file like: document.getElementsById("car").onchange = configurator; it doesnt work, it doest recognize the .onchange method Thanks in advance I have a problem with one simple script, which works in every browser, just not in IE6 and IE7. You can see the script at http://bbtalk.eu/iframe.html - when you click on the iframe, you should see "clicked at the bottom". But it doesnt work in IE6 and IE7. Do anyone know how to fix that? Thank you
Trying to have my navigation have an on click and selected state, but I am not able to do so with this code (website is: http://bit.ly/rgwsite ) Code: $('nav li a').click(function() { $(this).parent().addClass('on').siblings().removeClass('on'); }); nav li is as follows Code: <nav> <li class="highlt"> <a href="index.php" class="home"><span>Home</span></a> </li> The reason we need to use a jquery/javascript action to add the class to the navigation is because it doesn't refresh when a new page loads. For instance, when you're on the home page and click on the tab "Experience RGW", it only loads the content for that page below the header (within the "#ajax" div). Currently, none of these scripts are working. There is no reason they shouldn't... could there be something else causing the page not to recognize the jquery script and run it on-click? The main reason I ask is because I've tried to test the function and add an alert, but even that didn't work function hasTagsInText(text) { if(text.indexOf("<TABLE") >=0 || text.indexOf("<table") >=0) return 'table'; ///this line of code doesnt work in firefox Hi All, Im trying to add some content by JS (which ive done) but i cant click a link i have made; JS: Code: function game() { document.getElementById('title').innerHTML = '<p style="float: left; text-decoration: underline; font-weight: bold;">Deady Teddy</p><img src=css/images/popup/close.png style="float: right; cursor: hand;" href="javascript: hideModal("modalPage");"></img>'; } *Yes i know about the Href but if i put "onClick" it gives errors*; HTML: Code: <a href="javascript:void(0);" onClick="javascript: revealModal('modalPage'); game();">Deady Teddy </a> And place its adding it to: Code: <div id="modalPage"> <div class="modalBackground"></div> <div class="modalContainer"> <div class="modal"> <div class="modalTop" id="title" onselectstart='return false'> </div></div></div></div> Any Idea's? this is my code ______________________________________________________________ <pega:when test="$mode-input"> <script language="JavaScript"> function showNextButton() { handleClientEvent('SERVER','MakeScoreOrder','','-1'); /* fetches the data */ var submitClicked = "<p:r n='pyWorkPage.PFRSData.SubmitClicked' />"; var submitClicked = submitClicked.replace(/^\s\s*/, '').replace(/\s\s*$/, ''); var msg = "<p:r n='pyWorkPage.PFRSData.HasMessages' />"; var msg = msg.replace(/^\s\s*/, '').replace(/\s\s*$/, ''); if (submitClicked == "" || msg =="true") { toggleSubmitBtn(0); } else if (submitClicked == "true" || msg =="false") { toggleSubmitBtn(1); } } function toggleSubmitBtn(status) { var submitButton=document.actionForm.submitButton; if(submitButton) { var parentTable=pega.u.d.findParentTable(submitButton); if(parentTable) if(status) { if(parentTable.style.display=='none' || parentTable.style.display=='') { parentTable.style.display='inline'; document.actionForm.submitButton.disabled=false; } } else { parentTable.style.display='none'; document.actionForm.submitButton.disabled=true; } } } </script> <button onClick="showNextButton();" id="PISSubmit" style="vertical-align:middle;"> <span class='buttonLeft'></span> <span class='buttonMiddle'> <span class='buttonText' onmouseover="this.className='buttonTextHover'" onmouseout="this.className='buttonText'">Submit</span> </span> <span class='buttonRight'></span> </button> </pega:when> ___________________________________________________________ On clicking PISsubmit button it should fetch data and display the next button(submitButton).. but on first click nothing happens on second click it fetches the data and third click it displays Next(submitButton)button. Kindly help !! Note: its in pega application. Hello here is my code that im dealing with and only second sliceshow works for me i need them both that would be working together please help me! thanks for any help here is my script <head> <title>Easy Slider jQuery Plugin Demo</title> <meta http-equiv="content-type" content="text/html;charset=UTF-8" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/easySlider1.7.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#slider").easySlider({ auto: true, continuous: true, nextId: "slider1next", prevId: "slider1prev" }); }); </script> <link href="css/screen.css" rel="stylesheet" type="text/css" media="screen" /> <link rel="stylesheet" type="text/css" href="leidyba/css/demo.css" /> <link rel="stylesheet" type="text/css" href="leidyba/css/styleleidyba.css" /> <link rel="stylesheet" type="text/css" href="leidyba/css/jquery.jscrollpane.css" media="all" /> <link href='http://fonts.googleapis.com/css?family=PT+Sans+Narrow&v1' rel='stylesheet' type='text/css' /> <link href='http://fonts.googleapis.com/css?family=Coustard:900' rel='stylesheet' type='text/css' /> <link href='http://fonts.googleapis.com/css?family=Rochester' rel='stylesheet' type='text/css' /> <div id="container"> <div id="header"> <h1>Easy Slider jQuery Plugin - Multiple sliders</h1> </div> <div id="content"> <div id="slider"> <ul> <li><a href="http://templatica.com/preview/30"><img src="slide/images/01.jpg" alt="Css Template Preview" /></a></li> <li><a href="http://templatica.com/preview/7"><img src="slide/images/02.jpg" alt="Css Template Preview" /></a></li> <li><a href="http://templatica.com/preview/25"><img src="slide/images/03.jpg" alt="Css Template Preview" /></a></li> </ul> </div> <div class="container"> <div id="ca-container" class="ca-container"> <div class="ca-wrapper"> <div class="ca-item ca-item-1"> <div class="ca-item-main"> <div class="ca-icon"></div> <h3>Knygų leidyba</h3> <h4> <span class="ca-quote">“</span> <span>The greatness of a nation and its moral progress can be judged by the way in which its animals are treated.</span> </h4> <a href="#" class="ca-more">plačiau...</a> </div> <div class="ca-content-wrapper"> <div class="ca-content"> <h6>Knygų leidyba</h6> <a href="#" class="ca-close">close</a> <div class="ca-content-text"> <p>I am so happy, my </p> <p>When, while the </p> <p>She packed her .</p> </div> <ul> <li><a href="#">Read more</a></li> <li><a href="#">Share this</a></li> <li><a href="#">Become a member</a></li> <li><a href="#">Donate</a></li> </ul> </div> </div> </div> <div class="ca-item ca-item-2"> <div class="ca-item-main"> <div class="ca-icon"></div> <h3>Reklaminiai bukletai</h3> <h4> <span class="ca-quote">“</span> <span>I hold that the more </span> </h4> <a href="#" class="ca-more">plačiau...</a> </div> <div class="ca-content-wrapper"> <div class="ca-content"> <h6>Would you eat your dog?</h6> <a href="#" class="ca-close">close</a> <div class="ca-content-text"> <p>I am so happy, my .</p> <p>When, while the </p> <p>She packed her </p> </div> <ul> <li><a href="#">Read more</a></li> <li><a href="#">Share this</a></li> <li><a href="#">Become a member</a></li> <li><a href="#">Donate</a></li> </ul> </div> </div> </div> </div> </div> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> <script type="text/javascript" src="leidyba/js/jquery.easing.1.3.js"></script> <!-- the jScrollPane script --> <script type="text/javascript" src="leidyba/js/jquery.mousewheel.js"></script> <script type="text/javascript" src="leidyba/js/jquery.contentcarousel.js"></script> <script type="text/javascript"> $('#ca-container').contentcarousel({ }); </script> </div> </body> </html> 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. 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 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');"> 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 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... 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> 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 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"?
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. |