JavaScript - Form Button To Work With Enter Key
Hi I have a form setup so that when you enter something in a text field and click a button it checks to see if the value entered in the text field is the "correct" letter and if its right it changes the CSS property of a div container to be shown which then has a link to a the next question. So I don't really have a submit button because my form isn't setup to work with one. This is fine by me but the only problem is when you enter a letter and click enter it acts as a submit and the submit does nothing, which is what it's suppose to do.
So what I'm asking is how can I get that button to respond to an enter instead of the default submit taking over the enter key? Similar TutorialsI have a basic code for geocoding. I use this code for learning. There is only ONE button on the screen My Questions: 1. How can I set focus on this button so it will be activated when I click Enter ? 2. is it possible to initialize the textbox with the clipboard contents when the hta is loaded ? 3. Is it possible to simulate a click on the button each time the hta is loaded ? Here is the code Many thanks !!! Code: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>Gonen title</title> <script src="http://maps.google.com/maps?file=api&v=2.x&key=ABQIAAAAkpclZCcw0Dd8N7urilPb8RTwi2g_12bF65p4zEDwX2jt7cD0dhQvH8snORVwA2VqfU-YMqHbC23bgg" type="text/javascript"></script> <script src="http://www.google.com/uds/api?file=uds.js&v=1.0&key=ABQIAAAAkpclZCcw0Dd8N7urilPb8RTwi2g_12bF65p4zEDwX2jt7cD0dhQvH8snORVwA2VqfU-YMqHbC23bgg" type="text/javascript"></script> <script src="http://www.google.com/uds/solutions/localsearch/gmlocalsearch.js" type="text/javascript"></script> <style type="text/css"> @import url("http://www.google.com/uds/css/gsearch.css"); @import url("http://www.google.com/uds/solutions/localsearch/gmlocalsearch.css");</style> <script type="text/javascript"> //<![CDATA[ var map; var geocoder; function load() { map = new GMap2(document.getElementById("map")); map.setCenter(new GLatLng(38.134557,-95.800781), 3); geocoder = new GClientGeocoder(); map.addControl(new GLargeMapControl()); map.addControl(new GMapTypeControl()); map.addControl(new GScaleControl()) ; // bind a search control to the map, suppress result list } // addAddressToMap() is called when the geocoder returns an // answer. It adds a marker to the map with an open info window // showing the nicely formatted version of the address and the country code. function addAddressToMap(response) { map.clearOverlays(); if (!response || response.Status.code != 200) { alert("Address cannot be geocoded"); } else { place = response.Placemark[0]; point = new GLatLng(place.Point.coordinates[1], place.Point.coordinates[0]); marker = new GMarker(point); map.addOverlay(marker); // place coordinates on clipboard var input = String(place.Point.coordinates) window.clipboardData.setData('Text',input); // will close the window window.close(); marker.openInfoWindowHtml(place.address + '<br />' + '<b>Coordinates:</b> ' + place.Point.coordinates); } } // showLocation() is called when you click on the Search button // in the form. It geocodes the address entered into the form // and adds a marker to the map at that location. function showLocation() { // value from input box // var address = document.forms[0].q.value; // value from clipboard var address = window.clipboardData.getData ("Text") geocoder.getLocations(address, addAddressToMap); } // findLocation() is used to enter the sample addresses into the form. function findLocation(address) { document.forms[0].q.value = address; showLocation(); } //]]> GSearch.setOnLoadCallback(load); </script> <script type="text/javascript"> function getposOffset(overlay, offsettype){ var totaloffset=(offsettype=="left")? overlay.offsetLeft : overlay.offsetTop; var parentEl=overlay.offsetParent; while (parentEl!=null){ totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop; parentEl=parentEl.offsetParent; } return totaloffset; } function overlay(curobj, subobjstr, opt_position){ if (document.getElementById){ var subobj=document.getElementById(subobjstr) subobj.style.display=(subobj.style.display!="block")? "block" : "none" var xpos=getposOffset(curobj, "left")+((typeof opt_position!="undefined" && opt_position.indexOf("right")!=-1)? -(subobj.offsetWidth-curobj.offsetWidth) : 0) var ypos=getposOffset(curobj, "top")+((typeof opt_position!="undefined" && opt_position.indexOf("bottom")!=-1)? curobj.offsetHeight : 0) subobj.style.left=xpos+"px" subobj.style.top=ypos+"px" return false } else return true } function overlayclose(subobj){ document.getElementById(subobj).style.display="none" } </script> </head> <body onload="load()" onunload="GUnload()"> <table> <tr> </tr> </table> <br /> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> <form action="#" onsubmit="showLocation(); return false;" name="geoForm"> <b>Click:</b> <input type="text" name="q" value="" size="0" /> <input type="submit" name="find" value="Get from Clipboard and Map It" /> <br /> </form> <div id="map" style="width: 100%; height: 480px"></div> <hr size=1 align=left width=90% color=#000000 style='border: dotted;'> </form> </body> </html> Hello, I need your help. I basically need, when the enter button is pressed on the keyboard to trigger a button. Currently, my code works but it just refreshes the page and does not actually trigger the desired button: Code: //HERES MY CUSTOM BUTTON: <BUTTON TYPE="submit" onMouseOver="goLite(this.name)" onMouseOut="goDim(this.name)" onclick="javascript:v7_search()" CLASS="btn_std" NAME="btn_search" > ? Search </BUTTON> Here's the code to make the enter button work: Code: <form name="frmIMTS" onkeydown="javascript:if (event.which || event.keyCode){if ((event.which == 13) || (event.keyCode == 13)) {document.getElementById('btn_search').click();}};" > Any help with this is greatly appreciated. Cheers, J Hey: I have several "submit" buttons on a form. I want users to be able to hit the "enter" key to submit the form. The page used to "post" the information checks for specifically what form button was pushed to submit the form before executing the appropriate code. I am automatically submitting the page when the enter key is hit, but it is defaulting to the first option of executed code in the post page. Example - I have an "update" button and a "delete" button on the form. On the post page, I first check to see if the delete button was hit. When I press enter on the form, it simply answers yes to the first question (did they click the delete button), and the code is executed. I really wanted to emulate that the update button was hit. So -- is there a way to hit the enter button, and in the js code, mandate that it was the "update" button that was clicked? Thanks. Hi, Just wondering if you guys can help me to make the following script to work when the enter/return key is pressed, intead of having to click on the button? Code: <Script language=JavaScript> function read_model (form) { ModelVar =form.model_input.value; window.location= ("http://www.sony.co.uk/product/dsc-t-series/" + ModelVar + "/tab/technicalSpecs"); } </script> <form name=model_form action="" method=GET> Enter Sony Model Number (e.g. dsc-tx5): <input type=text name=model_input value="" size=9> <input type=button name=model_button value=Click onClick="read_model(this.form)"> </form> <script language=JavaScript> document.model_form.model_input.focus(); </script> I've searched the net for ways of achieving this, but for some reason none of the code i've tried works..! Also, if this make a difference, the page will mainly be used in Firefox. I'd be really greatfull if someone can help me with this, Thanks! Hi everyone. I'm 100% not a programmer so I need some help with this issue. We have a page for an e-mail newsletter sign up form. The site is built in Joomla. My question : is it possible for a URL link (from say, an email) to send a user to this sign up form and also to fill in a hidden value called channelmemberID? The code is
Code: <input type=hidden name="ChannelMemberID" value="101369"> and I would like to be able to change the value 101369 to anything else. Code samples would be generous and greatly appreciated. The sign up page is here temporarily hosted here http://seoul.directrouter.com/~dancker/?Itemid=82 I am trying to get my form which is in PHP to submit when pressing the Enter key This is what I am using Code: <script type="text/javascript"> function submitFormWithEnter(myfield,e) { var keycode; if (window.event) { keycode = window.event.keyCode; } else if (e) { keycode = e.which; } else { return true; } if (keycode == 13) { myfield.form.submit(); return false; } else { return true; } } </script> PHP Code: <div id='aboutForm'> <span class='headerbox'><b>Your Profile Headline:</b></span> <span class='textbox'><input type='text' name='headline' class='zip' size='67 ' value='$headline' onKeyPress="return submitFormWithEnter(this,event)\"></span> </div> Anyway I can get this to work? Seems to be an issue with the "text" input My problem is the following. I have an editable <div>: <div class='edit' id='divContent' name='divContent' ContentEditable>some text</div> If I press 'enter' two lines are skipped. I know that if I press 'shift+enter' only one line will be skipped. If I check the unformatted code of the contenteditable div, 'enter' gives me <p> and 'shift+enter' gives me <br>, which makes sense because <p> is formatted differently than <br>. So I want to change 'enter' into 'shift+enter' I have already found something to capture and kill 'return' function killReturn() { key = event.keyCode; if (key == 13) return false; } But now for some means to replace the killed 'enter' with 'shift+enter'? Thanks a lot in advance for any advise! I have a form, which has a textarea. Though I'm wanting it to be able to submit with the enter key. Can anyone help me? Everything I've tried either refreshes, or does a linebreak. Heres the code to the whole page, seeing as the form takes up most of it. Code: <? require("scripts/function.s"); $username = $x; $password = $y; require("scripts/verify.s"); ?> <html> <head> <link rel=stylesheet type=text/css href=style.css> <script type="text/javascript" src="http://www.katarra.net/googiespell/AJS.js"></script> <script type="text/javascript" src="http://www.katarra.net/googiespell/googiespell.js"></script> <script type="text/javascript" src="http://www.katarra.net/googiespell/cookiesupport.js"></script> <script language=Javascript> function clearForm(f){ f.action.value = f.nonaction.value; f.nonaction.value = ""; return true; } </script> <script language="javascript" type="text/javascript"> setTimeout( function() { var mytext = document.getElementById("rptext"); mytext.focus(); mytext.select(); } , 1); </script> <style type="text/css"> <!-- a { text-decoration:none; } .style3 {font-size: larger} --> </style> </head> <body> <body onLoad = "focusIt()"> <script language="javascript" type="text/javascript"> //window.alert("hello"); function focusIt() { var mytext = document.getElementById("rptext"); mytext.focus(); } </script> <form action=main.php#thebottom method=post target=TOP name=theForm onSubmit="clearForm(theForm)"> <table width="204" border="0" align="left" cellpadding="10"> <tr> <td width="18" valign="middle"><div align="center"><? echo "<a href=\"main.php?username=$x&password=$y&action=look+at+$x\" target=\"TOP\" style=\"text-decoration:none\">APPEARANCE</a>" ?></div></td> <td width="18" valign="middle"><div align="center"><? echo "<a href=\"main.php?username=$x&password=$y&action=stats\" target=\"TOP\">STATS</a>" ?></div></td> <td width="18" valign="middle"><div align="center"><? echo "<a href=\"main.php?username=$x&password=$y&action=quests\" target=\"TOP\">QUESTS</a>" ?></div></td> <td width="18" valign="middle"><div align="center"><? echo "<a href=\"main.php?username=$x&password=$y&action=who\" target=\"TOP\">WHO</a>" ?></div></td> <td width="20" valign="middle"><div align="center"><? echo "<a href=\"main.php?username=$x&password=$y&action=description\" target=\"TOP\">DESCRIPTION</a>" ?></div></td> </tr> <tr> <td valign="middle"><div align="center"><? echo "<a href=\"main.php?username=$x&password=$y&action=settings\" target=\"TOP\">SETTINGS</a>" ?></div></td> <td valign="middle"><div align="center"><? echo "<a href=\"wiki\" target=\"_blank\">HELP</a>" ?></div></td> <td valign="middle"><div align="center"><? echo "<a href=\"main.php?username=$x&password=$y&action=listmail\" target=\"TOP\">MAIL</a>";?></div></td> <td colspan="2" valign="middle"><div align="center"><span class="style3"><? echo "<b><a href=\"main.php?username=$x&password=$y&action=quit\" target=\"TOP\"><u>LOG OUT</u></a></b>" ?></span></div> <div align="center"></div></td> </tr> </table> <table width="627" border="0" align="right" cellpadding="0"> <tr> <td width="132"><div align="right"><?$admin = get("admin");if($admin == "Y" || $admin == "Y+" || $admin === "special") echo "<a href=\"admin.php\" target=\"TOP\">ADMIN PANEL</a>";?> </div></td> <td width="317" rowspan="3"><div align="center"> <textarea name="nonaction" cols="50" rows="3" wrap="virtual" id="rptext" class="textarea"></textarea> </div></td> <td width="151"><div align="right"></div></td> </tr> <tr> <td><div align="right"> <?$admin = get("admin");if($admin == "Y+") echo "<input type=checkbox name=nolog>";?> </div></td> <td> <input type=submit value=SUBMIT> </a></td> </tr> <tr> <td><div align="right"> <? //<form action=main.php#thebottom method=post><input type=hidden name=username value=$x><input type=hidden name=password value=$y><input type=submit border=0 style=border:0;background-color:#006;color:#FF0;font-family:Tahoma; name=command value=Clear></form> //<a href=\"main.php?username=$x&password=$y&action=clear\" target=\"TOP\">Clear</a> ?> <? echo "<input type=button onclick=\"theForm.action.value='clear';theForm.submit();\" border=0 style=border:0;background-color:#000;color:#FF0;font-weight:bold; value=CLEAR>" ?></div></td> <td><div align="right"> <input type=hidden name=action value=""> <input type=hidden name=username value=<?=$x?>> <input type=hidden name=password value=<?=$y?>> </div></td> <br> </table> </FORM> <div align="center"> <p> </p> <p><a href="https://www.ixwebhosting.com/templates/ix/v2/affiliate/clickthru.cgi?id=jrdelaney" target="_blank"><img src="https://www.ixwebhosting.com/templates/ix/v2/images/banners/88x31-businessplus.gif" border=0 align="absmiddle"></a></p> </div> <script type="text/javascript"> var googie1 = new GoogieSpell("googiespell/", "http://www.katarra.net/sendReq.php?lang="); googie1.decorateTextarea("rptext"); </script> </body> </html> In this Form field, when I select the field box that shows "Enter Text" I'd like it so the text disappears, so I can begin typing in a cleared field box. This is the line of code, I believe, that has to do with that function. Any help with having the Enter Text clear upon selecting, will be appreciated: Code: <input autocomplete="off" id="keyword" name="keyword" value="Enter Text" onclick="clickclear(this, 'Enter Text')" onblur="clickrecall(this,'Enter Text')" /> hey everyone, I am having some trouble with one of my buttons, the one button works fine but my second one doesnt work at all. The second button should open the same page as the first and maximize it. Could someone please help me with this? Thanks. Code: <html> <head> <title>commands</title> <script type="text/javascript"> /* <![CDATA[ */ var maxWindow function createWindow() { var winWidth=300; var winHeight=100; var winLeft = (screen.width-winWidth)/2; var winTop = (screen.height-winHeight)/2; var winOptions = ",width=" + winWidth; winOptions += ",height=" + winHeight; winOptions += ",left=" + winLeft; winOptions += ",top=" + winTop; maxWindow = window.open("MaxWindow.html", "newWindow", winOptions); maxWindow.focus(); } function maximizeWindow() { maxWindow.moveTo(0,0); maxWindow.resizeTo(screen.availWidth,screen.availHeight); maxWindow.focus(); } /* ]]> */ </script> </head> <body> <input type="button" name="Create New Window" value="Create new Window" onclick="createWindow();"/> <input type="button" name="Maximize New Window" value="Maximize New Window" onclick="maximizeWindow();"/> </body> </html> Hi I have a form where I want to force users to accept terms and conditions before they can move on to the next page (submit form). Code: <input tabindex="2" name="agreement" id="agreement" type="checkbox" value="N" onchange="checkAgreement()" /> <label class="checking" for="agreement">I accept the <a tabindex="1" href="?page_id=292" title="read this before you continue" class="popmeup">terms and conditions</a>.</label> <!-- the button to be enabled --> <input tabindex="3" type="button" name="confirmer" value="Confirm" onclick="confirmOrder()" disabled="disabled" /> and the JS that works fine in Firefox. IE enables the button, but it still "looks" disabled, hence it is unlikely that anyone clicks it. Code: function checkAgreement() { if(document.order_form.agreement.checked) { document.order_form.confirmer.disabled = false; //document.order_form.submit.disabled = false; document.order_form.agreement0.value = "Y"; //for testing //document.order_form.confirmer.value = document.order_form.agreement0.value; } else { document.order_form.confirmer.disabled = true; //document.order_form.submit.disabled = true; document.order_form.agreement0.value = "N"; //document.order_form.confirmer.value = document.order_form.agreement0.value; } } any ideas? Whenever I click the Submit button, which should create a new window showing all the details entered in the form, it doesn't work ideas? javascript.html Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>JavaScript</title> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-15"> <!-- The external style sheets --> <link rel="stylesheet" type="text/css" href="mystyle.css"> <script type="text/javascript" src="myjavascript.js"></script> <meta name="keywords" content="CO332"> <meta name="description" content="CO332 Exercise Website"> <meta name="author" content="Bradley Berwick"> </head> <body> <div id="container"> <div id="maincontent"> <div id="header"> <h1> Exercise Website </h1> </div> <div id="leftnav"> <ul> <li><a href="index.html" >Home</a> <li><a href="myjavascript.html" ><span class="currentpage">Services</span></a> <li><a href="#" >TBA</a> <li><a href="#" >TBA</a> </ul> </div> <div id="content"> <h2>About Yourself</h2> <form name="exampleform"> <h3>Name: <input name="yourname" type="text"></h3> <h3>Age: <input name="age" type="text" size="3" Onchange = ' if ( !( this.value > 0 && this.value < 150 ) ) { alert( this.value + " is not a valid age."); this.value=""; // clear age text box }' > </h3> <h3>Gender: <input name="gender" type="radio" value="male"> Male <input name="gender" type="radio" value="female"> Female </h3> <h3>Your favourite colour: <select name="colours"> <option value="None"> <option value="red">Red <option value="green">Green <option value="blue">Blue <option value="pink">Pink <option value="orange">Orange <option value="purple">Purple </select> </h3> <h3>Your hobbies a <br> <input name="running" type="checkbox"> Running <br> <input name="football" type="checkbox"> Football <br> <input name="golf" type="checkbox"> Golf <br> <input name="cycling" type="checkbox"> Cycling </h3> <textarea rows="10" cols="30"> Add comments. </textarea> <p> <input type="reset" value="Clear"> <input name="submit" type="button" value="Submit" onclick='submitForm()';> </p> </form> </div> </div> <div id="footer"> <div id="mailto"> Last updated on 28th Oct 2011<br> Maintained by Bradley Berwick </div> </div> </div> </body> </html> myjavascript.js Code: function displayMessage(msg) { // Open a new window var msgWindow = window.open('', 'Message'); // Write message in the new Window msgWindow.document.write(msg); msgWindow.document.close(); // Raise this window, in case it's not visible msgWindow.focus(); } var hobstring=""; function submitForm() { var nam=document.exampleform.elements["yourname"].value; var age=document.exampleform.elements["age"].value; var gend = document.getElementsByName('gender'); for (var i = 0; i < gend.length; i++) { if (gend[i].checked==true) { var sex=gend[i].value; } } var sel=document.getElementById('color'); var color=sel.options[sel.selectedIndex].value; var hobbs = document.getElementsByName('hobby'); for (var a = 0; a < hobbs.length; a++) { if (hobbs[a].checked==true) { hobstring+=hobbs[a].id+", "; } } var msg="Name: "+nam+"<br>Age: "+age+"<br>Gender: "+sex+"<br>Favorite color: "+color+"<br>Hobbies: "+hobstring; displayMessage(msg); } I have identical code in my index that works, so I'm just guessing the error is somewhere else, I know IE is not the best target to aim for - but I really want this to work in the windows default browser.... Here is the php page... PHP Code: <HTML> <HEAD> <TITLE> Family Home Page </TITLE> <SCRIPT TYPE="text/javascript" SRC="AddFamilyMemeber.js"> </SCRIPT> </HEAD> <BODY> <TABLE> <TR> <TD>Father:</TD> <TD> <SELECT ID="Father"> <?PHP $con=mysql_connect("localhost","XXXX","XXXX"); if (!$con) { die('Could not connect: '.mysql_error()); } mysql_select_db("XXXX",$con); $result=mysql_query("SELECT * FROM FamilyMembers"); while ($row=mysql_fetch_array($result)) { echo "<OPTION VALUE=\"".$row['ID']."\">".$row['FirstName']." ".$row['MiddleName']." ".$row['LastName']."</OPTION>"; echo "<BR/>\n"; } mysql_close($con); ?> </SELECT> </TD> </TR> <TR> <TD>Mother:</TD> <TD> <SELECT ID="Mother"> <?PHP $con=mysql_connect("localhost","XXXX","XXXX"); if (!$con) { die('Could not connect: '.mysql_error()); } mysql_select_db("XXXX",$con); $result=mysql_query("SELECT * FROM FamilyMembers"); while ($row=mysql_fetch_array($result)) { echo "<OPTION VALUE=\"".$row['ID']."\">".$row['FirstName']." ".$row['MiddleName']." ".$row['LastName']."</OPTION>"; echo "<BR/>\n"; } mysql_close($con); ?> </SELECT> <TD> </TR> <TR> <TD>FirstName:</TD> <TD><INPUT TYPE="text" ID="FirstName"/></TD> </TR> <TR> <TD>MiddleName:</TD> <TD><INPUT TYPE="text" ID="MiddleName"/></TD> </TR> <TR> <TD>LastName:</TD> <TD><INPUT TYPE="text" ID="LastName"/></TD> </TR> </TABLE> <BUTTON TYPE="button" ONCLICK="Submit()">Submit</BUTTON> <BUTTON TYPE="button" ONCLICK="Abort()">Abort</BUTTON> </BODY> </HTML> and here is the javascript that works in the index but not here... Code: function Abort() { document.location="AddFamilyMember.php"; }; When I load the page everything looks ok, but click on the abort button, and all that happens is that the little error symbol pops in the lower left of IE. The names of the two files are "AddFamilyMember.php" and "AddFamilyMember.js". Sorry, but I honestly can't see where the problem is.... 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. I checked the code for hours and I can't figure out why the form doesn't work. Please, I need help, I need to finish this page. Inside the input form there is a div using visibility:hidden. The div works perfectly when it is selected (show or hide), not problem. The problem is when press the send button the form doesn't send anything, not respond, do nothing!. Any help? Voting button on the poll in the left column works fine if you take the sharethis javascripts out. Why won't they work together though? <script type="text/javascript" src="http://www.claimsheaven.co.uk/polls/admin/script.js"></script> <script type="text/javascript">var switchTo5x=true;</script> <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> <script type="text/javascript" src="http://s.sharethis.com/loader.js"></script> e.g. on this page: http://www.claimsheaven.co.uk/news/20120305.php I am no javascript expert, very much a beginner. I am trying to incorporate some into a web-based form. The problem is the button I created to add extra fields does not work, and I can't find exactly where the problem is. I'm in need of some help from a javascript guru. Help me enjoy my Friday afternoon by solving this! The javascript is mostly borrowed and slightly altered, the "additem" I wrote myself so that is probably where the problem lies! Here is the html: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1"/> <title></title> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon"/> <link rel="stylesheet" type="text/css" href="style.css"/> <script type="text/javascript"> function showAsset(id,str) { if (str=="") { document.getElementById("assetinfo"+id).innerHTML=""; return; } if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("assetinfo"+id).innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","getasset.php?q="+str,true); xmlhttp.send(); } var noFields = "5"; function additem() { var fieldrow = document.createElement('tr'); var fieldcolumn1 = document.createElement('td'); var fieldinput = document.createElement('input'); fieldinput.name = "asset"; fieldinput.onChange = "showAsset("+noFields+",this.value)"; var fieldcolumn2 = document.createElement('td'); fieldcolumn2.id = "assetinfo"+noFields; fieldcolumn1.appendChild(fieldinput); var fieldcolumns = fieldcolumn1 + fieldcolumn2; fieldrow.appendChild(fieldcolumns); var addbefore = document.getElementById('fieldend'); document.body.insertBefore(fieldrow, addbefore); noFields = noFields++; } </script> </head> <body> <form> <table> <tr> <td><input name="asset" onChange="showAsset(1,this.value)"></td> <td id="assetinfo1"></td> </tr> <tr> <td><input name="asset" onChange="showAsset(2,this.value)"></td> <td id="assetinfo2"></td> </tr> <tr> <td><input name="asset" onChange="showAsset(3,this.value)"></td> <td id="assetinfo3"></td> </tr> <tr> <td><input name="asset" onChange="showAsset(4,this.value)"></td> <td id="assetinfo4"></td> </tr> <tr> <td><input name="asset" onChange="showAsset(5,this.value)"></td> <td id="assetinfo5"></td> </tr> <tr id="fieldend"> <td><input id="addfield" type="button" value="add item" onClick="addfield()"></td> </tr> </table> </form> </body> </html> Here is the associated getasset.php: Code: <?php $q=$_GET["q"]; $con = mysql_connect('localhost', 'root', 'root'); if (!$con) { die('Could not connect: ' . mysql_error()); } mysql_select_db("assettracking", $con); $sql="SELECT * FROM assets WHERE assetID = '".$q."'"; $result = mysql_query($sql); while($row = mysql_fetch_array($result)) { echo "<b>".$row['make'] ." ".$row['model'] ." - ".$row['serialnumber']."</b> | Status: ".$row['statusID']." | Comments: ".$row['comments']; } mysql_close($con); ?> 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! Code: <html> <body> var j=0; var temp,temp2,temp3; <script> function scor(j) { switch(j) { case 1: alert("Απαντήσατε σωστά μόνο σε μία ερώτηση.Προσπαθήστε πάλι"); break; case 2: alert("Απαντήσατε σωστά στις δύο από τις τρείς ερωτήσεις"); break; default: alert ("Συγχαρητήρια απαντήσατε σωστά και στις τρεις ερωτήσεις"); } } </script> <meta http-equiv="content-type" content="text/hmtl; charset=iso-8859-7"> <p align="center"><font size="5">Σε μία σελίδα html πόσα είναι τα μέγιστα frames που μπορούμε να τοποθετήσουμε; </p></font> <form name="for1"> <input type="radio" name="fr1"value="1" > 5 <br> <input type="radio" name="fr1"value="2" > Όσα τα pixels<br> <input type="radio" name="fr1"value="3" > Δεν υπάρχει όριο<br> <input type="button" value="Εκχώρηση Απάντησης" onClick="getVal1()"> </form> <script type = "text/javascript"> function getVal1() { for(var i=0; i<document.for1.fr1.length; i++) { if (document.for1.fr1[i].checked) { if (document.for1.fr1[i].value==2) { j++; } } } } function getVal2() { for (var i=0;i<document.for2.fr2.length;i++) { if (document.for2.fr2[i].checked) { if (document.for2.fr2[i].value==2) { j++; } } } } function getVal3() { for (var i=0;i<document.for3.fr3.length;i++) { if (document.for3.fr3[i].checked) { if (document.for3.fr3[i].value==3) { j++; } } } } </script> <p align="center"><font size="5"> Είναι απαραίτητο σε κάθε σελίδα html να υπάρχουν τα tags head και title;</p></font> <form name="for2"> <input type="radio" name="fr2" value="1"> Ναι <br> <input type="radio" name="fr2" value="2"> Όχι <br> <input type="button" value="Εκχώρηση Απάντησης" onClick="getVal2()"> </form> <p align="center"><font size="5"> Τι κάνει το εξής tag: meta http-equiv="content-type" content="text/hmtl; charset=iso-8859-7" </p></font> <form name="for3"> <input type ="radio" name="fr3" value="1"> Δημιουργεί τις προυποθέσεις για την απόκτηση τιμών <br> <input type ="radio" name="fr3" value="2"> Ισσοροπεί τις παραγράφους σε στήλες <br> <input type ="radio" name="fr3" value="3"> Επιτρέπει την κωδικοποίηση ελληνικών χαρακτήρων στην ιστοσελίδα <br> <input type="button" value="Εκχώρηση Απάντησης" onClick="getVal3()" </form> <input type ="button" value="Υπολογισμός" onClick="scor(j)"> Apart from any logical mistakes this thing i have created might have , my question is this.Why upon pressing the last button and calling the "scor(j)" function , no alerts pop up?Thanks in advance. I'm completely stumbled by this as i have no clue as what might be wrong.But then again , my experience is extremely limited |