Calculator

--- title: "Calculator in ASP.Net using Javascript" description: "Design code for above design (Default.aspx)headrunat=\"server\" titleCalculatortitle //java script file scriptsrc=\"calculation.js\"type=\"text/java" author: "Anonymous User" published: 2010-07-27 updated: 2020-03-04 canonical: https://www.mindstick.com/articles/38/calculator-in-asp-dot-net-using-javascript category: "asp.net" tags: ["asp.net"] reading_time: 2 minutes --- # Calculator in ASP.Net using Javascript ![Calculator in ASP.Net using Javascript](https://www.mindstick.com/mindstickarticle/9d413ec9-83cd-440c-8420-bce9846631bb/images/4012d892-8c31-4d92-af73-93e23b052fc1.png) \ Design code for above design (Default.aspx) ``` Calculator //java script file //css for clear and close button #btnClear { z-index: 1; left: 322px; top: 344px; height:38px; position: absolute; } #btnClose { z-index: 1; left: 398px; top: 344px; height:38px; position: absolute; }

``` JavaScript code for the above design(Calculation.js) ``` //initilizing values//val to store valuevar val=0;//enumerated operatorvar operators = { "Add":1, "Sub":2, "Mul":3, "Div":4, "Equal":5 };//to check for operator clickedvar operator_clicked = 0;//to chech whether number button is pressed nor notvar pressed;//to check whether decinal button is pressed or notvar dec_pressed; //equal function, which is called in every operators functionfunction equal(){ switch (operator_clicked) { case operators.Add://converting value of text box and adding it to val. val= (val + parseFloat(document.getElementById("txtValue").value)); break; case operators.Sub: val= (val - parseFloat(document.getElementById("txtValue").value)); break; case operators.Mul: val= (val * parseFloat(document.getElementById("txtValue").value)); break; case operators.Div: val= (val / parseFloat(document.getElementById("txtValue").value)); break; default: if (txtValue.Text!= "") val= parseFloat(document.getElementById("txtValue").value); else val= 0; break; }//displaying the value of val in text box. document.getElementById("txtValue").value =val;//setting decimal pressed to false dec_pressed = false;//setting number button pressed to false pressed = false;} //function called on page load function Page_Load() {//initilizing values val= 0; operator_clicked= 0; pressed= false; dec_pressed= false; document.getElementById("txtValue").value= "0"; } //this is called on ever number button clicked event function btn_Click(a) {//checking whether number button is pressed for the first time after any//operator button click or page load or not. if (pressed==false) document.getElementById("txtValue").value= "";//setting value of pressed to true pressed= true;//concatinating argument value to value of text box. document.getElementById("txtValue").value += a; } //this function is called on add button clicked function btnAdd_Click() {//equal() function is called equal();//setting operator_clicked value to value of operator.Add ie. 1 operator_clicked=operators.Add; } function btnSub_Click() { equal(); operator_clicked= operators.Sub; } function btnMul_Click() { equal(); operator_clicked= operators.Mul; } function btnDiv_Click() { equal(); operator_clicked= operators.Div; } function btnEqual_Click() { equal(); val= 0; operator_clicked= operators.Equal; } //function called when clear button is pressed function btnClear_Click() {//setting everything to its initial value. document.getElementById("txtValue").value= ""; val= 0; operator_clicked= 0; pressed= false; dec_pressed= false; } //this function is called when close button is clicked function btnClose_Click() {//this will close the current window. window.close(); } //function called when decimal button is pressed function btnDec_Click() {//checking whether number button is pressed or not if (pressed== false) document.getElementById("txtValue").value= "";//checking whether decimal point already exist or not if (dec_pressed== false) { if (document.getElementById("txtValue").value== "") document.getElementById("txtValue").value= "0."; else document.getElementById("txtValue").value+= "."; }//setting dec_pressed and pressed to true dec_pressed= true; pressed= true; } ``` ##### Screen shot ![Calculator in ASP.Net using Javascript](https://www.mindstick.com/mindstickarticle/9d413ec9-83cd-440c-8420-bce9846631bb/images/c65ca9ea-6437-491d-933f-9b685aae9432.png) --- Original Source: https://www.mindstick.com/articles/38/calculator-in-asp-dot-net-using-javascript Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.