A Simple Calculator with HTML Forms and PHP

Sep 25, 2007 17:27 GMT  ·  By

The data contained by a HTML form is used by a site owner with various purposes. But before a form data can be used, you must get it from your visitors. There are many ways in which you can obtain the data from the forms. In another article there are presented the methods in which data is sent to be processed on server side. After the data is processed using server side scripts, it must be displayed, stored in a database, received in email or edited. Usually, these actions are individual, or combined between them are included in the processing script. PHP scripting language offers you simple ways of processing forms and of performing various actions with the form data.

Let's consider a form that requires users to input two numbers and the form processor could use them to perform various mathematical calculations such as addition, substraction and more. The form must be saved in a file form.html and must have the next structure:

code
<html>
<title>A simple math calculator</title>
<body>
Insert two numbers in the next form and hit submit button <br>
<form action="calculation.php" method="post"> 
Firstnumber: <input name="num1" type="text" /><br>
Secondnumber: <input name="num2" type="text" /> 
<input type="submit" />
</form>
</body>
</html>
Next, we will present the code for the form processor which must be saved as calculation.php
code
<html>
<head>
<title>Simple Math With User Input</title>
</head>
<body>
<?php
$num1 = $_POST['num1'];
$num2 = $_POST['num2'];
$a = $num1 + $num2;
$b = $num1 - $num2;
echo "The sum of the two numbers is ". $a;
echo "The difference of the two numbers is ". $b;
?>
</body>
</html>
If you open in a web browser the file form.html, fill in two numbers, such as 6 and 5, hit the submit button, then on the server side the form will be processed, the two numbers from the form fields are read and assigned as values to the variables $num1 and $num2, then the value of their difference is assigned to the variable $b and the sum to $a. The last step is the display of sum value (11), difference value (1), in the case of 6 and 5. You can try to add more text input fields to the form and corresponding to them to modify the processing script to display other mathematical operations results.

For example, you can define another form field for a number named num3 (thirdnumber) and other operations between num1, num2 and num3 to compare how the php script output will change. On the other side, you should notice that the form file is of html type and the processing script is php. Depending on the server directives, if you save the form processor file as .html, it may not perform the processing action.

It is recommended to always save your files that contain php code as .php in order to not receive error messages on the server side. You can also try, in time, to develop the capabilities of this simple calculator, by adding trigonometric functions, complex expressions evaluation, form validation and more.