Help! Trying to do text input & radio box to auto calculate

**vanquishla** · 06-29-2012 11:51 AM

So basicly Im trying to have a textfield work as the amount of files... Than have 2 radial buttons one for .80 and one for 1.20

Once you fill in textfield with a number than clicka radial it will mutiple and give you a price in a textfield. This is what I have so far.

<script type="text/javascript"></script>

<table>
<tr><td valign="top">Number of files </td><td><p>
<input value="" type="Text">
<br> </p><div class="fieldclear"></div></td></tr>
<tr><td valign="top">Professional $0.80</td><td>
<input name="input1" id="input" value="input" type="radio"></td></tr>
<tr><td valign="top">Premium $1.20</td><td>
<input name="input2" id="input" value="input" type="radio">
</td></tr>
<tr><td valign="top">Total Cost</td><td>
<input name="amount" disabled="disabled" type="text">
</tr></table>

Can anyone help?

**Gray1989** · 06-29-2012 12:16 PM

I'm pretty sure this is what you're looking for? I didn't clean the code or anything, just simple modifications:

HTML Code:

<script type="text/javascript"><!--
function compute()
{
var mult = 1;
if(document.getElementById("chkbx1").checked) mult = 0.8;
if(document.getElementById("chkbx2").checked) mult = 1.2;
if(document.getElementById("textinput").value*0 != 0) document.getElementById("textoutput").value = "Numbers ONLY!";
else document.getElementById("textoutput").value = document.getElementById("textinput").value*mult;
}
// --></script>

<table>
<tr><td valign="top">Number of files </td><td><p>
<input value="" type="Text" id="textinput" onkeyup="compute()">
<br> </p><div class="fieldclear"></div></td></tr>
<tr><td valign="top">Professional $0.80</td><td>
<input name="chkbxgroup1" id="chkbx1" type="radio" onclick="compute()" checked></td></tr>
<tr><td valign="top">Premium $1.20</td><td>
<input name="chkbxgroup1" id="chkbx2" type="radio" onclick="compute()">
</td></tr>
<tr><td valign="top">Total Cost</td><td>
<input name="amount" disabled="disabled" type="text" id="textoutput">
</tr></table>

**JMRKER** · 06-29-2012 12:50 PM

Several questions about your code.
1. If the elements of #1 are the radio buttons values, why compute with both and not one or the other?
2. Not sure of the purpose of element with 'fieldclear'

Observation: You are missing a <td>...</td> around the name="amount" element.

Here is my SWAG as to what it is that you are trying to accomplish.

Code:

<html>
<head>
<title>Compute</title>

<script type="text/javascript">
function compute() {
  var num1 = document.getElementById('NOF').value
  if (num1 == '') { alert('Missing file value'); return; }
  var num2 = getRBtnName('rBtn');
  if (num2 == '') { alert('Missing selection'); return; }
  var computation = (num1 * num2).toFixed(2);

  document.myform.amount.value = computation;
  if (document.myform.amount.value == 'NaN') {
    document.myform.amount.value = '';
    alert('Please key in a number');
  }
}

function getRBtnName(GrpName) {
  var sel = document.getElementsByName(GrpName);
  var fnd = -1;
  var str = '';
  for (var i=0; i<sel.length; i++) {
    if (sel[i].checked == true) { str = sel[i].value;  fnd = i; }
  }
//  return fnd;   // return option index of selection
// comment out next line if option index used in line above  
  return str;
} 
</script>

</head>
<body>
<form name="myform" action="" method="post" onsubmit="return false")>
<table border="1">

<tr>
 <td valign="top">Number of files </td>
 <td>
  <p><input id="NOF" value="" type="text" onblur="compute()">
  <br> </p>
  <div class="fieldclear"></div>
 </td>
</tr>

<tr>
 <td valign="top">Professional $0.80</td>
 <td> <input name="rBtn" value="0.80" type="radio" checked onclick="compute()"> </td>
</tr>

<tr>
 <td valign="top">Premium $1.20</td>
 <td> <input name="rBtn" value="1.20" type="radio" onclick="compute()"> </td>
</tr>

<tr>
 <td valign="top">Total Cost $</td>
 <td> <input name="amount" disabled="disabled" type="text"> </td>
</tr>

</table>
</form>
</body>
</html>

Besure to put you code between [ code] and [ /code] tags (without the spaces)
to make your script stand out for other forum readers.

Sorry for the post. Looks like 'Gray1989' types faster than me.

**vanquishla** · 06-29-2012 01:24 PM

Wohoo thanks it works! Last problem im having is when I setup that to work with paypal and i use the paypal code that shows email in the code I get javascript error because of spam or something???

**Gray1989** · 06-29-2012 01:47 PM

I haven't worked with paypal before but there shouldn't be much of a problem there.. Could you maybe explain the problem more specifically? Like what type of error are you getting and where in the code is the error originating from? If you could provide a copy & paste of the faulty portion of the code that would be great..

Thread: Help! Trying to do text input & radio box to auto calculate

Thread Tools

Display

Help! Trying to do text input & radio box to auto calculate

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions