Hello I have been struggling to learn HTML CSS and JAVASCRIPT. I have never tried and don't know basics exactly and I want to create a calculator and even for the basics I did simple example of x+1/2 and the answer I get is wrong here is the code
function result() {
var x = document.getElementById("constant").value;
var y = document.getElementById("height").value;
var z = document.getElementById("freq").value;
var c = 3 * 10 ** 8;
var k = x + 1;
var k2 = k / 2;
document.getElementById("Calculate").value = k2;
}<!DOCTYPE html>
<html>
<head>
<h1>Microstrip Calculator</h1>
<p>Enter the following values in numeric form:</p>
</head>
<body>
<form>
Di-Electric Constant: <input class="text" Placeholder="Enter Value" id="constant" </input>
<br> Di-Electric Height: <input class="text" Placeholder="Enter Value" id="height" </input>
<br> Operational Frequency: <input class="text" Placeholder="Enter Value" id="freq" </input>
<br>
<br>
<input type="text" id="Calculate" </input>
<input type="button" value="Calculate" onclick="result()">
</form>
<br/>
</body>
</html>Keep in mind that input value is always a string. And if you add to a string, you get a concatenated string, i.e.:
'1' + 1 === '11'
Convert your input values to numbers to make them behave like... well, numbers:
var x = Number(document.getElementById("constant").value);
var y = Number(document.getElementById("height").value);
var z = Number(document.getElementById("freq").value);
Inputs from a forms are always strings. To illustrate this, here is a small example:
a = "2"
b = "3"
console.log(a + b)
// but after convert string to int with the JS Function Number()
console.log(Number(a) + Number(b))This means, you have to convert all input from your form to numbers first.