JavaScript - Using Niceforms A Onchange Problem
Hello all,
i'm starting to use Niceforms solving for the better appearance of my forms (http://www.emblematiq.com/lab/niceforms/help/) In my page i have for example this form Code: <form action="<?echo $_SERVER["REQUEST_URI"]?>" method="post" class="niceform"> <label>order by:</label> <select size="1" name="orderby" onchange="this.form.submit()"> <option value="name"> Vzestupně </option> <option value="name1"> Sestupně </option> </select> <input type = "hidden" name = "akce4" value = "zmena_razeni_prodejci" /> </form> I modified this form follows (how it descibed http://www.emblematiq.com/lab/niceforms/help/): Code: <form action="<?echo $_SERVER["REQUEST_URI"]?>" method="post" class="niceform"> <label>order by:</label> <select size="1" name="orderby" class="NFOnChange" > el.lnk._onclick = el.onclick || function () { if(this.ref.oldClassName == "NFOnChange") { "this.form.submit()" }}; <option value="name"> Vzestupně </option> <option value="name1"> Sestupně </option> </select> <input type = "hidden" name = "akce4" value = "zmena_razeni_prodejci" /> </form> Author Niceforms wrote about onchange: By default, Niceforms overrides the onchange attributes of any drop down options, thus making a classic jump menu unusable. However, there is a quick workaround. Add a custom class name to that particular select element (i.e. class="NFOnChange") so that the script can separate it from all the other regular select elements. Within the option(el, no) function, add the following code: Code: el.lnk._onclick = el.onclick || function () { if(this.ref.oldClassName == "NFOnChange") { //insert your code here }}; Instead of the commented line simply insert your own custom javascript that should be executed when that particular option is selected. but i dont know how it must be edited. I think that there is a syntax problem in "this.form.submit()". i dont know how i can change it. Because now i have a beutiful form but when i try to change option it nothing happens. Could somebody help me? Im beginner in programming javascript.......thank you very much...Petr Similar TutorialsI need the code to run a few functions on change, the box is a "date picker" and I unsure how to add my onchange function without breaking the date picker, can anyone help ? Code: p>end date:</p> <input id='secondDate' type="text" size="25"><a href="javascript:NewCal('secondDate','ddmmyyyy')"><img src="images/cal.gif" width="16" height="16" border="0" alt="Pick a date" onchange="dateDiff() ;calculate() ;deposit() ;milecharge() ;agecheck()"></a> I'm trying to figure out how to call multiple functions within the same onchange attribute, associated in the same select object. I have a drop-down menu in which I can select MN, WI, and Other. I've worked it now so that when I select MN, a new drop-down menu appears in which I can select one of MN's Counties. I want to be able to do the same with WI and Other, but my code is only calling MN. Here it is: Code: <html> <head> <script="text/javascript"> function showMN(select) { select.form.MN.value=""; // reset the text box value document.getElementById("MNBox").style.display = select.value == "MN" ? "inline" : "none"; } function showWI(select) { select.form.WI.value=""; // reset the text box value document.getElementById("WIBox").style.display = select.value == "WI" ? "inline" : "none"; } function showOther(select) { select.form.otherState.value = ""; // reset the text box value document.getElementById("otherBox").style.display = select.value == "Other" ? "inline" : "none"; </script> </head> <body> <select name="state" onchange="showMN(this);showWI(this);showOther(this)"> <option value="" selected="selected">Choose...</option> <option value="MN">MN</option> <option value="WI">WI</option> <option value="Other">Other</option> </select><font color="red">*</font> <span id="MNBox" style="display:none"> County: <select name="MN"> <option value="" selected="selected">Choose...</option> <option value="List of MN Counties">List of MN Counties</option> </select><font color="red">*</font> <span id="WIBox" style="display:none"> County: <select name="WI"> <option value="" selected="selected">Choose...</option> <option value="List of WI Counties">List of WI Counties</option> </select><font color="red">*</font> <span id="otherBox" style="display:none"> <input type="text" name="otherState" placeholder="Enter state here"/><font color="red">*</font> <input type="text" name="otherCounty" placeholder="Enter County here"</span> </body> </html> Am I even close? Problem with onchange Javascript Hi, I have a variable declarared called minute which chanches every 3 minutes. if the variable output changes i want to call a href not using onclick but my trigger the change of my varable "minute" in detail <div> <input type="text" size="11" id="loadvideoid" value="u1zgFlCw8Aw" /> <a href="javascript:void(0)" onclick="loadNewVideo(document.getElementById('loadvideoid').value, document.getElementById('startseconds').value)"><- Load video</a> | Start at: <input type="text" size="4" id="startseconds" value="0" /> </div> The part of the script above is coming from http://code.google.com/intl/nl/apis/...example_1.html Have sombody a hint or a script for me how to do this PS i am a newbee, and want to learn !!! Thanks in advance Simon Netherlands Hoorn Hi All, Need a bit of help here, need this SELECT to submit the page and end up at the below URL, correctly passing the GET values through the string. <code> <select name="dir-fact-misma" id="dir-fact-misma" class="text100" tabindex="" onChange="alta_nueva.action='alta.php?page=p2#alta'; return true;"> <option value="Si" <?php if(!isset($_POST['dir-fact-misma']) || $_POST['dir-fact-misma'] == 'Si') print "Selected='Selected '"; ?>>Si</option> <option value="No" <?php if(isset($_POST['dir-fact-misma']) && $_POST['dir-fact-misma'] == 'No') print "Selected='Selected '"; ?>>No</option> </select> </code> the form in which this SELECT is placed needs to be submitted so that other fields in the form are not lost, they are saved in Session Variables. the same javascript but activated through an onclick event works perfect elsewhere in the same form with the following code, i think its the onChange that doesn't work for some reason. <code> <input name="p1" type='submit' id="p1" onclick="alta_nueva.action='alta.php?page=p1#alta'; return true;" value='1' /> </code> the page is programmed in PHP. Any help is appreciated. Hi all, I have the following code: Code: <html> <head> <title>Page Title</title> <script type='text/javascript'> mymusic=[]; tracks=[]; mymusic=[{title:"a",artist:"b",artwork:"c",tracks:[{tracktitle:"d",trackmp3:"e"},{tracktitle:"x",trackmp3:"z"}]},{title:"f",artist:"g",artwork:"h",tracks:[{tracktitle:"i",trackmp3:"j"}]}]; function nowplaying(trackindex,albumindex){ q+="<html><head></head><body><p>Song:</p>"; q+="<p>"+mymusic[albumindex].tracks[trackindex].tracktitle+"</p>"; q+="<p>from Album:</p>"; q+="<p>"+mymusic[albumindex].title+"</p>"; q+="<img src=\""+mymusic[albumindex].artwork+"\">"; with(document.getElementById('nowplays').contentDocument){ open(); write(p); close(); } } function anything(i){ p=""; p+="<html><head></head><body><form><select onchange='parent.nowplaying(this.selectedIndex,i);' size='"; p+=mymusic[i].tracks.length+1+"'>"; p+="<option>Choose a song...</option>"; for(j=0;j<mymusic[i].tracks.length;j++){ p+="<option>"+mymusic[i].tracks[j].tracktitle+"</option>"}; p+="</select></form></body></html>"; with(document.getElementById('songs').contentDocument){ open(); write(p); close(); } } function showinitial(){ s=""; s+="<html><head></head><body><form><select onchange='parent.anything(this.selectedIndex-1);' size='"; s+=mymusic.length+1+"'>"; s+="<option>Choose an artist...</option>"; for(i=0;i<mymusic.length;i++){ s+="<option>"+mymusic[i].title+"</option>"}; s+="</select></form></body></html>"; alert(s); with(document.getElementById('albums').contentDocument){ open(); write(s); close(); } } </script> </head> <body onload="showinitial();"> <style type='text/css'> div { padding:0;margin:0; } .container { position:relative; width:100%; height:100%; } .topcontainer { height:65%; } .box { float:left; width:32%; height:90%; padding:5px; border:1px solid black; overflow:scroll; } .bottom { height:35%; border:1px solid black; } </style> <div class="container"> <div class="topcontainer"> <div class="box"><p>Albums:</p><iframe id='albums'>hi </iframe></div> <div class="box"><p>Songs:</p><iframe id='songs'></iframe></div> <div class="box"><p>Now Playing:</p><iframe id='nowplays'></iframe></div> </div> <div class="bottom"></div> </div> </body> </html> which, as you will see if you run it, creates an iframe-based media player based on a collection of albums, and songs within these albums (I just used letters to define these albums and songs in the mymusic array, for simplicity). Focusing on the top 3 iframes, the way I have set out the user interaction is to generate the HTML for forms of available albums and songs using Javascript, and write them to the iframes in the body. This nearly works fine: if you run it and make a selection in the 'Albums' menu, you will see that the options this causes to display in the 'Songs' menu correspond with the mymusic array, so this works. However, when I choose a song, the function "nowplaying(trackindex,albumindex)" should be called using an onchange event in the 'Songs' form, in the exact same way as in the form generated using "showinitial()"...but the function isn't called. I have ruled out the coding of "nowplaying" itself as a cause, because even when I change "nowplaying" to sth simple like alert("hello"), with no variables or anything being passed in, it still doesn't call. So this leads me to think the problem is with the onchange attribute in "anything", but I can't see what the problem is. The way I coded it is no different to before, and that worked fine, so why won't this work? Any help would be much appreciated! Hi folks. I'm working on a calculator and need to use the 'onchange' function. Basically, the user selects the year (id=taxYear) and once the year is select (default is 2008) this year will appear in 2 different lines of the page under 2 seperate ID's(ageYear & totalYear). I've looked at a few example of the function but I'm still not sure how to approach it. At the moment the year changes once I hit the 'calculate' button but the onChange would obviously offer a better alternative with the date changing once 'taxYear' is changed. here is the script; Code: //check the year var taxYear = document.getElementById('taxYear').options[document.getElementById('taxYear').selectedIndex].value; document.getElementById('ageYear').innerHTML = taxYear; document.getElementById('totalYear').innerHTML = taxYear; Here is the jsp; Code: <tr> <td align="left" width="203" colspan=""><p> Your Tax Year: </p></td> <td align="left" > <s:select name="taxYear" id="taxYear" list="#{'2008':'2008', '2009':'2009'}" theme="simple" />* </td> </tr> <tr> <td align="left" width="203"><p> Age at December 31st <span id="ageYear"></span></p></td> <td align="left" colspan="1"> <s:textfield name="age" id="age" theme="simple" cssClass="text" value="30" /> * <div id="errorage" class="warningmessage" style="display:none"> Please enter your Age to proceed. </div> </td> </tr> <tr> <td colspan="2" class="basicboldtext"> <br/> The total pension contribution you can make for year <span id="totalYear"></span> is €<span id="totalTax2"></span> <br/> </td> </tr> Appreciate any help on this! I have a onChange value
Code: var people = [ ["Timothy Conner", "1999-Present", "Age: 12", "Male", ""], ["Andrew Conner", "1992-Present", "Age: 19", "Male", ""] ]; var how = "Brothers"; function find() { if(document.getElementById("name").value == people [0] [0]) { document.getElementById("desc").value = people [0] [1] + " " + people [0] [2] + " " + people [0] [3]; } if(document.getElementById("name").value == people [1] [0]) { document.getElementById("desc").value = people [1] [1] + " " + people [1] [2] + " " + people [1] [3]; } document.getElementById("relateb").value = document.getElementById("name").value; } Code: Name: <input type="text" id="name" value="" onChange="find()"/> So for it to proses a name you must click out of a box is ther a way to make it instead of when you click out of it, it would immidiatly change? Code: <input type = "text" style ='display:none;' onchange="display_data_from_server(this.value)"/> Value inside that input is cahanged from js. Is there any reason that onchange would not happen ? i mean, it does not. Hi there - this seems like it should be an obvious problem - can anyone spot it? I have an object, declared this way: Code: var FK_gid = new picChooser('FK_gid', FK_gidArray); FK_gid.init(); and a select group like this: Code: <select id = "FK_gid" name = "FK_gid"> <option value="none" selected="true" >None</option> <option value="335" >pics/zoobins.jpg</option> etc. etc. </select> picChooser in construction sets the onchange of the select group like this: Code: this.list = document.getElementById('FK_gid'); this.list.setAttribute("onchange", "FK_gid.displayImage();"); and the object's displayImage(); is like this: Code: this.displayImage = function () { this.clearImage(); if (this.list.selectedIndex != 0) { pic = new Image(); pic.src = this.reformat(this.list.options[this.list.selectedIndex].innerHTML); img = document.createElement("img"); img.src = pic.src; this.preview.appendChild(img); } } But whenever I choose something else off the list I get this error message: Code: TypeError: Result of expression 'FK_gid.displayImage' [undefined] is not a function. It's bizarre because when I type FK_gid.displayImage(); into Safari's dynamic console the function works perfectly... Any ideas? Thanks Edd Hi I'm a newbie. Please help me. I'm using Joomla. I've got a dropdown which reads the filename from the database. When the user selects it I want an onchange event to open the pdf. I've been at it for 2 days now. Code: <?php $con = mysql_connect('localhost', 'root', ''); if (!$con) { die('Could not connect: ' . mysql_error()); } mysql_select_db("metnet", $con); $sql="SELECT * FROM newsletter"; $result = mysql_query($sql); echo "<form method='post'>"; $dropdown = "<select name='sname' onChange='location(this.form.sname)' >"; while($row = mysql_fetch_assoc($result)) { $dropdown .= "\r\n<option value='{$row['fpath']}'>{$row['fpath']}</option>"; } $dropdown .= "\r\n</select>"; echo $dropdown; ?> i keep getting the following error: - there is no attribute "onChange" Code: <select name="type" id="type" onChange="gettype('type');"> <option selected="selected">--Car type--</option> <option value="1">Bmw</option> <option value="2">Merc Blinds</option> <option value="3">Ford</option> <option value="4">Saab</option> </select> All, If I have the following code: Code: <form name="datatoshow" id="datatoshow"> Want to learn more about the sie? Use the drop down menu:<br /> <select name="thingtoshow" onchange="javascript:showvalues(this.datatoshow);"> <option value="home">Home</option> <option value="help">Help!</option> <option value="refer">Refer a Friend</option> </select> </form> This doesn't do anything on the onchange. The code it's supposed to send to is: Code: function showvalues(selObj){ alert("it gets here"); var valuetoshow; valuetoshow = "valuetoshow="+selObj.options[selObj.selectedIndex].value; alert(valuetoshow); makePOSTRequest('showhome.php', valuetoshow); } This is in external js file. For some reason it doesn't send it and the alert never gets triggered. Thanks. Hi, I am trying to copy the value of one textbox to another using onchange event. For some reason, my code does not work, please let me know where I went wrong. here is my code: Code: <html> <head> <script type="text/javascript"> function copyText() { document.getElementById("field2").value=document.getElementById("field1").value; } </script> </head> <body> Field1: <input type="text" id="field1"/><br /> Field2: <input type="text" id="field2" onchange="copyText()"/> </body> </html> Thank you. I have an onchange event JS working fine in IE, but not in FF. It's intended to reset an input field to zero when an adjacent drop-down menu value is changed. I've spent a half-hour looking for answers, and nothing has worked. Decided to post here in the hope there is a quick solution I've overlooked. TIA. Code: function resetInput() { y = document.getElementById("baseInput"); y.setAttribute("value","0"); } And the HTML... Code: <select id="baseMethod" onchange="resetInput()"> <option value="baseGrowth" selected="selected">Annual Growth Rate (%)</option> <option value="baseTarget">Target Year Projection</option> </select> <input type="text" name="baseInput" id="baseInput" value="0" size="14" maxlength="14" /><br /> How can i change this code to do not duplicate the boxes when one option is selected in the same box as before? http://www.plpgolfandturf.com.au/rr/rrboxes_test.php Code: <script type="text/javascript"> function SetHTML2(type) { //document.getElementById("1").style.display = "none" //document.getElementById("2").style.display = "none" //document.getElementById("3").style.display = "none" //document.getElementById("4").style.display = "none" //document.getElementById("1.1").style.display = "none" //document.getElementById("1.2").style.display = "none" //document.getElementById("1.3").style.display = "none" //document.getElementById("1.4").style.display = "none" document.getElementById("2.1").style.display = "none" document.getElementById("2.2").style.display = "none" document.getElementById("2.3").style.display = "none" document.getElementById("2.4").style.display = "none" document.getElementById("3.1").style.display = "none" document.getElementById("3.2").style.display = "none" document.getElementById("3.3").style.display = "none" document.getElementById("3.4").style.display = "none" document.getElementById("4.1").style.display = "none" document.getElementById("4.2").style.display = "none" document.getElementById("4.3").style.display = "none" document.getElementById("4.4").style.display = "none" document.getElementById("1.1.1").style.display = "none" document.getElementById("1.1.2").style.display = "none" document.getElementById("1.1.3").style.display = "none" document.getElementById("1.1.4").style.display = "none" document.getElementById("1.2.1").style.display = "none" document.getElementById("1.2.2").style.display = "none" document.getElementById("1.2.3").style.display = "none" document.getElementById("1.2.4").style.display = "none" document.getElementById("1.3.1").style.display = "none" document.getElementById("1.3.2").style.display = "none" document.getElementById("1.3.3").style.display = "none" document.getElementById("1.3.4").style.display = "none" document.getElementById("1.4.1").style.display = "none" document.getElementById("1.4.2").style.display = "none" document.getElementById("1.4.3").style.display = "none" document.getElementById("1.4.4").style.display = "none" document.getElementById(type).style.display = "" } </script> <!--Display box --> <font face="Verdana, Geneva, sans-serif" size="4" color="#FF0000"><br /> Search Parts</font><br /> <br /> <select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="1">Beck</option> <option value="2">BobCat</option> <option value="3">Briggs</option> <option value="4">Yazoo</option> </select> <span id="1" style="display:none" ><br /><select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="1.1">Beck 1</option> <option value="1.2">Beck 2</option> <option value="1.3">Beck 3</option> <option value="1.4">Beck 4</option> </select></span> <span id="2" style="display:none"><br /><select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="2.1">BobCat 1</option> <option value="2.2">BobCat 2</option> <option value="2.3">BobCat 3</option> <option value="2.4">BobCat 4</option> </select></span> <span id="3" style="display:none"><br /><select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="3.1">Briggs 1</option> <option value="3.2">Briggs 2</option> <option value="3.3">Briggs 3</option> <option value="3.4">Briggs 4</option> </select></span> <span id="4" style="display:none"><br /><select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="4.1">Yazoo 1</option> <option value="4.2">Yazoo 2</option> <option value="4.3">Yazoo 3</option> <option value="4.4">Yazoo 4</option> </select></span> <span id="1.1" style="display:none"><br /><select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="1.1.1">Beck 1.1</option> <option value="1.1.2">Beck 1.2</option> <option value="1.1.3">Beck 1.3</option> <option value="1.1.4">Beck 1.4</option> </select></span> <span id="1.2" style="display:none"><br /><select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="1.2.1">Beck 2.1</option> <option value="1.2.2">Beck 2.2</option> <option value="1.2.3">Beck 2.3</option> <option value="1.2.4">Beck 2.4</option> </select></span> <span id="1.3" style="display:none"><br /><select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="1.3.1">Beck 3.1</option> <option value="1.3.2">Beck 3.2</option> <option value="1.3.3">Beck 3.3</option> <option value="1.3.4">Beck 3.4</option> </select></span> <span id="1.4" style="display:none"><br /><select onchange="SetHTML2(this.value)"> <option selected="selected">Choose your option</option> <option value="1.4.1">Beck 4.1</option> <option value="1.4.2">Beck 4.2</option> <option value="1.4.3">Beck 4.3</option> <option value="1.4.4">Beck 4.4</option> </select></span> <span id="2.1" style="display:none"> text </span> <span id="2.2" style="display:none"> text </span> <span id="2.3" style="display:none"> text </span> <span id="2.4" style="display:none"> text </span> <span id="3.1" style="display:none"> text </span> <span id="3.2" style="display:none"> text </span> <span id="3.3" style="display:none"> text </span> <span id="3.4" style="display:none"> text </span> <span id="4.1" style="display:none"> text </span> <span id="4.2" style="display:none"> text </span> <span id="4.3" style="display:none"> text </span> <span id="4.4" style="display:none"> text </span> <span id="1.1.1" style="display:none"> text </span> <span id="1.1.2" style="display:none"> text </span> <span id="1.1.3" style="display:none"> text </span> <span id="1.1.4" style="display:none"> text </span> <span id="1.2.1" style="display:none"> text </span> <span id="1.2.2" style="display:none"> text </span> <span id="1.2.3" style="display:none"> text </span> <span id="1.2.4" style="display:none"> text </span> <span id="1.3.1" style="display:none"> text </span> <span id="1.3.2" style="display:none"> text </span> <span id="1.3.3" style="display:none"> text </span> <span id="1.3.4" style="display:none"> text </span> <span id="1.4.1" style="display:none"> text </span> <span id="1.4.2" style="display:none"> text </span> <span id="1.4.3" style="display:none"> text </span> <span id="1.4.4" style="display:none"> text </span> <br /> <br /><a href="http://www.plpgolfandturf.com.au/rr/rrboxes_test.php"><img src="http://www.plpgolfandturf.com.au/rr/bt2.png" border="0" /></a> hi i have a form where i need to join fields from the form prior to submission to flow into a pdf form. here is the function PHP Code: <SCRIPT language='javascript' type='text/javascript'> function joinna(form, elemName, ttl) { form.bname.value = form.b_fname.value + ' ' + form.b_lname.value; } </script> here is what the form input looks like PHP Code: <input class="left" onBlur="mark(this,'#ffffff','#000000')" name="b_fname" size="20" maxlength="40" onFocus="nextfield ='cb_fname'; mark(this,'#FFFF99','#0000FF')" value="<?php echo $row['b_fname'];?>" onChange="joinna(this.form,'b_fname','p1f6');"> </span> <input class="left" onBlur="mark(this,'#ffffff','#000000')" name="b_lname" size="20" maxlength="40" onFocus="nextfield ='cb_fname'; mark(this,'#FFFF99','#0000FF')" value="<?php echo $row['b_lname'];?>" onChange="joinna(this.form,'b_lname','p1f6');"> </span> and here is the calc field PHP Code: <input type="hidden" NAME="bname" value="" Size="7" onBlur="mark(this,'#ffffff','#000000')" onFocus="blur();document.smartform.bname.focus()" onChange="this.form.b_fname.value + this.form.b_lname.value; joinna(this.form,'field');" > this works fine IF i manually insert something new into the b_fname field. but lets say a user pulls the for to edit, and then makes no changes, "bname" will remain blank. what i want to do is call the function and/or force an 'onchange' or do whatever so bname is not left blank in the event the user submits w/o making any changes to the form tia HI, i know very little about javascript, just enough to get me into trouble actually lol. Here is what im working with. I have a custom Instant messenger for members. It uses embed object macromedia as well as javascript to diplay the window and send messages. What i want to do is simply add an onchange that when one person is typing it shows they are typing (ie xxxxx is typing....) My experience is in php and html and i looked thru the script and the javascript functions but im not sure what im looking for exactly. Do i need to have access to the swf or fla file and be able to edit them to do this? I dont see any form inputs or i would know exactly where to put the onchange lol. Im guessing the input is in the swf or fla file not sure how that works. what im guessing is that in the embed or the object tags (ill play with it) i can put something like Code: document.write('test on change\n'); i think i need to wrap that in doc write script type=javascript in quotes so it parses. If i can get that text to show up inside the IM where i want it then i can try to figure out how to set focus on box and recongize onchange and do some testing. I think i might even be able to doc write the onchange command but not sure. Thanks Hello all, I have a translation script that I want to modify to use select boxes instead of divs, but I have a little problem with what I have. Bascially, the user selects an option and it changes the text in between the ' ' (VALUE) to whatever the value of the option is: Code: <select onchange="updateLangTo('VALUE')"> <option value="en">English</option> <option value="ar">Arabic</option> </select> So how would JavaScript be able to accomplish this? Evening all. I have a little bit of code, thus: Code: var data = document.createElement("td"); box = document.createElement("input"); box.id = headercategories[i]; box.type = text; box.value = "Ten"; box.onChange = alter("11"); data.appendChild(box); in which I insert a text input box into a table data element. When the value of the input is changed, I would like to call the function alter(). However, what's happening in practice is that the function alter is getting called straight away, without waiting for any changes. Is there any way I can stop this? It doesn't seem to happen if you actually write the onchange bit into the HTML by hand rather than doing it dynamically. Thanks, Chris |