Hi Guys, So, I just sort of wrote my first javascript ever, but it's not doing exactly what I want. If you look at the code, I need textstring to output the totals as each radio is clicked, instead of outputting them next to each other. Can someone help me out? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html lang="en"> <head> <title>JavaScript - Example form</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript"> <!-- // This is the check script function checkit() { // In textstring I gather the data that are finally written to the textarea. var textstring = ''; one = ''; for (i=0;i<document.forms['example'].one.length;i++) { if (document.forms['example'].one[i].checked) { one = document.forms['example'].one[i].value; } } textstring += one two = ''; for (i=0;i<document.forms['example'].two.length;i++) { if (document.forms['example'].two[i].checked) { two = document.forms['example'].two[i].value; } } textstring += two three = ''; for (i=0;i<document.forms['example'].three.length;i++) { if (document.forms['example'].three[i].checked) { three = document.forms['example'].three[i].value; } } textstring += three // Write textstring to the textarea. document.forms['example'].output.value = textstring; } // --> </script> <style type="text/css"> td[colspan] { text-align: center; } </style> <link rel="stylesheet" href="../quirksmode.css" /> <link rel="up" href="contents.html" /> <link rel="intro" href="forms.html" /> <script type="text/javascript" src="../quirksmode.js"></script> </head> <body> <h2>Example form</h2> <div id="header"></div> <form name="example" action="#" method="post"> <tr> <td>Single Digits</td> <br /> <td><input type="radio" name="one" value="1" onchange="checkit();" /> 1<br /> <input type="radio" name="one" value="1" onchange="checkit();" /> 3<br /> <input type="radio" name="one" value="5" onchange="checkit();" /> 5<br /> <input type="radio" name="one" value="7" onchange="checkit();" /> 7<br /></td> </tr> <br /> <tr> <td>Double Digits</td> <br /> <td><input type="radio" name="two" value="10" onchange="checkit();" /> 10<br /> <input type="radio" name="two" value="15" onchange="checkit();" /> 15<br /></td> </tr> <br /> <tr> <td>Triple Digits</td> <br /> <td><input type="radio" name="three" value="100" onchange="checkit();" /> 100<br /> <input type="radio" name="three" value="200" onchange="checkit();" /> 200<br /></td> </tr> <br /> <input type="reset" /> </td> </tr> <tr> <td colspan="2"><textarea cols="30" rows="7" name="output">Total of the 3 radio groups should appear here</textarea></td> </tr> </table> </form> </body> </html> HTML:
Anyone? Here it is in action. The textarea is addition. The blank box next to it is multiplication. Multiplication works fine. For some reason, addition doesn't . http://www.zazingdesigns.com/karina/testing-order-form.html
fixed: needed to use parseInt(one) + parseInt(two) + parseInt(three)....digitalpoint, you guys are slacking