Building A Simple Mathematical Calculator In Oracle Apex

Table of Contents

1. Overview
2. Technologies and Tools Used
3. Use Case
4. Steps with Screenshot
5. Conclusion

 

1. Overview

This document will teach the details about how to build a simple mathematical calculator in Oracle Apex. Question may rise why do we need to build our own calculator instead of using the calculator that are provided the respective Operating System providers?

The answer for this question would be, The calculators that are provided by the  Operating System providers will follow the universal laws so we cannot customize the functionalities of them based on our requirements. Because of this I am just building my own custom calculator and used this calculator in some of the places like building custom formula’s  and etc.,

 

2. Technologies and Tools Used

The following technology has been used to perform unit testing using Selenium web driver in Oracle Apex,

 

• Oracle APEX
• HTML and CSS
• JavaScript

3. Use Case

• To build a custom calculator based on our application requirements.
• Used to build the custom formula’s.

4. Steps with Screenshot

Step 1:  First create a normal or model dialog page(based on your requirement) in oracle apex.

And then create a static region on that page like in the below screenshot.

Step 2: Under the static region, In the source section past the following code.

<FORM NAME=”Calc”>

<TABLE BORDER=10>

<TR>

<TD>

<INPUT TYPE=”text”   Size=”50″ id=”be” >

<INPUT TYPE=”button”   VALUE= “Add To Result” OnClick=”va()”>

<INPUT TYPE=”button”  VALUE=”  clear  ” OnClick=”be.value = ””>

 

<!–<INPUT TYPE=”text”   Size=”50″ id=”cd” >–>

 

</TD>

</TR>

<TR>

<TD>

<br>

 

     

<INPUT TYPE=”button” style=”width: 60px”   VALUE=”  7  ”  OnClick=”be.value += ‘7’”>

 

<INPUT TYPE=”button” style=”width: 60px”   VALUE=”  8  ” OnCLick=”be.value += ‘8’”>

 

<INPUT TYPE=”button”style=”width: 60px”  VALUE=”  9  ” OnClick=”be.value += ‘9’”>

 

<INPUT TYPE=”button” style=”width: 60px”   VALUE=”  /  ” OnClick=”be.value += ‘ / ‘”>

   

<INPUT TYPE=”button”style=”width: 60px”   VALUE=”  < ” OnClick=”be.value += ‘  <‘”>

<INPUT TYPE=”button” style=”width: 60px”  VALUE=”  >  ” OnClick=”be.value += ‘ > ‘”>

<br>

     

<INPUT TYPE=”button” style=”width: 60px”  VALUE=”  4  ” OnClick=”be.value += ‘4’”>

 

<INPUT TYPE=”button” style=”width: 60px”  VALUE=”  5  ” OnCLick=”be.value += ‘5’”>

 

<INPUT TYPE=”button” style=”width: 60px”  VALUE=”  6  ” OnClick=”be.value += ‘6’”>

 

<INPUT TYPE=”button” style=”width: 60px” VALUE=”  x  ” OnClick=”be.value += ‘ * ‘”>

   

<INPUT TYPE=”button” style=”width: 60px” VALUE=”  %  ” OnClick=”be.value += ‘  /100 ‘”>

<INPUT TYPE=”button” style=”width: 60px” VALUE=”  .  ” OnClick=”be.value += ‘.'”>

 

 

<br>

     

<INPUT TYPE=”button”style=”width: 60px”  VALUE=”  1  ” OnClick=”be.value += ‘1’”>

 

<INPUT TYPE=”button” style=”width: 60px” VALUE=”  2  ” OnCLick=”be.value += ‘2’”>

 

<INPUT TYPE=”button” style=”width: 60px” VALUE=”  3  ” OnClick=”be.value += ‘3’”>

 

<INPUT TYPE=”button”style=”width: 60px”  VALUE=”  +  ” OnClick=”be.value += ‘+'”>

 

<br>

     

<INPUT TYPE=”button” style=”width: 60px”  VALUE=”  0  ” OnClick=”be.value += ‘0’”>

 

<INPUT TYPE=”button”style=”width: 60px”  VALUE=”  (  ” OnClick=”be.value += ‘(‘”>

 

<INPUT TYPE=”button” style=”width: 60px” VALUE=”  )  ” OnClick=”be.value += ‘)'”>

 

<INPUT TYPE=”button” style=”width: 60px” VALUE=”  –  ” OnClick=”be.value += ‘ – ‘”>

 

<br>

<br>

   

       

<INPUT TYPE=”button” style=”width: 200px”  VALUE=”  =  ” OnClick=”be.value = eval(be.value)”>

              

<br>

<br>

<br>

<INPUT TYPE=”button” style=”width: 110px” VALUE=”  Round Off(1)  ” OnClick=”be.value = ‘  round( ‘+be.value+’,1)'”>

<INPUT TYPE=”button” style=”width: 110px” VALUE=”  Round Off(2)  ” OnClick=”be.value = ‘  round( ‘+be.value+’,2)'”>

<INPUT TYPE=”button” style=”width: 110px” VALUE=”  Round Off(3) ” OnClick=”be.value = ‘  round( ‘+be.value+’,3)'”>

 

                

<br>

<br>

</TD>

</TR>

</TABLE>

</FORM>

 

 

Step 3: Now we have created the calculator in Oracle apex which will provide the functionalities like addition(+), subtraction(-), multiplication(*), division(/), round off the values and so on. If any further customization’s are needed in this then, we can design accordingly by having this design as a base.

 

5 . Conclusion

• Hope you all get the clear information about the building of a basic calculator in oracle apex. Thanks for reading …..