Homework Help is Here – Start Your Trial Now!
Engineering
Computer Engineering
PLEASE MAKE THE CHOOSING OF OPERATION IN A DROPDOWN --- HTML CODE:                     Calculator                                                             Enter first number                                                                                             Enter second number                                                                                             Operation                                                                     Calculate                                                 __________________________________________________________________________________________________________________________ JAVASCRIPT CODE: var inputIdFirst = "valueOfX",     inputIdSecond = "valueOfY",     outputId = "resultHere",     opearation="operator"; var getInputs = function(id) {     return parseInt(document.getElementById(id).value); } var showOutput = function(outputValue, outputIdAsArg) {     document.getElementById(outputId).innerHTML = outputValue; } var manuplateAs = function(opeartor, valueOfX, valueOfY) {     if(opeartor == '+')         return valueOfX + valueOfY;     else if(opeartor == '-')         return valueOfX - valueOfY;     else if(opeartor == '*' || opeartor == "x")         return valueOfX * valueOfY;     else if(opeartor == '/')         return valueOfX / valueOfY; } var operation = function(operationName){     x = getInputs(inputIdFirst);     y = getInputs(inputIdSecond);     operator = document.getElementById("operator").value     output = manuplateAs(operator, x, y);     if(y !== unde}

PLEASE MAKE THE CHOOSING OF OPERATION IN A DROPDOWN --- HTML CODE:                     Calculator                                                             Enter first number                                                                                             Enter second number                                                                                             Operation                                                                     Calculate                                                 __________________________________________________________________________________________________________________________ JAVASCRIPT CODE: var inputIdFirst = "valueOfX",     inputIdSecond = "valueOfY",     outputId = "resultHere",     opearation="operator"; var getInputs = function(id) {     return parseInt(document.getElementById(id).value); } var showOutput = function(outputValue, outputIdAsArg) {     document.getElementById(outputId).innerHTML = outputValue; } var manuplateAs = function(opeartor, valueOfX, valueOfY) {     if(opeartor == '+')         return valueOfX + valueOfY;     else if(opeartor == '-')         return valueOfX - valueOfY;     else if(opeartor == '*' || opeartor == "x")         return valueOfX * valueOfY;     else if(opeartor == '/')         return valueOfX / valueOfY; } var operation = function(operationName){     x = getInputs(inputIdFirst);     y = getInputs(inputIdSecond);     operator = document.getElementById("operator").value     output = manuplateAs(operator, x, y);     if(y !== unde}

Computer Networking: A Top-Down Approach (7th Edition)
Computer Networking: A Top-Down Approach (7th Edition)
7th Edition
ISBN:9780133594140
Author:James Kurose, Keith Ross
Publisher:James Kurose, Keith Ross
Chapter1: Computer Networks And The Internet
Section: Chapter Questions
Problem R1RQ: What is the difference between a host and an end system? List several different types of end...
See similar textbooks
icon
Related questions
Question

PLEASE MAKE THE CHOOSING OF OPERATION IN A DROPDOWN
---

HTML CODE:

<!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">
    <link rel="stylesheet" href="/calculator.css">
    <title>Calculator</title>
</head>
<body>
    <divclass="calculator">
        <div class="inputbox">
            <div class="number">
                <span class="text">
                    Enter first number
                </span>
                <input type="number" id="valueOfX">
            </div>
            <div class="number">
                <span class="text">
                    Enter second number
                </span>
                <input type="number" id="valueOfY">
            </div>
            <div class="number">
                <span class="text">
                    Operation
                </span>
                <input type="text" id="operator">
            </div>
            <br>
            <button onclick="operation('=')"> Calculate </button>
        </div>
        <div class="result">
            <h1 id="resultHere"></h1>
        </div>
    </div>

    <script src="/calculator.js"></script>
</body>
</html>
 
 
__________________________________________________________________________________________________________________________

JAVASCRIPT CODE:

var inputIdFirst = "valueOfX",
    inputIdSecond = "valueOfY",
    outputId = "resultHere",
    opearation="operator";

var getInputs = function(id) {
    return parseInt(document.getElementById(id).value);
}

var showOutput = function(outputValue, outputIdAsArg) {
    document.getElementById(outputId).innerHTML = outputValue;
}

var manuplateAs = function(opeartor, valueOfX, valueOfY) {
    if(opeartor == '+')
        return valueOfX + valueOfY;
    else if(opeartor == '-')
        return valueOfX - valueOfY;
    else if(opeartor == '*' || opeartor == "x")
        return valueOfX * valueOfY;
    else if(opeartor == '/')
        return valueOfX / valueOfY;
}

var operation = function(operationName){
    x = getInputs(inputIdFirst);
    y = getInputs(inputIdSecond);
    operator = document.getElementById("operator").value
    output = manuplateAs(operator, x, y);

    if(y !== undefined && x !== undefined && output !== undefined){
        showOutput(`${x} ${operator} ${y} ${operationName} ${output}`);
    }else{
        showOutput("Please enter valid number or Fill input box")
    }
}

__________________________________________________________________________________________________________________________

CSS:

/* Basic reset */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font: bold 14px Arial, sans-serif;
}

html {
    height: 100%;
    background: white;
    background: radial-gradient(circle, #fff 20%, #ccc);
    background-size: cover;
}

.calculator {
    display: flex;
    flex-direction: column;
    width: 275px;
    height: auto;
   
    margin: 100px auto;
    padding: 20px 20px 9px;
   
    background: #9dd2ea;
    background: linear-gradient(#9dd2ea, #8bceec);
    border-radius: 3px;
    box-shadow: 0px 4px #009de4, 0px 10px 15px rgba(0, 0, 0, 0.2);
}

.inputbox{
    padding: 20px;
    display: flex;
    flex-direction: column;
}

.result{
    margin: 20px;
    text-align: center;
}

.number{
    margin: 3px;
}

.text{
    margin:4px;
}

 

Expert Solution
steps

Step by step

Solved in 3 steps with 3 images

SEE SOLUTIONCheck out a sample Q&A here
Blurred answer
Recommended textbooks for you
Computer Networking: A Top-Down Approach (7th Edi…
Computer Networking: A Top-Down Approach (7th Edi…
Computer Engineering
ISBN:
9780133594140
Author:
James Kurose, Keith Ross
Publisher:
PEARSON
Computer Organization and Design MIPS Edition, Fi…
Computer Organization and Design MIPS Edition, Fi…
Computer Engineering
ISBN:
9780124077263
Author:
David A. Patterson, John L. Hennessy
Publisher:
Elsevier Science
Network+ Guide to Networks (MindTap Course List)
Network+ Guide to Networks (MindTap Course List)
Computer Engineering
ISBN:
9781337569330
Author:
Jill West, Tamara Dean, Jean Andrews
Publisher:
Cengage Learning
Concepts of Database Management
Concepts of Database Management
Computer Engineering
ISBN:
9781337093422
Author:
Joy L. Starks, Philip J. Pratt, Mary Z. Last
Publisher:
Cengage Learning
Prelude to Programming
Prelude to Programming
Computer Engineering
ISBN:
9780133750423
Author:
VENIT, Stewart
Publisher:
Pearson Education
Sc Business Data Communications and Networking, T…
Sc Business Data Communications and Networking, T…
Computer Engineering
ISBN:
9781119368830
Author:
FITZGERALD
Publisher:
WILEY
SEE MORE TEXTBOOKS