JavaScript - Getelementbyid Is Not A Function Problem
Hi guys,
I'm a bit new to all this javascript and of course I have a problem.. I have searched all the forums and none have helped me fix this problem.. js file: function buildTable (prodNum){ moo = document.GetElementById('showProd').insertRow(0); /*some crap code*/ } html code: <table id = "showProd" border ="3"></table> i keep on recieving from firebug an error saying GetElementById is not a function... any help will be greatly appreciated. thank you. Similar TutorialsHi - Code: function EvalSound(soundobj) {// this passes the sound to be played to the java applet embedded in the html file and plays it. see ref: http://www.phon.ucl.ac.uk/home/mark/audio/play.htm document.getElementById(soundobj).Play(); } I get a firebug error message 'getElementB...ay is not a function'. However, this error only occurs on my machine at work where I am running Firefox for U3 (updated to FF 3.5.5) - U3 is a SanDisc flash drive. When I run the same code on FF 3.5.5 from home there is no error. The code works in all other browsers I've tested (IE6, IE8, Chrome). The page is http://dermdudes.com/counter/keycounter.html Please provide feedback if the page does not work for you. Please help. Thanks, Jim Hello! I am working on creating a basic calorie calculator with Javascript and my code is not showing the results after the user makes their selections. I've created a simple function to obtain the user's weight, activity and duration info but when I use the GetElementById to retrieve the result, it does not show up. Any help would be much appreciated to make this work. Thanks. Code: <head> <script type="text/javascript"> var myActivity = new Array(); myActivity[100] = "6.670"; myActivity[200] = "3.811"; myActivity[300] = "3.343"; myActivity[400] = "3.343"; myActivity[500] = "3.343"; myActivity[600] = "4.765"; myActivity[700] = "4.765" function CalorieBurner() { //user prompt var caloriesBurned; var myForm = document.form; //processing var caloriesBurned = (myForm.duration[formElement.value] * (myActivity[formElement.value] * 3.5 * myForm.weight[formElement.value])/200); FormElement = myForm.activity[myForm.activity.selectedIndex]; document.getElementById("caloriesBurned").innerHTML = "You will burn " + caloriesBurned + "calories doing " + myForm.duration[formElement.value] + "minutes of " + FormElement.text; } </script> </head> <body> <form name="form"> Enter your weight: <input type="text" name="weight" /> <br /><br /> Select an activity: <br /> <select name="activity"> <option value="100"> Backpacking, Hiking with pack </option> <option value="200"> Bagging grass, leaves </option> <option value="300"> Bathing dog </option> <option value="400"> Carpentry, general</option> <option value="500"> Carrying infant, level ground </option> <option value="600"> Carrying infant, upstairs </option> <option value="700"> Children's games, hopscotch... </option> </select> <br /><br /><br /> Enter the duration of your activity (in minutes): <input type="text" name="duration" /> </form> <br /><br /><br /> <input type="button" value="Results" name="btnUpdate" onClick="CalorieBurner()"/> <br /><br /><br /> <div id="caloriesBurned"></div> </body> </html> Hi, I have a choice of three market items and I want the value of the selected one to be sent to my form. My code is: Code: <script type="text/javascript"> function loadXMLDoc2(File,ID,Msg){ if (window.XMLHttpRequest) { xmlhttp=new XMLHttpRequest(); } else { try{ xmlhttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } } xmlhttp.onreadystatechange=function(){ if (xmlhttp.readyState==4 && xmlhttp.status==200){ document.getElementById(ID).innerHTML=xmlhttp.responseText; } } var params=Msg; xmlhttp.open("POST",File,true); xmlhttp.setRequestHeader("Pragma", "Cache-Control:no-cache"); xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xmlhttp.setRequestHeader("Content-length", params.length); xmlhttp.setRequestHeader("Connection", "close"); xmlhttp.send(params); } </script> </head> <body> <input type="radio" name="myitem" id="myitem" value="All;" onclick="OtherFunction()" />All <br /><br />' <input type="radio" name="myitem" id="myitem" value="Shirts" onclick="OtherFunction()" />Shirts <br /><br /> <input type="radio" name="myitem" id="myitem" value="Trousers" onclick="OtherFunction()" />Trousers <br /><br /> <br /><br /> <input type="button" class="indent" name="submitB" id="submitB" value="Submit" onclick="loadXMLDoc2('insertMarket.php','txtHint', 'md='+encodeURI(document.getElementById('myitem').value))" /> <div id="txtHint"></div> This doesn't work. I have tried giving them different ids, I have tried replacing the id with checked="id=\'myitem\'", I have tried getElementById(\'myitem.checked\'), I have tried getElementbyName. In my full page I have far more radio buttons, so I don't want to do a getElementById(\'myitem[0].checked || myitem[1].checked etc. I think the solution must be along these lines. But I have run out of alternatives to try. Needless to say as it currently stands it gives the last radio button's value, which means it doesn't like them having the same id, but when I tried changing how the id was applied, or called - ElementByName, FF gives the error message as id is null. Alright so i've been trying to code a layout with multiple 'frames' . What I usually do is use the following script: Code: <center> <script> function changeNavigation(id) {document.getElementById('navigate').innerHTML=document.getElementById(id).innerHTML} </script> <noembed> <body> </noembed> And then add all the divs which are linked to an imagemap, like this: Code: <img src="IMAGE" width="HERE" height="HERE" border="0" usemap="#ImageMap1"> <div style="width:HEREpx; height:HEREpx; position:absolute; left:HEREpx; top:HEREpx; z-index:1; overflow:auto;" id="HERE"> Blaa </div> <div style="display:none; overflow=none"; id="HERE"> And add as many as I need of these. </div> <map name="ImageMap1"> <area shape="HERE" coords="HERE" name="HERE" onClick="changeNavigation('HERE')"> </map> This always works fine when I have one 'navigation' frame. However this time I need to code a layout with multiple frames. I have tried starting a new script and linking to a new imagemap to do that. But what it does is it duplicates the image and the divs dont appear when clicking on a 'button'. This is the layout I am coding As you can see, each box has its own 'buttons' which should link to a div. I can do it for one of the boxes and its divs, but cant figure out how to do it for the others so it works. Did my best to make this sound non-confusing. Hopefully someone will be able to help. Hello, I am retrieving xml - that works well. It is when I use "getElementByID" that things go weird. I can scoop up the elements, but it gives me 4 copies of each. When I try to run thru the first one, it doesn't recognize it as an array. hmm. In otherwords.. lets say I do this. var test = somevars.getElementByID('shoes'); test then looks like this: [shoes shoes shoes shoes] If I click on each "object" (shoes) - then I get the FULL xml in each... so I figure, ok - I'll just grab the first and reiterate thru that. ie.. for y=1 etc.. test[0].length but that doesn't work. Do I have to then reach into the childNodes of this and grab the "shoes" elements? Not sure if I am explaining this correctly. this is what I have: Code: function fireAjax(){ new Ajax.Request( flashconfig.genXML, { method: 'get', contentType: "application/xml", onSuccess: function( transport ) { var shoeTags = transport.responseXML.getElementsByTagName( 'shoes' ); var spotlightView = $H(); for( var b = 0; b < shoeTags.length; b++ ) { $w('title description link linkName image').each( function(cs){ spotlightView[cs] = getNodeValue(shoeTags[b],cs); }); builddisplay(displayModule, spotlightView); } so shoeTags does get an array, but each element/object actually has ALL the shoe items in it - but then repeats... for the other array positions. I tried just grabbing the ".first" or [0] like so, but that didn't work. var shoeTags = transport.responseXML.getElementsByTagName( 'shoes' ).first; or var shoeTags = transport.responseXML.getElementsByTagName( 'shoes' )[0] Hi, I think from what I have been reading that Firefox has quite a problem with some Javascript. We had this little script written for us which works great in IE but I have no clue how to get it to work with Firefox. Any ideas would be greatly appreciated! Code: <script type="text/javascript"> <!-- function getObject(obj) { var theObj; if(document.all) { if(typeof obj=="string") { return document.all(obj); } else { return obj.style; } } if(document.getElementById) { if(typeof obj=="string") { return document.getElementById(obj); } else { return obj.style; } } return null; } function checkqty(item1,item2) { var item1Obj=getObject(item1); var item2Obj=getObject(item2); if (item1Obj.checked == true) { item2Obj.value = "1"; } else if (item1Obj.checked == false) { item2Obj.value = "0"; } } //--> </script> <input type="checkbox" name="item2" value="012345" onClick="checkqty('item2','quantity2');"> <input type="hidden" name="quantity2" value="0"> Code: onload=function() {progress1();} var repeat=0; function progress1() { document.getElementById('clib').style.display="inline"; if (repeat<9) { repeat=repeat+1; setTimeout('progress1()',1000); old = document.getElementById('cliba').innerHML; document.getElementById('cliba').innerHML=old+'.'; } else { progress2(); } } var repeata=0; function progress2() { document.getElementById('wlib').style.display="inline"; if (repeata<23) { repeata=repeata+1; setTimeout('progress2()',1000); old = document.getElementById('wliba').innerHML; document.getElementById('wliba').innerHML=old+'.'; } else { progress3(); } } var repeatb=0; function progress3() { document.getElementById('dlib').style.display="inline"; if (repeatb<17) { repeatb=repeatb+1; setTimeout('progress3()',1000); old = document.getElementById('dliba').innerHML; document.getElementById('dliba').innerHML=old+'.'; } else { progress4(); } } var repeatc=0; function progress4() { document.getElementById('slib').style.display="inline"; if (repeatc<4) { repeatc=repeatc+1; setTimeout('progress4()',1000); old = document.getElementById('sliba').innerHML; document.getElementById('sliba').innerHML=old+'.'; } else { progress5(); } } var repeatd=0; function progress5() { document.getElementById('vlib').style.display="inline"; if (repeatd<17) { repeatd=repeatd+1; setTimeout('progress5()',1000); old = document.getElementById('vliba').innerHML; document.getElementById('vliba').innerHML=old+'.'; } else { progress6(); } } var repeate=0; function progress6() { document.getElementById('xlib').style.display="inline"; if (repeate<33) { repeate=repeate+1; setTimeout('progress6()',1000); old = document.getElementById('xliba').innerHML; document.getElementById('xliba').innerHML=old+'.'; } else { pyws(); } } var repeatf=0; function pyws() { document.getElementById('pyws').style.display="inline"; if (repeatf<7) { repeatf=repeat+1; setTimeout('pyws()',1000); old = document.getElementById('pywsa').innerHML; document.getElementById('pywsa').innerHML=old+'.'; } } HI.....idk why it is not working......when I load site, it will start counting, but dots after that .lib files.....look: http://ikoos.tk/load_os/ ......if you don't know what I mean....try to send me a PM. Thank you. i have the code in JS: Code: if(drop_list.value == "zed-catcher/11") { input_box.disabled=false; var catcher_id = document.getElementById('lpm_service_catcher_id'); catcher_id.value = 11; } else input_box.disabled=true; how come the line catcher_id.value = 11; is not setting the value to 11???? i get that catcher_id = null???? pleas help thanks here's my javascript code
Code: <script type="text/javascript"> function sel(id){ document.getElementById(id).className="selected"; var getEls = document.getElementById("countrytabs").getElementsByTagName("a"); var getAgn = getEls; for(var i=0; i<getEls.length; i++) { getEls[i].onclick=function() { for (var x=0; x<getAgn.length; x++) { getEls[i].className=getAgn[x].className.replace("selected", ""); } } } } </script> <style> a:hover {color: #FFFF00;} .selected{color: #FFFF00; text-decoration: none; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; line-height: 15px; background-color: #ACAAAB; border: 0px none #ACAAAB; height: 20px; width: 125px; text-align: left;} a{color: #333333; text-decoration: none; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; line-height: 15px; background-color: #ACAAAB; border: 0px none #ACAAAB; height: 20px; width: 125px; text-align: left;} </style> here's my html code Code: <a href="#" class="selected" id="one" onclick="sel('one')"> Bharati Axa </a><br /> <a href="#" id="two" onclick="sel('two')"> BPCL</a> <br /> <a href="#" id="three" onclick="sel('three')"> Hypercity </a><br /> <a href="#" id="four" onclick="sel('four')"> Idea </a> the problem is when i select a link the first time. it works fine. but when i select another link the next time the script does not work. Basically it works only once when page is loaded and then its not working at all. Its not showing any errors either. don't know whats happing.? Can someone please help me its urgent? Any help will be really gratefull! Hello everyone. As lame as this may sound, I can't for the life of me get the document by the id. All looks fine to me, but I get the following error that just simply doesn't make sense. Webpage error details User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0) Timestamp: Fri, 15 Jan 2010 01:37:06 UTC Message: Object required Line: 7 Char: 4 Code: 0 Here's the code... Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <script type="text/javascript"> function doSomething() { var elem = document.getElementById('doFade'); alert(elem.src); } window.onload = doSomething(); </script> </head> <body> <img src="/images/aero.jpg" id="doFade" width="300" height="200" /> </body> </html> Hi.. I have problem on how can I automatically display the output from the computation (Demanded Qty * Quantity), after or while I input Demanded Qty. I mean I input Demanded Qty, on below it will display the output also beside the SubItems. Sorry, if i post again my problem, because I have no idea on how can I solve this problem. here is my code: PHP Code: <?php error_reporting(0); date_default_timezone_set("Asia/Singapore"); //set the time zone $con = mysql_connect('localhost', 'root',''); if (!$con) { echo 'failed'; die(); } mysql_select_db("mes", $con); ?> <html> <title>Stock Requisition</title> <head> <link rel="stylesheet" type="text/css" href="kanban.css"> <script type="text/javascript"> function compute_quantity(){ var DemandedQty = document.getElementById('DemandedQty').value; var SubQty = document.getElementById('SubQty').value; var Quantity = document.getElementById('Quantity').value; SubQty = (DemandedQty * Quantity); } </script> </head> <body> <form name="stock_requisition" action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post"> <div> <table> <thead> <th>Items</th> <th>Sub Items</th> <th>Item Code</th> <th>Demanded Qty</th> <th>UoM</th> <th>Class</th> <th>Description</th> <th>BIN Location</th> </thead> <?php $DemandedQty = $_POST['DemandedQty']; $sql = "SELECT DISTINCT Items FROM bom_subitems ORDER BY Items"; $res_bom = mysql_query($sql, $con); while($row = mysql_fetch_assoc($res_bom)){ $Items = $row['Items']; $Items_ = substr($Items, 12, 3); echo "<tr> <td style='border: none;font-weight: bold;'> <input type='name' value='$Items_' name='Items_[]' id='Items' readonly = 'readonly' style = 'border:none;width:auto;font-family: Arial, Helvetica, sans-serif;font-size: 1em;'></td> <td style='border:none;'> </td> <td style='border:none;'> </td> <td style='border: none;'><center><input type='text' name='DemandedQty[]' id='DemandedQty' value='' size='12' onkeyup = compute_quantity()></center></td> </tr>"; $sql = "SELECT Items, SubItems, ItemCode, UoM, Class, Description, BINLocation, Quantity FROM bom_subitems WHERE Items = '$Items' ORDER BY Items"or die(mysql_error()); $res_sub = mysql_query($sql, $con); while($row_sub = mysql_fetch_assoc($res_sub)){ $Items1 = $row_sub['Items']; $SubItems = $row_sub['SubItems']; $ItemCode = $row_sub['ItemCode']; $UoM = $row_sub['UoM']; $Class = $row_sub['Class']; $Description = $row_sub['Description']; $BINLocation = $row_sub['BINLocation']; $Quantity = $row_sub['Quantity']; echo "<input type='hidden' name='Quantity' id='Quantity' value='$Quantity'>"; echo "<tr> <td style='border: none;'> <input type='hidden' value='$Items1' id='Items1' name='Items1[]'></td> <td style='border: none;'> <input type='text' name='SubItems[]' value='$SubItems' id='SubItems' readonly='readonly' style='border:none; width:auto;font-family: Arial, Helvetica, sans-serif;font-size: 1em;'></td> <td style='border: none;'> <input type='text' name='ItemCode[]' value='$ItemCode' id='ItemCode' readonly='readonly' style='border:none; width:auto;font-family: Arial, Helvetica, sans-serif;font-size: 1em;'></td> <td style='border: none;'><center><input type='text' name='SubQty[]' id='SubQty' value='' size='12' style></center></td> <td style='border: none;' size='3'> <input type='text' name='UoM[]' value='$UoM' id='UoM' readonly='readonly' style='border:none; width:auto;font-family: Arial, Helvetica, sans-serif;font-size: 1em;' size='3'></td> <td style='border: none;'> <input type='text' name='Class[]' value='$Class' id='Class' readonly='readonly' style='border:none; width:auto;font-family: Arial, Helvetica, sans-serif;font-size: 1em;'></td> <td style='border: none;'> <input type='text' name='Description[]' value='$Description' id='Description' readonly='readonly' style='border:none; width:auto;font-family: Arial, Helvetica, sans-serif;font-size: 1em;' size= '30'></td> <td style='border: none;'> <input type='text' name='BINLocation[]' value='$BINLocation' id='BINLocation' readonly='readonly' style='border:none; width:auto;font-family: Arial, Helvetica, sans-serif;font-size: 1em;'></td> </tr>"; } } ?> </table> </div> </form> </body> </html> If you don't understand my issue feel free to ask me for further understanding. I'm sorry again I really need to solve this and i tried to google but I can't find the solution. Thank you so much Hello, I am having a problem with javascript code: Code: newWindow.document.getElementByID() where "newWindow" is a new "window" object opened up with an existing file in the same directory as the current file. The complete function looks like this: Code: function showStreamInFullScreenMode(stream_id) { var params = "width=" + screen.width + ", height=" + screen.height + ", top=0, left=0" + "location=no, menubar=no, scrollbars=no," + "resizable=no, toolbar=no, directories=no, fullscreen=yes"; var newWindow = window.open("fullscreenMode.html", "Fullscreen Mode", params, false); var customScript = "initOpenTokSession(\"" + stream_id + "\");"; var scriptElement = newWindow.document.getElementById("customScript"); scriptElement.innerHTML = customScript; if (window.focus) { newWindow.focus(); } } The bolded line of code is what is producing the error: Quote: scriptElement is null Note that the file that is opened (fullscreenMode.html) does indeed have a <script> html element with the id "customScript" so there is no reason why scriptElement should be null. I would appreciate any help anyone could offer. Thanks in advance. I have the following code...the getelementbyId works fine it changes the value in the textfield aswell....but only in the first retrieved record...It is not working in any of the other records that are showed. Code is he <?php include("../connection/conn.php"); ?> <script type="text/javascript"> function notEmpty(){ var myTextField = document.getElementById('myText'); document.getElementById('myText').innerHTML = myTextField; if(myTextField.value != "") alert("You entered: " + myTextField.value) else alert("Would you please enter some text?") } </script> </head> <body> <?php $sql=mysql_query("select * from menuscript"); while($row=mysql_fetch_array($sql)) { ?> <div class="mine"> <?php echo $row['author'];?> <form> <input type='text' id='myText' /> <input type='button' onclick="notEmpty();" value='Form Checker' /> </form> </div> <?php }?> Hi... I got an error: Object Required when I use this code: Code: var SubQty = document.getElementById("SubQty").value; <input class='txt' type='text' name='SubQty[]' id='$joinId' size='12' style= 'border:none;' value=''/> How can I get the value? Thank you Hi, This code uses the getElementById to change the background of certain <tr>'s. In a nutshell there are two buttons, the code checks which one has been clicked, then checks the background colour of a relevant <tr> and depending what it finds changes the colours of the cells. Works fine in Chrome and Firefox but not in IE and I'm now sorely vexed by it. Can anyone shed light on the solution please? Code: <script language="javascript" type="text/javascript"> function changeBackgroundColor(objDivID) { var backColor = new String(); if ( objDivID == "lifesciences" ) { backColor = document.getElementById('claire').style.backgroundColor; } if ( objDivID == "healthcare" ) { backColor = document.getElementById('adrienne').style.backgroundColor; } if(backColor.toLowerCase()=='#ffffff' || backColor.toLowerCase()=='rgb(255, 255, 255)') // IE works with hex code of color e.g.: #eeeeee // Firefox works with rgb color code e.g.: rgb(238, 238, 238) // Thats why both types are used in If-condition below { if ( objDivID == "lifesciences" ) { document.getElementById('david').style.backgroundColor = '#c0c0c0'; document.getElementById('claire').style.backgroundColor = '#c0c0c0'; document.getElementById('adrienne').style.backgroundColor = '#ffffff'; document.getElementById('karen').style.backgroundColor = '#c0c0c0'; document.getElementById('alice').style.backgroundColor = '#c0c0c0'; document.getElementById('kelly').style.backgroundColor = '#ffffff'; document.getElementById('sarah').style.backgroundColor = '#c0c0c0'; document.getElementById('carolyn').style.backgroundColor = '#c0c0c0'; document.getElementById('paul').style.backgroundColor = '#c0c0c0'; document.getElementById('kayleigh').style.backgroundColor = '#c0c0c0'; document.getElementById('tim').style.backgroundColor = '#c0c0c0'; document.getElementById('chantal').style.backgroundColor = '#c0c0c0'; document.getElementById('lee').style.backgroundColor = '#c0c0c0'; document.getElementById('lisa').style.backgroundColor = '#c0c0c0'; } else { document.getElementById('david').style.backgroundColor = '#c0c0c0'; document.getElementById('claire').style.backgroundColor = '#ffffff'; document.getElementById('adrienne').style.backgroundColor = '#c0c0c0'; document.getElementById('karen').style.backgroundColor = '#c0c0c0'; document.getElementById('alice').style.backgroundColor = '#c0c0c0'; document.getElementById('kelly').style.backgroundColor = '#c0c0c0'; document.getElementById('sarah').style.backgroundColor = '#c0c0c0'; document.getElementById('carolyn').style.backgroundColor = '#ffffff'; document.getElementById('paul').style.backgroundColor = '#ffffff'; document.getElementById('kayleigh').style.backgroundColor = '#ffffff'; document.getElementById('tim').style.backgroundColor = '#c0c0c0'; document.getElementById('chantal').style.backgroundColor = '#c0c0c0'; document.getElementById('lee').style.backgroundColor = '#c0c0c0'; document.getElementById('lisa').style.backgroundColor = '#c0c0c0'; } } else { document.getElementById('david').style.backgroundColor = '#ffffff'; document.getElementById('claire').style.backgroundColor = '#ffffff'; document.getElementById('adrienne').style.backgroundColor = '#ffffff'; document.getElementById('karen').style.backgroundColor = '#ffffff'; document.getElementById('alice').style.backgroundColor = '#ffffff'; document.getElementById('kelly').style.backgroundColor = '#ffffff'; document.getElementById('sarah').style.backgroundColor = '#ffffff'; document.getElementById('carolyn').style.backgroundColor = '#ffffff'; document.getElementById('paul').style.backgroundColor = '#ffffff'; document.getElementById('kayleigh').style.backgroundColor = '#ffffff'; document.getElementById('tim').style.backgroundColor = '#ffffff'; document.getElementById('chantal').style.backgroundColor = '#ffffff'; document.getElementById('lee').style.backgroundColor = '#ffffff'; document.getElementById('lisa').style.backgroundColor = '#ffffff'; } } </script> Quote: <html> <head> <script type="text/javascript"> var a = january var b = febuary var c = march function test() { document.getElementById("test").innerHTML=a; <!-- needs to be A on first function click, b on second, c on third, etc..^^--> } </script> </head> <body> <p id="test"></p> <!-- the <p> should go to next month upon each function --> <input type="button" value="asdf" onclick="test()" /> </body> </html> I tried to explain it pretty well in the comment tags, thanks! <p> <script type="text/javascript">// <![CDATA[ var metrics = { "mm" : 1, "cm" : 10, "m" : 1000, "inch" : 25.4, "foot" : 304.8 }; function convert(num, dec){ var val = document.getElementById("fromVal").value; if(isNaN(val)){ return } function roundNumber(num, dec) { var result = Math.round( Math.round( num * Math.pow( 10, dec + 1 ) ) / Math.pow( 10, 1 ) ) / Math.pow(10,dec); return result; } document.getElementById("toVal").value = val * metrics[document.getElementById("fromSystem").value]/ metrics[document.getElementById("toSystem").value]; } var interval = null; function watchChanges(){ interval == null ? setInterval("convert()", 500) : clearInterval(interval); } // ]]></script> </p> <table> <tbody> <tr> <td><input id="fromVal" style="width: 100px;" onfocus="watchChanges()" onblur="watchChanges()" type="text" /><select id="fromSystem" onchange="convert()"> <option value="mm">millimeters</option> <option selected="selected" value="cm">centimeters</option> <option value="m">meters</option> <option value="foot">feet</option> <option value="inch">inches</option> </select></td> </tr> <tr> <td colspan="1" align="center">=</td> </tr> <tr> <td><input id="toVal" style="width: 100px;" type="text" disabled="disabled" /><select id="toSystem" onchange="convert()"> <option value="mm">millimeters</option> <option value="cm">centimeters</option> <option value="m">meters</option> <option selected="selected" value="foot">feet</option> <option value="inch">inches</option> </select></td> hi quick question, i have 640 hidden html inputs like this but with different names. <input type="hidden" name="b1r1c1" value"some value"> now i want to use document.getElementById('b1r1c1).value = "whatever"; will that work eventhough there is no id on my hidden value. it will be in a hta by the way. thanks hi, In my code below, I cannot get the setting_id value as it falls outside of the loop. I have just tried to put in the getElementById function but it's not working?! I get the error: missing ) after formal parameters JavaScript from this: Code: function confirmqualification(ID) { to this: Code: function confirmqualification(document.getElementById('setting_id')) { HTML from this: Code: <input type="button" name="remove" id="remove" value="Remove" onClick="javascript:confirmqualification('<?php echo $row1['setting_id']?>')" /> to this: Code: <input type="button" name="remove" id="remove" value="Remove" onClick="javascript:confirmqualification()" /> Hopefully some of you guys can help. I'm self taught in Javascript so only know little bits here and there (and don't even know if the thread title is labelled right for what I'm doing!) so help would be greatly appreciated. I'm trying to create 4 buttons on a page (buttons shown by "click here to view c1, c2" etc.) however after I've clicked one button and the content is showing below, the content from the next button clicked does not show (almost as if it is hidden underneath). I'm looking for a way of showing the content when the button is clicked, but hiding it once another button is clicked so other content is shown. Hopefully this is clear enough. All help, tips or advice will be appreciated. Thankyou. Code: <script type="text/javascript" language="JavaScript"><!-- function InsertContent(tid) { if(document.getElementById(tid).style.display == "none") { document.getElementById(tid).style.display = ""; } else { document.getElementById(tid).style.display = "none"; } } //--></script> <table width="100%" cellspacing="4" cellpadding="4" border="0" align="center"> <tbody> <tr> <td width="25%"><a href="javascript:InsertContent('c1');"> Click to see C1</a></td> <td width="25%"><a href="javascript:InsertContent('c2');"> Click to see C2</a></td> <td width="25%"><a href="javascript:InsertContent('c3');"> Click to see C3</a></td> <td width="25%"><a href="javascript:InsertContent('c4');"> Click to see C4</a></td> </tr> </tbody> </table> <hr /> <div style="display: none; border: 0px dashed black; background-color: white; color: black; font-weight: bold; padding: 5px; margin: 5px;" id="c1">CONTENT C1 </div> <div style="display: none; border: 0px dashed black; background-color: white; color: black; font-weight: bold; padding: 5px; margin: 5px;" id="c2">CONTENT C2 </div> <div style="display: none; border: 0px dashed black; background-color: white; color: black; font-weight: bold; padding: 5px; margin: 5px;" id="c3">CONTENT C3 </div> <div style="display: none; border: 0px dashed black; background-color: white; color: black; font-weight: bold; padding: 5px; margin: 5px;" id="c4">CONTENT C3 </div> |