| | |
debugging?
Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
Thread Solved |
hey im really new with javascript.
can someone tell me whats wrong with this?
thanks so much,
Jason
can someone tell me whats wrong with this?
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=windows-1250"> <title>calculate distance and slope between two points</title> <script language="javascript"> <!-- var x1=0; var y1=0; var x2=0; var y2=0; var xdif=0; var ydif=0; var xsldif=0; var xdifsquared=0; var ydifsquared=0; var undersquare=0; var distance=0; var slope=0; function calculate() { x1=document.calcform.inpx1.value; y1=document.calcform.inpy1.value; x2=document.calcform.inpx2.value; y2=document.calcform.inpy2.value; xdif=x2-x1; ydif=y2-y1; xdifsquared=xdif*xdif; ydifsquared=ydif*ydif; undersquare=xdifsquared+ydifsquared; distance=Math.sqrt(undersquare); slope=ydif/xdif; //--> } </script> </head> <body> <p><img src="distanceformula.gif" border="1"> </p> <p><img src="slope.gif" border="1"></p> <form name="calcform"> <p>point 1: ( <input type="text" name="inpx1" size="5"> , <input type="text" name="inpy1" size="5"> ) <br> point 2: ( <input type="text" name="inpx2" size="5"> , <input type="text" name="inpy2" size="5"> )<br> </p> <button type="submit" onClick="calculate();">Calculate!</button> <p> <strong>distance:</strong> <script language="javascript">document.write(distance);</script> </p> <p><strong>slope:</strong><br> <script language="javascript">document.write(slopetop);</script> <br> ----- = <script language="javascript">document.write(slopefinal);</script><br> <script language="javascript">document.write(slopebottom);</script> <br> </p> </form> </body> </html>
thanks so much,
Jason
Where have you declared 'slopetop', 'slopebottom' and 'slopefinal'? And document.write() is evaluated as the page is being rendered. Plus Javascript is a client side technology; as soon as a page is submitted, what you get is a new page and the state maintained in Javascript variables is reset.
You need to dynamically update the value of a span or div element to get this code working as expected. Something like:
You need to dynamically update the value of a span or div element to get this code working as expected. Something like:
JavaScript / DHTML / AJAX Syntax (Toggle Plain Text)
<!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=UTF-8" /> <meta http-equiv="Expires" content="0" /> <!-- disable caching --> <title>Example</title> <script type="text/javascript"> function calculate(frm) { if(!frm) return(false); var elems = frm.elements; var x1 = parseInt(elems['inpx1'].value, 10); var x2 = parseInt(elems['inpx2'].value, 10); var y1 = parseInt(elems['inpy1'].value, 10); var y2 = parseInt(elems['inpy2'].value, 10); var e = elems['result1']; alert("(" + x1 + "," + y1 + ")" + " and (" + x2 + "," + y2 + ")"); var distance = Math.sqrt(Math.pow(x2 - x1, 2) + Math.pow(y2 - y1, 2)); e.value = isNaN(distance) ? 'Invalid input' : distance; } </script> </head> <body> <form action="#"> <div>(<input type="text" name="inpx1" size="5">,<input type="text" name="inpy1" size="5">)</div> <br> <div>(<input type="text" name="inpx2" size="5">,<input type="text" name="inpy2" size="5">)</div> <br> <input type="button" onclick="return calculate(this.form);" value="Calculate!"> <br><br> <div>Distance: <input name="result1" readonly="readonly"></div> </form> </body> </html>
I don't accept change; I don't deserve to live.
You were having a hard time debugging this simple snippet because maybe you were testing this code in IE; for debugging use Firefox. It provides good debugging support given it has error console (Tools -> Error Console). To try it out, run your previous snippet which you just posted in Firefox and look at the error console; the errors would be right there.
If you are up to it, you can even try the Firebug plugin which provides full blown debugging. And you can be pretty sure that if something works in Firefox will also work in IE.
If you are up to it, you can even try the Firebug plugin which provides full blown debugging. And you can be pretty sure that if something works in Firefox will also work in IE.
I don't accept change; I don't deserve to live.
![]() |
Similar Threads
- debugging a program (Geeks' Lounge)
- c++ debugging error (C++)
- Tutorials on Debugging (C++)
- Please explain debugging (Java)
Other Threads in the JavaScript / DHTML / AJAX Forum
- Previous Thread: Embedding a PHPBB forum into your website : Problems/Solutions
- Next Thread: Forms with AJAX
| Thread Tools | Search this Thread |
ajax ajaxcode ajaxexample ajaxhelp ajaxjspservlets animate array automatically beta box browser bug calendar captchaformproblem checkbox child class close codes createrange() cursor date debugger dependent disablefirebug dom dropdown editor element embed engine events explorer ext file form forms getselection google gwt gxt hiddenvalue highlightedword hint html htmlform ie7 ie8 iframe images internet java javascript javascripthelp2020 jawascriptruntimeerror jquery jsf jsfile jump libcurl maps masterpage math media microsoft mimic object onmouseoutdivproblem onreadystatechange parent paypal pdf php player position post programming progressbar redirect regex runtime safari scriptlets scroll search security shopping size software sql text textarea unicode web website window windowofwords windowsxp wysiwyg \n






