Monday, November 8, 2021

Addition of Five Numbers in PHP

 A simple program that I wrote in PHP to ask the user to give five numbers and then the program will compute the sum of five numbers, and display the result on the screen.

 I am currently accepting programming work, IT projects, school and application development, programming projects, thesis and capstone projects, IT consulting work, computer tutorials, and web development work kindly contact me at the following email address for further details.  If you want to advertise on my website kindly contact me also in my email address also. Thank you.

My email address is the following jakerpomperada@gmail.com, jakerpomperada@aol.com, and jakerpomperada@yahoo.com.

My mobile number here in the Philippines is 09173084360.






Program Listing

<?php

    if(isset($_POST["btnSubmit"])) {

        $sum = $_POST["input1"] +

               $_POST["input2"] +

               $_POST["input3"] +

               $_POST["input4"] +

               $_POST["input5"];

    }

?>

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Addition of 5 Numbers</title>

    <style>

        *,html {

            box-sizing: border-box;

            padding: 0;

            margin: 0;

        }

        body {

            display: flex;

            justify-content: center;

            align-items: center;

            min-height: 100vh;

            background: #fefefe;

        }


        .container {

            padding: 20px;

            border-radius: 10px;

            background: #fff;

            border: #000 solid 1px;

            text-align: center;

            min-width: 300px;

        }


        h1, h2 {

            margin: 0 0 5px;

            line-height: 1;

        }

        

        input {

            display: block;

            width: 100%;

            margin-bottom: 10px;

            padding: 10px;

            font-size: 15px;

        }


        input:last-of-type {

            margin: 0;

        }


        .output_wrapper {

            padding: 20px;

            font-size: 20px;

            background-color: #ccc;

            margin: 10px 0;

            border: none;

        }


        .output {

            margin: 10px 0 0;

        }


        button,

        .btnRetry {

            background-color: #4CAF50;

            color: #fff;

            border: none;

            border-radius: 2px;

            text-align: center;

            text-transform: uppercase;

            text-decoration: none;

            cursor: pointer;

            font-size: 15px;

            padding: 10px;

            width: 100%;

            display: block;

        }

    </style>

</head>

<body>

    <?php

        if(isset($sum)){

            echo '<div class="container">

                    <h1>Addition of Five Numbers in PHP</h1>

                    <h2>&#187; Jake R. Pomperada, MAED-IT, MIT &#171;</h2>

                    

                    <div class="output_wrapper">

                        <p>The sum of '

                            .$_POST["input1"] . ', ',

                            $_POST["input2"] . ', ',

                            $_POST["input3"] . ', ',

                            $_POST["input4"] . ', and ',

                            $_POST["input5"] .

                        ' is: </p>

                        <h2 class="output">'.$sum.'</h2>

                    </div>


                    <a href="addition.php" class="btnRetry">Retry?</a>

                </div>';

        } else {

            echo '<form action="" method="post" class="container">

                    <h1>Addition of 5 Numbers</h1>

                    <h2>&#187; Jake R. Pomperada, MAED-IT, MIT &#171;</h2>


                    <div class="output_wrapper">

                        <input type="text" name="input1" placeholder="Enter 1st number here..." required>

                        <input type="text" name="input2" placeholder="Enter 2nd number here..." required>

                        <input type="text" name="input3" placeholder="Enter 3th number here..." required>

                        <input type="text" name="input4" placeholder="Enter 4th number here..." required>

                        <input type="text" name="input5" placeholder="Enter 5th number here..." required>

                    </div>


                    <button type="submit" name="btnSubmit">Submit</button>

                </form>';

        }

    ?>

</body>

</html>


No comments:

Post a Comment