This tutorial shows an example program for building a simple calculator. The primary purpose of this example program is to explain to beginners how basic PHP operations work.
PHP Simple Calculator Program Demo
The demo is styled using Bootstrap v5.1, and you can use Bootstrap at your convenience; It is not mandatory.
It asks users to enter two numerical values in a web form and submit it. Then performs arithmetic operations on the obtained values and prints the output to the web browser.
HTML Form:
An HTML form is shown in the following example code to display the calculator program:
<form method="post" action="">
<div class="row row-cols-1 row-cols-sm-2 row-cols-md-2 row-cols-lg-2 row-cols-xl-2 justify-content-center">
<div class="col text-center mb-3 mb-md-5">
<label for="Operand1" class="form-label fs-3">First Number</label>
<input id="Operand1" name="Operand1" type="number" step="any" class="form-control form-control-custom" value="<?php echo isset($Operand1)?$Operand1:''; ?>">
</div>
<div class="col text-center mb-3 mb-md-4">
<label for="Operand2" class="form-label fs-3">Second Number</label>
<input id="Operand2" name="Operand2" type="number" step="any" class="form-control form-control-custom" value="<?php echo isset($Operand2)?$Operand2:''; ?>">
</div>
</div>
<div class="row justify-content-center mb-3">
<div class="col-auto">
<input class="btn btn-success fs-2" type="submit" name="Calculate" value="+">
<input class="btn btn-success fs-2" type="submit" name="Calculate" value="-">
<input class="btn btn-success fs-2" type="submit" name="Calculate" value="x">
<input class="btn btn-success fs-2" type="submit" name="Calculate" value="/">
</div>
</div>
</form>
<?php if(isset($Result) && is_numeric($Result)){?><!-- Display Result -->
<div class="row justify-content-center">
<div class="col text-center">
<label for="Result" class="fs-4">Result</label>
<input id="Result" name="Result" type="number" step="any" class="form-control form-control-custom" value="<?php echo $Result; ?>">
</div>
</div>
<?php } if(isset($Error)){?><!-- Display Error Messages -->
<div class="row justify-content-center">
<div class="col">
<div class="alert alert-danger shadow-sm" role="alert">Error: <?php echo $Error; ?></div>
</div>
</div>
<?php } ?>
Once the form is submitted, the PHP $_POST
super global variable receives all input values. After that, it validates the input and displays it if an error occurs. Then, comparison and arithmetic operators within the conditional statements are used to calculate the expected value.
PHP Code:
<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
$Operand1=$_POST['Operand1'];
$Operand2=$_POST['Operand2'];
$Operator=$_POST['Calculate'];
/*Validation begins from here.*/
if($Operand1 == '' || $Operand2 == ''){
$Error = "The input values are required.";
}
elseif (filter_var($Operand1, FILTER_VALIDATE_FLOAT) === false || filter_var($Operand2, FILTER_VALIDATE_FLOAT) === false) {
$Error = "The input value must be a number only.";
}
elseif($Operator=="/" && ($Operand1 == 0 || $Operand2 == 0)){
$Error = "Cannot divide by zero.";
}
else{
/*Calculation begins from here.*/
if($Operator=="+")
$Result=$Operand1+$Operand2;
else if($Operator=="-")
$Result=$Operand1-$Operand2;
else if($Operator=="x")
$Result=$Operand1*$Operand2;
else if($Operator=="/")
$Result=$Operand1/$Operand2;
}
} ?>