Member Avatar for nahidhawk

Hi guyz....i am new here.... really appreciate if u can help me...

i am also a newbie in coding.....

i am trying to create a interface to average down variable amount of input and show them on screen as they type....

this is what i came up with.....


and the input box fields....these are dynamically created...

<input type="text" name="datup[0][4]" size="3" onchange="calc()" >
<input type="text" name="datup[1][4]" size="3" onchange="calc()" >
<input type="text" name="datup[2][4]" size="3" onchange="calc()" >
<input type="text" name="datup[3][4]" size="3" onchange="calc()" >

now the javascript function...this works with fixed variables

<script language="javascript"> 
function calc() 
{ 
 
avcount= parseInt(document.getElementById('dtavge').value);
n1=parseFloat(document.getElementById('datup[0][4]').value);
n2=parseFloat(document.getElementById('datup[1][4]').value);
n3=parseFloat(document.getElementById('datup[2][4]').value);
n4=parseFloat(document.getElementById('datup[3][4]').value);

 
 
 
var totalc=((n1*1)+(n2*1)+(n3*1)+(n4*1))/avcount;
 
document.getElementById('bpover').value = totalc;
 
} 
</script>

i need some help with the javascript code so it can dynamically adjust according to the count of input which i can provide(avcount variable)


plz do help...thx in advance.....

  • 2 Contributors
  • 1 Reply
  • 1K Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by Taywin
Member Avatar for Taywin

Your code is very odd. Your first one use 'name' but your second one use 'id'. If you want to get it dynamically, you could use the same 'name' input tag. I am not sure whether you want it or not, so I just reuse your own code.

Below is the code that will compute all fields that meet condition. In this case, the name of the input field must start with 'datup', or it won't read the value. Each time it matches, a counter will be increment. Once it has gone through all input field, it would compute the value. Just my 2 cents...

<html>
<head>
<script type="text/javascript">
function calc(obj) {
  var avcount = 0, sum = 0, val
  var elems = document.getElementsByTagName("input")
  for (var i=0; i<elems.length; i++) {
    if (elems[i].name.match(/^datup/)) {
      val = parseFloat(elems[i].value)
      if (val) { sum += val }  // preventing from any empty field
      avcount += 1
    }
  }
  if (avcount>0) {
    document.getElementById("bpover").value = sum/avcount
  }
  else { alert("No input data") }  // not found a field with starting name 'datup'
}
</script>
</head>

<body>
  V1: <input type="text" name="datup[0][4]" size="3" value="" onchange="calc()" >
  <br />
  V2: <input type="text" name="datup[1][4]" size="3" value="" onchange="calc()" >
  <br />
  V3: <input type="text" name="datup[2][4]" size="3" value="" onchange="calc()" >
  <br />
  V3: <input type="text" name="datup[3][4]" size="3" value="" onchange="calc()" >
  <br /><br />
  <input type="text" id="bpover" value="0" readonly>
</body>
</html>
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.