Learn VBA & Macros in 1 Week!

JavaScript - Need Help With Form Calculator

Full Excel VBA Course - Beginner to Expert

Need Help With Form Calculator	View Content

Hello guys,
long story short my boss wants me to add this calculator form to our website(here is the link to what he wants exactly) so I try to copy that code but it won't work. I was wondering if this javascript would work.

Code:
Code:

<script language="JavaScript">
function calc() {
gear = document.name1.drpPumpType.1;
vane = document.name1.drpPumpType.2;

if (gear)
{

txtW = document.form1.txtW.value;
txtD = document.form1.txtD.value;
txtL = document.form1.txtL.value;
int gearCIR;
gearCIR = 6 * txtW *(2 * txtD - txtL) * (txtL - txtD) / 2;
}
else
{
int vaneCIR;
vaneCIR = 12 * txtW * (txtL + txtD) / 4 * (txtL - txtD) / 2;
}

I probably don't even need a if statement but I haven't program in a long time and never use java script before. so bare with me.

here is the html form code
Code:
Code:

<form name="name1">
<table align="center" border="0" width="44%">
<tbody>
<tr>
<td colspan="3"><span class="BoldHeadingLabel style1">Displacement&nbsp;from&nbsp;Measurements</span></td></tr>
<tr>
<td width="50"><span class="style1"></span><br />
</td>
<td width="157"><span class="BoldLabel style1">Pump/Motor&nbsp;Type:</span></td>
<td width="456"> <span class="style1"></span> <br />
</td></tr>
<tr>
<td width="50"><span class="style1"></span><br />
</td>
<td width="157"><span class="BoldLabel style1">Gear&nbsp;Width&nbsp;(W):</span></td>
<td><span class="style1"><input name="txtW" id="txtW" maxlength="10" size="10" value="" type="text" /></span></td></tr>
<tr>
<td width="50"><span class="style1"></span><br />
</td>
<td width="157"><span class="BoldLabel style1">Gear&nbsp;Bore&nbsp;Dia.&nbsp;(D):</span></td>
<td><span class="style1"><input name="txtD" id="txtD" maxlength="10" size="10" value="" type="text" /></span></td></tr>
<tr>
<td width="50"><span class="style1"></span><br />
</td>
<td width="157"><span class="BoldLabel style1">Bore&nbsp;to&nbsp;Bore&nbsp;(L):</span></td>
<td><span class="style1"><input name="txtL" id="txtL" maxlength="10" size="10" value="" type="text" /></span></td></tr>
<tr>
<td colspan="3"><span class="style1"></span><br />
</td></tr>
<tr>
<td width="50"><span class="style1"></span><br />
</td>
<td width="157"><span class="BoldLabel style1">Displacement&nbsp;(CIR)&nbsp;&nbsp;&nbsp;=&nbsp;&nbsp;&nbsp;</span></td>
<td><span class="CalAnswer style1">_________</span><span class="style1"><br />
</span></td></tr>
<tr></tr>
<tr>
<td colspan="3"><span class="style1"></span><br />
</td></tr>
<tr>
<td colspan="3" align="center"><input value="Calculate" id="submit1" name="submit1" type="submit" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input value="Clear" id="clearform" name="clearform" onclick="cmdReset_onclick()" type="button" /> </td></tr></tbody></table></form>

For some reason it says access denied. I copy this code from that website. but can't find any code wrong.
I know this code is probably so wrong but any help is much appreciated .

Full Excel VBA Course - Beginner to Expert

Javascript Calculator Form

Similar Tutorials

View Content

I'm just learning javascript and am editing a calculator form that will calculate square footage and write to a form text field. I have another form filed that I would like to display a number based a series of if else statements. ex: if square footage > 2761 then display 5.0., if square footage > 2521 then display 4.5. etc. Any help would be appreciated. I have posted my the code below.

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<HTML>
<HEAD>
<TITLE>Size Calculator</TITLE>
<SCRIPT LANGUAGE="JavaScript">

function CalculateSum(Atext, Btext, form)
{
var A = parseFloat(Atext);
var B = parseFloat(Btext);
form.Footage.value = A * B;
form.Size.value = 21;
}

/* ClearForm: this function has 1 argument: form.
   It clears the input and answer fields on the form. 
   It needs to know the names of the INPUT elements in order
   to do this. */

function ClearForm(form)
{
form.input_A.value = "";
form.input_B.value = "";
form.Footage.value = "";
form.Size.value = "";
}

// end of JavaScript functions -->
</SCRIPT>

</HEAD>

<BODY>

<P><FONT SIZE="+2">Sizing Calculator</FONT></P>

<FORM NAME="Calculator" METHOD="post">
<P>House width (ft): <INPUT TYPE=TEXT NAME="input_A" SIZE=10></P>
<P>House length (ft): <INPUT TYPE=TEXT NAME="input_B" SIZE=10></P>
<P><INPUT TYPE="button" VALUE="Calculate" name="Calculate" onClick="CalculateSum(this.form.input_A.value, this.form.input_B.value, this.form)"></P>
<P><INPUT TYPE="button" VALUE="Clear Fields" name="ClearButton" onClick="ClearForm(this.form)"></P>
<P>Square footage = <INPUT TYPE=TEXT NAME="Footage" SIZE=12></P>
<P>Size = <INPUT TYPE=TEXT NAME="Size" SIZE=12></P>
</FORM>

</BODY>
</HTML>

Novice Asking For Help With Form/calculator Coding

Similar Tutorials

View Content

Greetings all,

I am excited to have found this website as I have been trying to implement an idea for a website for about a month, but with little success. My problem is that I have little coding experience/knowledge.

I am trying to create a form/calculator. My concept includes drop down menus, check boxes, roll over images, and calculations. I've been trying to do the coding in Microsoft Excel; however, this has been very cumbersome, and the look is very generic.

The reason for my post here is I was hoping someone could offer advice, for a novice, on the best way to accomplish what I am looking to do. Is there a software/program that would be helpful with the coding? Am I in over my head?

Thank you all for any help you can offer!

Josh

Javascript Form Validation & Calculator

Similar Tutorials

View Content

Hiya,

Got a form located at the following link:
http://www.boostcreative.com/MA/

In short, trying to make it so that the user can type multiple numbers into the various fields and in real time they add up. If it hits the magic number, they can submit the form. The problem I'm having is the form validation.

Any thoughts as to how I would set it so that the form is only submitted if the magic number is reached? (In this case 200)

Thanks!

Code:

    $(document).ready(function(){
        $(".addition").each(function() { 
            $(this).keyup(function(){
                calculateSum();
            });
        }); 
    }); 
    function calculateSum() {
 
        var sum = 0;
        $(".addition").each(function() {
            if(!isNaN(this.value) && this.value.length!=0) {
                sum += parseFloat(this.value);
            if ( sum == 200 ) {	
	    $('#negative').hide();$('#positive').show();}
	                if ( sum != 200 ) {	
	    $('#negative').show();$('#positive').hide();}
            } 
        });
        $("#sum").html(sum.toFixed(0));
    }
    
    function validateForm()
		{
        var total = 0;
        $(".addition").each(function() {
            if(!isNaN(this.value) && this.value.length!=0) {
                total += parseFloat(this.value);
	        if ( total != 200 ) {	
		  alert("That Total is incorrect");
		  return false;
            } 
   }

Code:

<form method="post" action="contactForm.php" name="MAloyalty" id="MAloyalty" onsubmit="return validateForm(this)" >

How Do I Autofill 1 Field In An Html Form With A Result From A Javascript Calculator

Similar Tutorials

View Content

Hi guys,

I have a simple calculator on my website which has a few options selectable by radio buttons. When the user adds selections - the total price of their order is automatically calculated and displayed in a <div> for them to see. The client then can deselect options or add according to their budget.

The code which deals with this is as follows (just sections of it but you get the point ....)

In the <HEAD>

Code:

<script type = "text/javascript">

var allprices = [];
var index = 0;

function chkrads(frmName,rbGroupName) {
var chosen = "";
var radios = document[frmName].elements[rbGroupName]; 
for (var i=0; i <radios.length; i++) { 
if (radios[i].checked) { 
chosen = radios[i].value;
} 
}



if (chosen == 0) {printprice = 0}

if (chosen == 1) {printprice = 99}
if (chosen == 2) {printprice = 150}
if (chosen == 3) {printprice = 250}

if (chosen == 21) {printprice = 200}
if (chosen == 22) {printprice = 300}

if (chosen == 30) {printprice = 50}

if (chosen == 41) {printprice = 50}
if (chosen == 42) {printprice = 70}
if (chosen == 43) {printprice = 90}


if (rbGroupName == "size") {index = 0}
if (rbGroupName == "colour") {index = 1}
if (rbGroupName == "frame") {index = 2}
if (rbGroupName == "glass") {index = 3}
if (rbGroupName == "hook") {index = 4}
if (rbGroupName == "delivery") {index = 5}

allprices[index] = printprice;

var totalprice = 0;
for (var i =0; i <allprices.length; i++) {
if (!isNaN(allprices[i])) {
totalprice = totalprice + allprices[i];
}
}

document.getElementById("result").style.display = "block";
document.getElementById("result").innerHTML = totalprice;


}
</script>

Then in the <BODY>

Code:

 <form name= "myform" style="font-size:11px; font-family:Arial, Helvetica, sans-serif;">

<input type = "radio" name = "size" value = "0" onclick = "chkrads('myform', 'size')"> <b>0</b>
<input type = "radio" name = "size" value = "1" onclick = "chkrads('myform', 'size')"> <b>1</b>
<input type = "radio" name = "size" value = "2" onclick = "chkrads('myform', 'size')"> <b>2</b>
<input type = "radio" name = "size" value = "3" onclick = "chkrads('myform', 'size')"> <b>3</b>

<br /><br /><br /><br />

<input type = "radio" name = "colour" value = "0" onclick = "chkrads('myform', 'colour')"><b>No</b>
<input type = "radio" name = "colour" value = "21" onclick = "chkrads('myform', 'colour')"><b>black</b>
<input type = "radio" name = "colour" value = "22" onclick = "chkrads('myform', 'colour')"><b>Multi Colour</b>

<br /><br /><br /><br />

<input type = "radio" name = "frame" value = "0" onclick = "chkrads('myform', 'logo')"><b>No</b>
<input type = "radio" name = "frame" value = "30" onclick = "chkrads('myform', 'logo')"><b>Yes</b>


<br /><br /><br /><br />

<input type = "radio" name = "glass" value = "0" onclick = "chkrads('myform', 'glass')"><b>No</b>
<input type = "radio" name = "glass" value = "51" onclick = "chkrads('myform', 'glass')"><b>Yes</b>

<br /><br /><br /><br />

<input type = "radio" name = "hook" value = "0" onclick = "chkrads('myform', 'hook')"><b>0</b>
<input type = "radio" name = "hook" value = "41" onclick = "chkrads('myform', 'hook')"><b>1</b>
<input type = "radio" name = "hook" value = "42" onclick = "chkrads('myform', 'hook')"><b>2</b>
<input type = "radio" name = "hook" value = "43" onclick = "chkrads('myform', 'hook')"><b>3</b>

<br /><br /><br /><br />

<input type = "radio" name = "delivery" value = "0" onclick = "chkrads('myform', 'delivery')"><b>No</b>
<input type = "radio" name = "delivery" value = "61" onclick = "chkrads('myform', 'delivery')"><b>Yes</b>

</form>

This all calculates the cost and then supplies the answer into this code:

Code:

<div id="result" style="display:none;"><strong></strong> <span id="totalprice"></span> </div>

This all works exactly as I want - my question is this ....

I have added an HTML contact form at the bottom of the page which goes off to a Form2Email PHP script. (All working fine)

I really want to autofill one of the sections of this form "QUOTED PRICE" with the value calculated by my earlier product calculator.

The form looks like so:

Code:

<form id="ContactForm" method="post" action="FormToEmail.php"  class="input2">

<label>Name: <input name="name" type="text" id="name" value="" size="" maxlength="80" class="input"/></label>

<br /><br />

<label>QUOTED PRICE: <input name="QUOTED PRICE" type="text" id="QUOTED PRICE" value="" size="" maxlength="80" class="input"/></label>

<br /><br />

<label>
<input type="submit" class="submit" name="submit" id="submit" value="submit"/>
</label>
</form>

Does anyone know how to achieve this?! It would be a massive help!

Help! Calculator...

Similar Tutorials

View Content

Hi all. I'm having a bit of a problem returning a different value each time a different button is pressed for calculator.

What am I doing wrong?

Code:

<script>
function calc(btname){
for(var x=0;x<=11;x++){
if(x==0){
btname="zero";
}else if(x==1){
btname="one";
}else if(x==2){
btname="two";
}else if(x==3){
btname="three";
}else if(x==4){
btname="four";
}else if(x==5){
btname="five";
}else if(x==6){
btname="six";
}else if(x==7){
btname="seven";
}else if(x==8){
btname="eight";
}else if(x==9){
btname="nine";
}else if(x==10){
btname="multiply";
}else if(x==11){
btname="divide";
}
if('document.forms.test.'+btname+'.onClick'){
alert(btname);
}
}
}

function scalc(){
var sign="";
var btname="";
document.write('<form name="test">');
for(var x=0;x<=11;x++){
if(x==0){
btname="zero";
}else if(x==1){
btname="one";
}else if(x==2){
btname="two";
}else if(x==3){
btname="three";
}else if(x==4){
btname="four";
}else if(x==5){
btname="five";
}else if(x==6){
btname="six";
}else if(x==7){
btname="seven";
}else if(x==8){
btname="eight";
}else if(x==9){
btname="nine";
}else if(x==10){
btname="multiply";
sign = "*";
}else if(x==11){
btname="divide";
sign = "/";
}
if(x<10){
document.write('<input type="button" size="30" name="'+btname+'" value="'+x+'" onClick="calc(this);">&nbsp;');
}else if(x>9 && x<12){
document.write('<input type="button" size="30" name="'+btname+'" value="'+sign+'" onClick="calc(this);">&nbsp;');
}
if(x==2 || x == 5 || x == 8){
document.write('<br>');
}
}
document.write('</form>');
}
scalc();
</script>

ANY help is GREATLY appreciated!

Some Help Regarding Calculator

Similar Tutorials

View Content

Below is the code for a calculator using script.
can one help me to explain me the colored line??

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>

<body>
</body>
<script language="javascript" type="text/javascript">
function multiply()
{
a=Number Quote:
Quote:
(document.calculator.number1.value)

;
b=Number(document.calculator.number2.value);
c=a*b;
document.calculator.total.value=c;
}
function addition(){
a=Number(document.calculator.number1.value);
b=Number(document.calculator.number2.value);
c=a+b;
document.calculator.total.value=c;
}
function subtraction(){
a=Number(document.calculator.number1.value);
b=Number(document.calculator.number2.value);
c=a-b;
document.calculator.total.value=c;
}
function division(){
a=Number(document.calculator.number1.value);
b=Number(document.calculator.number2.value);
c=a/b;
document.calculator.total.value=c;
}
function modulus(){
a=Number(document.calculator.number1.value);
b=Number(document.calculator.number2.value);
c=a%b;
document.calculator.total.value=c;
}
</script>

</head>

<body>

<form name="calculator">
Number 1: <input type="text" name="number1">
Number 2: <input type="text" name="number2">
Get Result: <input type="text" name="total">
<input type="button" value="ADD" onclick="javascript:addition();">
<input type="button" value="SUB" onclick="javascript:subtraction();">
<input type="button" value="MUL" onclick="javascript:multiply();">
<input type="button" value="DIV" onclick="javascript:division();">
<input type="button" value="MOD" onclick="javascript:modulus();">

</form>

</body>
</html>

Bmi Calculator

Similar Tutorials

View Content

Hi ,
this is my bmi calculator script

<HEAD>

<script type="text/javascript">


</script>
</HEAD>



<BODY>

<div align="left">
<form name="form" id="form">
<input type="Text" name="weight" size="4"> Peso (Kg)<br>
<input type="Text" name="height" size="4"> Altezza (Cm)<br>
<input type="Text" name="BodyMassIndex" id="BodyMassIndex" size="4"> BMI<br>
<input type="Text" name="feedback" id="feedback" style="padding:10px 0 20px 0; border:none; font-weight:600; color:#555555; font-family:verdana;" ><br>
<input type="button" style="font-size: 8pt" value="Calcola" onClick="calculateBMI()" name="button">
<input type="reset" style="font-size: 8pt" value="Reset" onclick="resetAll()" name="button">
</form>
</div>

<!-- Script Size:

I would want to show writing that it says if is in overweight, norms or I underweigh, but the script does not work. could someone help me? please

Help With Calculator.

Similar Tutorials

View Content

How could i make a calculator that changes three values when a vertex on an image moves. Example : When a point moves on the triangle it changes the cost quality and time.
I have this start and need the meat for the concept to work.<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>

<body>
<p><img src="Assets/Project-triangle.svg.png" width="500" height="492" alt=""/>-------------------------------------------<img src="Assets/triangle.gif" width="224" height="210" alt=""/></p>
<p>
<label for="textfield">Cost :</label>
<input type="text" name="textfield" id="textfield">
<label for="textfield2"> Time :</label>
<input type="text" name="textfield2" id="textfield2">
<label for="textfield3">Quality :</label>
<input type="text" name="textfield3" id="textfield3">
</p>
<p> </p>
</body>
</html>

Help would be greatly appreciated!

Age Calculator - Help!!

Similar Tutorials

View Content

I'm using the following code to calculate an age from the given date of birth however it works for some DOB's, gives wrong answers for some and undefined for others, can someone help me?

Code:

 
<div style="font-size:13px; font-family:Verdana;">
<script>
 <!--
/*Darren McGrady */
 var current= new Date()
 var day  = current.getDate()
 var month = current.getMonth() + 1
 var year = current.getFullYear()
 var a = 29
 var b = 12
 var c = 1980
 var age

if (month < b)
      age = (year-c)-1

if ((month == b) && (day < a))
      age = (year-c)-1
else
      age = year-c

document.write(age);

//-->
 </script>
</div>

Ajax Calculator

Similar Tutorials

View Content

I have a formula done in PHP. Lets say it's
PHP Code:
$sum = $_POST['one'] + $_POST['two'];

I have 2 textboxes, one named "one", the other named "two". I want the page to also display the answer under the text boxes but it updates in real time when you input a value into the textboxes. How would I do that?

Trying To Get The Age Calculator Work

Similar Tutorials

View Content

already solved

Need Help With Simple Calculator

Similar Tutorials

View Content

I have been having problems adding checkboxes and option selects in the same function..

Here's what I have.

Code:

  <script type="text/javascript">
        function bonuscalc() {
            var aaaa = document.getElementById("aaaa").value;
            var bbbb = document.getElementById("bbbb").value;
	    var cccc = document.getElementById("cccc").value;
	    if (dddd.checked){
		var dddd = document.dddd.value = 2;
		} 
		else {
		var dddd = document.dddd.value = 1;
		}
	    var eeee = document.getElementById("eeee").value;
            var bonus = aaaa* bbbb * dddd * cccc * eeee;
	    var roundbonus = Math.round(bonus*10)/10;
            
            document.getElementById("roundbonus").value = roundbonus;
        }

    </script>

Javascript first.. The part I'm not sure about is the if/else part for checbox.

Now the html:

Code:

<form action="" id="calc1">
<table width="100%">
<tbody>
<tr>
<td>A status:   <select id="aaaa">
      		 		<option value="1.1">A1</option>
        	    	        <option value="1.02">A2</option>
        			<option value="1">A3</option>
        			<option value="0.95">A4</option>
   				</select>  
</td>   
 <td>B status: <select id="bbbb">
                        <option value="1">0%</option>
                        <option value="0.99">1%</option>
                        <option value="0.98">2%</option>
                        <option value="0.97">3%</option>
                        <option value="0.96">4%</option>
                        <option value="0.95">5%</option>
                        <option value="0.94">6%</option>
                        <option value="0.93">7%</option>
                        <option value="0.92">8%</option>
                        <option value="0.91">9%</option>
                        <option value="0.90">10%</option> 
                      </select>    
</td>
            
<td>E status:<input id="eeee" type="text" />
</td>

<td>D status:   <input id="dddd" name="dddd" type="checkbox">
</td>
                
<td>C status:   <select id="cccc">
        	          <option value="1">No</option>
                          <option value="1.2">Yes</option>
   		        </select>
</td>
</tr>                          
<tr>
<td width="100%">
     <input type="button" value="Submit" onclick="bonuscalc()" />
     <br /> 
 Result: <input type="text" readonly="readonly" id="roundbonus" />
</td>
</tr>
</tbody>
</table>
</form>

I hope it's not too confusing.
The idea is to assign value 2 if the checkbox is checked and value 1 is it isn't..

Rate Calculator

Similar Tutorials

View Content

I'm currently revamping a website that was written in aspx. The problem i'm having is that the webpage is moving to a hosting company that doesn't support asp. I'm wanting to rebuild the calculator in javascript, however I have no javascript experience. I can figure some parts of the code out, however I don't really have time to learn it, and was wondering if someone would be willing to help.

The site i'm trying to change is:

http://sunflowertitle.com/ratecalculator.aspx

It shouldn't be that difficult to rebuild as its not a detailed calculator. I have all the original files if anyone needs them, i've been working on this for awhile and i'm to the point i'd be willing to pay someone to build it.

Almost Have My First Calculator Made

Similar Tutorials

View Content

So after some studying I have a pretty decent method using objects. I built it so that you hit the first number, then you would hit a plus or minus then the second number. The problem is just getting the buttons to define variables and run functions.

Quote:
<html>
<head>
<script type="text/javascript" >
x=10;
h=1;
var numbs = new Const(x)
function Const(one){
this.x=one;
ADD(this.x)
if(h=1){
function ADD(a){
y=5;
b=y+a;
alert(b);
}}}
</script>
</head>
<body>
<input type="button" value="1" onclick="needs to run all that AND set x=1 and h=1">
</body>
</html>
Also I plan on going back and making y, which is the second number you're adding, an object. For now I'm just setting it equal to something so I don't have to mess with it.

Day Of The Week Calculator Help

Similar Tutorials

View Content

Hi there, me again.

Need help with this bit of code. The script itself I got from the JS Source, and modified it myself a bit so that instead of the user inputting their DOB via a prompt box, it could be entered via dropdown lists. I attempted to do this, but have come across a problem. For some reason, the result always (or at least, that's what it looks like to me) appears to be the array index element of [4], i.e. Friday. Not really sure why this is, but no matter what date is entered out of the example dates shown below in the HTML, the result is always Friday. Double-checked on another similiar calculator script online, and sure enough, the results are wrong. So it's a problem with my script. Except I can't identify it. So any help from Old Pedant/Philip M, or whoever else on the forum has the patience to help me , would be much appreciated.

Code:

<script type="text/javascript" language="javascript">
function findDay() {
  var arr = new Array();
  arr[0] = "Monday";
  arr[1] = "Tuesday";
  arr[2] = "Wednesday";
  arr[3] = "Thursday";
  arr[4] = "Friday";
  arr[5] = "Saturday";
  arr[6] = "Sunday";
  var selectdate = document.getElementById("selectdate").selectedIndex;
  var selectmonth = document.getElementById("selectmonth").selectedIndex;
  var selectyear = document.getElementById("selectyear").selectedIndex;
  var birthday = new Date(selectdate + selectmonth + selectyear);
  var day = birthday.getDay();
  document.getElementById("div1").innerHTML = "You were born on a " + arr[day] + "!"
}
</script>

Code:

<html>
<h1>Day Of The Week?</h1>
Input your date of birth, and click the Go button to find out what day of the week you were born on.
<hr/>
<form style="text-align: center;">

<select id="selectdate">
<option>1</option>
<option>2</option>
<option>3</option>
</select>

<select id="selectmonth">
<option>January</option>
<option>February</option>
<option>March</option>
</select>

<select id="selectyear">
<option>1995</option>
<option>1996</option>
<option>1997</option>
</select>
<br/>
<br />
<input align="middle" type="button" value="Go" onclick="findDay()">
</form>
<div id="div1"></div>
</html>

What Am I Doing Wrong With My Calculator?

Similar Tutorials

View Content

I'm trying to get this calculator to work

html

Code:

<form name="Calc" id="calculator" style="position: fixed; top: 25px; right: 5px; background: #5F4A29;" action="">
  <table border="6">
    <tr>
      <td colspan="4"><input type="text" name="Input" size="25" onclick="calc(Calc); return true" /></td>
    </tr>
    <tr>
      <td><input class="button" type="button" name="clr" value="c" onclick="calc(Calc)" /></td>
      <td><input class="button" type="button" name="(" value="(" onclick="calc(Calc)" /></td>
	  <td><input class="button" type="button" name=")" value=")" onclick="calc(Calc)" /></td>
      <td><input class="button" type="button" name="equ" value="=" onclick="calc(Calc)" /></td>	  
    </tr>
    <tr>
      <td><input class="button" type="button" name="_1" value="1" onclick="calc(Calc)" /></td>
      <td><input class="button" type="button" name="_2" value="2" onclick="calc(Calc)" /></td>
	  <td><input class="button" type="button" name="_3" value="3" onclick="calc(Calc)" /></td>
      <td><input class="button" type="button" name="add" value="+" onclick="calc(Calc)" /></td>	  
    </tr>
    </tr>
    <tr>
      <td><input class="button" type="button" name="_4" value="4" onclick="calc(Calc) += '4'" /></td>
      <td><input class="button" type="button" name="_5" value="5" onclick="calc(Calc) += '5'" /></td>
	  <td><input class="button" type="button" name="_6" value="6" onclick="calc(Calc) += '6'" /></td>
      <td><input class="button" type="button" name="sub" value="-" onclick="calc(Calc)" /></td>	  
    </tr>
    <tr>
      <td><input class="button" type="button" name="_7" value="7" onclick="calc(Calc)" /></td>
      <td><input class="button" type="button" name="_8" value="8" onclick="calc(Calc)" /></td>
	  <td><input class="button" type="button" name="_9" value="9" onclick="calc(Calc)" /></td>
      <td><input class="button" type="button" name="mul" value="*" onclick="calc(Calc)" /></td>	  
    </tr>
    <tr>
      <td></td>
      <td><input class="button" type="button" name="_0" value="0" onclick="calc(Calc)" /></td>
	  <td><input class="button" type="button" name="dot" value="." onclick="calc(Calc)" /></td>
      <td><input class="button" type="button" name="div" value="/" onclick="calc(Calc)" /></td>	  
    </tr>
  </table>
</form>

and js

Code:

function calc(Calc)
{
var add = eval (document.Calc.add.value);
var sub = eval (document.Calc.sub.value);
var mul = eval (document.Calc.mul.value);
var div = eval (document.Calc.div.value);
var clr = eval (document.Calc.clr.value);
var _0 = eval (document.Calc._0.value);
var _1 = eval (document.Calc._1.value);
var _2 = eval (document.Calc._2.value);
var _3 = eval (document.Calc._3.value);
var _4 = eval (document.Calc._4.value);
var _5 = eval (document.Calc._5.value);
var _6 = eval (document.Calc._6.value);
var _7 = eval (document.Calc._7.value);
var _8 = eval (document.Calc._8.value);
var _9 = eval (document.Calc._9.value);
var dot = eval (document.Calc.dot.value);
var equ = eval (document.Calc.equ.value)

var output=Calc.Input.value=add+sub+mul+div+clr+_0+_1+_2+_3+_4+_5+_6+_7+_8+_9+dot+equ;

document.getElementById("calculator").innerHTML=output;
}

Can someone help me sort this out?

Help With Making Calculator

Similar Tutorials

View Content

I'm decent at JavaScript but I have no idea how I should go about making a calculator. So far I'll drop a bunch of buttons down that all onclick to a function (a,b) and then it will add or w/e then return. How would I incorporate multiple methods such as subtraction or multiplication though?

Basically I'm confident I the ability to code or learn to make this calculator, just have no idea how to set this up, thanks.

Calculator Problems

Similar Tutorials

View Content

i am building/coding a simple calculator and i have this
Code:

function addDigit() {
	if(id=7) {
		document.getElementById("display").value="7";
	}
	if(id=8) {
		document.getElementById("display").value="8";
	}
	if(id=9) {
		document.getElementById("display").value="9";
	}
}

function clearAll() {
	document.getElementById("display").value="";
}

as the code but when i press the 7 8 or 9 buttons it only shows up as a 9.
go to http://www.mightypeacock.com/Practice/calculator.html to see what i mean.

Very New To Js, Need Help With An Averages Calculator

Similar Tutorials

View Content

I have my first ever scholastic JS assignment and so far it's felt nearly impossible to get a grip on how to do it. I've gone through the W3c tutorials entirely 3 times now and still, nothing is clicking mentally. Generally I do better if I can reverse engineer already written code but I can't find anything similar enough to this on the net to figure it out.

The assignment is to create a grade averages calculator as seen in this pictu

Along with this starter code:
Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Assignments score calculator</title>
<style type="text/css">
<!--
.score {
    width: 30px;
}
-->
</style>
</head>

<body>
<h1>Assignments score calculator</h1>

<form id="calculator" name="calculator" method="post" action="">
<p>Enter your Name: 
  <label for="firstname"></label>
  <br />
  <input type="text" name="firstname" id="firstname" />
<p> 
  <label for="A1">Assignment #1 sco </label>
  <input name="A1" type="text" class="score" id="A1" maxlength="3" /><br />
<label for="A2">Assignment #2 sco </label>
  <input name="A2" type="text" class="score" id="A2" maxlength="3" /><br />
<label for="A3">Assignment #3 sco </label>
  <input name="A3" type="text" class="score" id="A3" maxlength="3" />
<p>
  <label for="button"></label>
  <input type="submit" name="Submit" id="Submit" value="Submit" xx="doCalculation(this.form.firstname.value,this.form.A1.value,this.form.A2.value,this.form.A3.value)" />
</form>
</body>
</html>

I understand what I need to do, just not the syntax to do it. Any help would be appreciated. Sorry for newbiness.

Need Help On Javascript Calculator

Similar Tutorials

View Content

Hi all master and expert coders

I am working on a calculator which using the instructor's codes from the school. The problem that I having right now is the operator. I have successfully complete only the addition, but could not manage on subtraction and the rest operator. I hope experienced codes would help me out on this. Below is my codes.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<script type="text/javascript">
function calculate() {
var value1 = parseInt(validate(document.getElementById("value1").value));
var value2 = parseInt(validate(document.getElementById("value2").value));
radioButtonCheck();
checkboxCheck();
dropDownListCheck();
document.getElementById("result").value = addition(value1, value2);
document.getElementById("result").value = subtraction(value1, value2);
document.getElementById("result").value = multiplication(value1, value2);
document.getElementById("result").value = division(value1, value2);
}

function validate(value) {
if (value == null || value == "") {
alert("Required Field");
return 0;
} else if (isNaN(value)) {
alert("Must be a number");
return 0;
}
else return value;
}

function addition(value1, value2){
return value1 + value2;
}
// trying to use the same addition return statement but fail.
function radioButtonCheck() {
if ((document.getElementById("radio1").checked == false)
&& (document.getElemtById("radio2").checked == false)) {
alert("Please select a radio button");
valid = false;
}
}
function checkboxCheck() {
if ((document.getElementById("cbox1").checked == false)
&& (document.getElementById("cbox2").checked == false)) {
alert("Please select a checkbox");
valid = false;
}
}
function dropDownListCheck() {
if ((document.getElementById("ddlOperator").selectedIndex == 0)) {
alert("Please select a operator");
valid = false;
}
}

</script>

<title>Calculator By Alsus</title>
</head>
<body>
<h2>Calculator</h2>
<table border = "1">
<tr>
<td>Value 1:</td>
<td><input type="text" id="value1" name="value1" /></td>
</tr>
<tr>
<td>Value 2:</td>
<td><input type="text" id="value2" name="value2" /></td>
</tr>
<tr>
<td>Operator:</td>
<td><input type="text" id="Operator" name="Operator" /></td>
</tr>
<tr>
<td><input type="radio" id="radio1" name="radio1" value="radio1" />Radio1<br /></td>
<td><input type="radio" id="radio2" name="radio2" value="radio2" />Radio2<br /></td>
</tr>
<tr>
<td><input type="checkbox" id="cbox1" name="cbox1" value="cbox1" />Checkbox 1<br /></td>
<td><input type="checkbox" id="cbox2" name="cbox2" value="cbox2" />Checkbox 2<br /></td>
</tr>
<tr>
<td>
<select id="ddlSelect">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
</td>
<td> </td>
</tr>
<tr>
<td>Result:</td>
<td><input type="text" id="result" name="result" /></td>
</tr>
</table>
<input type="submit" id="btn_sub" name="btn_sub" value="Submit" onclick="calculate()" />
<input type="reset" id="btn_res" name="btn_res" value="Reset" />
</body>
</html>