Jump to content


Photo

Adding Up Within A Form


  • Please log in to reply
2 replies to this topic

#1 wright67uk

wright67uk

    Advanced Member

  • Members
  • PipPipPip
  • 438 posts

Posted 29 December 2012 - 07:18 PM

How can I change the totalscore() function, so that it outputs the total outputs of the first three functions in my code?

<script language="javascript" type="text/javascript">  
function addroll(){  
  var r =  document.getElementById("roll_1").value * 1;  
      r += document.getElementById("roll_2").value * 1;  
      r += document.getElementById("roll_3").value * 1;  
  document.getElementById("roll_total").value = r;   
  return false;  // or true after testing
}  
 
function addchip(){  
  var c =  document.getElementById("chip_1").value * 1;  
      c += document.getElementById("chip_2").value * 1;  
      c += document.getElementById("chip_3").value * 1;  
  document.getElementById("chip_total").value = c;   
  return false;  // or true after testing
}  
 
function addpitch(){  
  var p =  document.getElementById("pitch_1").value * 1;  
      p += document.getElementById("pitch_2").value * 1;  
      p += document.getElementById("pitch_3").value * 1;  
  document.getElementById("pitch_total").value = p;   
  return false;  // or true after testing
}  
 
function totalscore(){  
  var T = r+c+p;
  document.getElementById("total_score").value = T;   
  return false;  // or true after testing
}  
</script>


#2 wright67uk

wright67uk

    Advanced Member

  • Members
  • PipPipPip
  • 438 posts

Posted 30 December 2012 - 04:09 AM

heres the code i'm using;

<form>
<!-- ROLL -->
<input value="ROLL" type="text" class="heading" readonly style="border:0px"  />
<input onchange="addroll(this.form)" value=" " type="text" id="roll_1" autocomplete="off" />
<input onchange="addroll(this.form)" value=" " type="text" id="roll_2"  autocomplete="off" />
<input value=" " type="text" readonly style="border:0px" /><br/>

<input type="text" class="heading" readonly style="border:0px" />
<input onchange="addroll(this.form)" value=" " type="text" id="roll_3" autocomplete="off" />
<input onchange="totalscore(this.form)" onkeyup="totalscore(this.form);" value=" " type="text" name="roll_total" id="roll_total" class="subtotal" autocomplete="off" readonly="readonly" />
<input value="Roll Total" type="text" class="subheading" readonly style="border:0px" /><br/>

<!-- CHIP -->

<input value="CHIP" type="text" class="heading" readonly style="border:0px" />
<input onchange="addchip(this.form)" value=" " type="text" id="chip_1" autocomplete="off" />
<input onchange="addchip(this.form)" value=" " type="text" id="chip_2" autocomplete="off" />
<input value=" "    type="text" readonly style="border:0px" /><br/>

<input type="text" class="heading" readonly style="border:0px"/>
<input onchange="addchip(this.form)" value=" " type="text" id="chip_3" autocomplete="off" />
<input onchange="totalscore(this.form)" onkeyup="totalscore(this.form);" value=" " name="chip_total" type="text" id="chip_total" class="subtotal" autocomplete="off" readonly="readonly" />
<input value="Chip Total" type="text" class="subheading" readonly style="border:0px"/><br/>

<!-- PITCH  -->

<input value="PITCH" type="text" class="heading" readonly style="border:0px"/>
<input onchange="addpitch(this.form)" value=" " type="text" id="pitch_1" autocomplete="off" />
<input onchange="addpitch(this.form)" value=" " type="text" id="pitch_2" autocomplete="off" />
<input value=" " type="text" readonly style="border:0px" autocomplete="off" /><br/>

<input type="text" class="heading" readonly style="border:0px" />
<input onchange="addpitch(this.form)" value=" " type="text" id="pitch_3" autocomplete="off" />
<input onchange="totalscore(this.form)" value=" " name="pitch_total" type="text" id="pitch_total" class="subtotal" autocomplete="off" readonly="readonly" />
<input value="Pitch Total" type="text" class="subheading" readonly style="border:0px" /><br/>

<!-- TOTAL -->

<input               type="text" class="heading" readonly style="border:0px" />
<input value="TOTAL" type="text" class="total" readonly style="border:0px; margin-right:4px;"/>
<input value=" "     type="text" id="total_score" name="total_score" class="totalout"  readonly="readonly"/>
<input value=""    type="text" readonly style="border:0px" /><br/>

</form>


#3 cpd

cpd

    ¬_¬

  • Members
  • PipPipPip
  • 881 posts
  • LocationLondon, UK

Posted 30 December 2012 - 10:55 AM

<script language="javascript" type="text/javascript">  
function sumItem(item){
  t = 0
  for(i = 1; i <= 3; i++) 
     t+= (document.getElementById(item+"_"+i).value * 1);
  document.getElementById(item+"_total").value = t;   
  return t;  // or true after testing
} 
 
function totalscore(){  
  var T = sumItem('chip') + sumItem('pitch') + sumItem('roll');
  document.getElementById("total_score").value = T;   
  return false;  // or true after testing
}  
</script>

Although I'd probably split up the value change from the actual summation as its more logical. There's probably an easier way to do it as well but I'm only thinking about your specific needs. What I've offered isn't particularly extensible either but never the less.
"Debugging is twice as hard as writing the code in the first place. Therefore, if you write the code as cleverly as possible, you are, by definition, not smart enough to debug it."

"One of my most productive days was throwing away 1000 lines of code."




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Cheap Linux VPS from $5
SSD Storage, 30 day Guarantee
1 TB of BW, 100% Network Uptime

AlphaBit.com