Simple form calculation within repeated region

Hi, I need to perform a simple multiplication calculation within a form that has repeated rows within it.

I have a basic Javascript script that will multiply, by a fixed value, the value a user enters into a textbox and displays it within a readonly textbox beside it. See code below.

I need to be able to use this script (or something similar) in a repeated table within PHP.
<html>
<head>
<script language="javascript" src="remote.js"></script>
<script type="text/javascript">
    function calc(num)
    {
          var multiplier = 2; //your number here
          var result = 0;
          if(isFinite(num))
          {
                result = num * multiplier;
          }
          result = result.toFixed(0);
          document.myform.result.value = result;
    }
</script>
</head>
<body>
<form name="myform">
<input type="text" name="txt1" id="txt1" onkeyup="calc(this.value);"/>
<input type="text" name="result" id="result" readonly="readonly"/>
</form>
</body>
</html>

Open in new window

MariusGMAsked:
Who is Participating?
 
glcumminsConnect With a Mentor Commented:
Add another parameter to your function that identifies the output field (code below). Then give each of your ouput fields an id, and supply them when you call the function.


function calc(num, fieldID)
{
      var multiplier = 2; //your number here
      var result = 0;
      if(isFinite(num))
      {
            result = num * multiplier;
      }
      result = result.toFixed(0);
      document.getElementById(fieldId).value = result;
}

Open in new window

0
 
Michel PlungjanConnect With a Mentor IT ExpertCommented:
try this:


<html>
<head>
<script language="javascript" src="remote.js"></script>
<script type="text/javascript">
function calc(theField) {
  var num = theField.value;
  var theForm =theField.form;
  var res = theField.name.replace('txt','res');
  var multiplier = 2; //your number here
  var result = 0;
  if(isFinite(num)) {
    result = num * multiplier;
  }
  result = result.toFixed(0);
  theForm.elements[res].value = result;
}
</script>
</head>
<body>
<form name="myform">
<input type="text" name="txt1" id="txt1" onkeyup="calc(this);">
<input type="text" name="res1" id="res1" readonly="readonly"/>
<input type="text" name="txt2" id="txt2" onkeyup="calc(this);">
<input type="text" name="res2" id="res2" readonly="readonly"/>
</form>
</body>
</html>

Open in new window

0
 
Michel PlungjanIT ExpertCommented:
PS:

 var result = 0;
  if(isFinite(num)) {
    result = num * multiplier;
  }
  result = result.toFixed(0);
  theForm.elements[res].value = result;

can be shortened to

  theForm.elements[res].value = (isFinite(num))? (num * multiplier).toFixed(0):0;
0
 
Computer101Commented:
Forced accept.

Computer101
Community Support Moderator
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.