It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.
Closed 10 years ago.
<html>
<head>
<script>
function calculate(){
var a = parseFloat(frmMain.name.value);
var b = parseFloat(frmMain.Salary.value);
var c = parseFloat(frmMain.taxrate.value);
}
</script>
</head>
<body>
<form name="frmMain">
Name <input type ="text" id="name" /><br />
Salary <input type ="text" id="Salary" /><br />
tax rate <input type ="text" id="taxrate" /><br />
<input type="button" value="calculate" onclick="calculate()" />
<input type="reset" value="Clear" /><br />
Sammary<textarea cols="20" rows="5" ></textarea>
</form>
</body>
</html>
i try to make it like this but i dont know how to get the salary and the name and taxrate put it in the comment or notes place may any body help ?
the program should get the name and taxrate and salary and print it inside the textarea using javascript when i click on calculate ? i dont have an idea how to do this
You can use something like this
DEMO
function calculate(){
var a = frmMain.name.value;
var b = parseFloat(frmMain.Salary.value);
var c = parseFloat(frmMain.taxrate.value);
frmMain.summary.value = "Name :"+a+"\nSalary :"+b+"\nTax Rate :"+c;
}
What you want is to add an id to the textarea, maybe id="texty" after that you can get that elemnt with javascript, like this, var area = document.getElementById('texty'); and from there you use the .innerHTML attribute to set its value.
area.innerHTML = b*c; <- this math isn't what you're after but I used a simple case to show you how its done! :)
If you're more keen on using value then read this post to understand the diffrences between .innerHTML and .value
Also reading the JS docs on MDN is very good reference, I'll put a link in the bottom!
Check out the tinker below!
Tinker.io here
MDN JS Docs
<html>
<head>
<script>
function calculate(){
var a = frmMain.name.value;
var b = parseFloat(frmMain.Salary.value);
var c = parseFloat(frmMain.taxrate.value);
var area = document.getElementById("text");
area.innerHTML='Name : '+a+'\nSalary : '+b+'\nTax Rate : '+c;
}
</script>
</head>
<body>
<form name="frmMain">
Name <input type ="text" id="name" /><br />
Salary <input type ="text" id="Salary" /><br />
tax rate <input type ="text" id="taxrate" /><br />
<input type="button" value="calculate" onclick="calculate()" />
<input type="reset" value="Clear" /><br />
Sammary<textarea cols="20" rows="5" id="text"></textarea>
</form>
</body>
</html>
Related
This question already has an answer here:
Why am I getting "ReferenceError: getElementById is not defined"?
(1 answer)
Closed 1 year ago.
what's the problem in this code? I have tried and can't figure it out. I am a total newbie in HTML, JavaScript, and CSS.
I am wandering around the internet but I think I am missing something and its a small mistake. can you kindly help? I have to learn this for my upcoming projects
here is the code
function result() {
let a = getElementById("constant").value;
let b = getElementById("height").value;
let c = getElementById("freq").value;
let sum = Number(a) + Number(b) + Number(c);
document.getElementById("Calculate").value = sum;
}
<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/>
It is document.getElementById(). See: MDN WebDocs: document.getElementById().
The Document method getElementById() returns an Element object representing the element whose id property matches the specified string. Since element IDs are required to be unique if specified, they're a useful way to get access to a specific element quickly.
function result()
{
let a = document.getElementById("constant").value;
let b = document.getElementById("height").value;
let c = document.getElementById("freq").value;
let sum = Number(a) + Number(b) + Number(c);
document.getElementById("Calculate").value = sum;
}
<!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>
I know it's a silly question of this type, but im new to JS and im learning coding step by step. I'm curious how would i set up sessions for input values in javascript if i have this type of coding?
<input type="text" id="name" >
<input type="text" id="lastname">
<input type="submit" value="submit" id="btn">
Again i want to apologize for this question , and thank you for the help that you can offer me about this .
Now this code had help me out.What i wanted to do is to store the values of the input fields into sessions and be able to display them into the browser likethis:
<body>
<input type="text" id="name" ><br><br>
<input type="text" id="lastname"><br><br>
<input type="submit" id="btn" value="set sessions"><br><br>
<p id="para"></p>
<script>
var btn=document.getElementById("btn");
btn.onclick=function(){
var name=document.getElementById("name").value;
var lastname=document.getElementById("lastname").value;
sessionStorage.setItem("name",name);
sessionStorage.setItem("lastname",lastname);
document.getElementById("para").innerHTML=sessionStorage.getItem("name")+"
"+sessionStorage.getItem("lastname");
}
</script>
</body>
I'm studying Javascript.
Todays's mission is print entered data on Chrome console.
I made some code that can type and submit button.
But I don't know how to print entered data on console.
I think 'console.log','getElementById' would be answer.
But I can't make code with those clues..
Anyone can help me please?
Thanks in advance.
<body>
<input type="text" name="mname" placeholder="Enter movie name" size="40">
<input id="active" type="submit" value="Search">
<script>
var m = document.getElementById('mname');
console.log(m);
</script>
</body>
<body>
<input type="text" id="mname" placeholder="Enter movie name" size="40">
<input id="active" type="submit" onClick="consoleData()" value="Search">
</body>
<script>
function consoleData () {
var m = document.getElementById('mname');
console.log(m.value);
}
</script>
You can try the basic HTML tutorials for this, please follow below which is one of them.
function print() {
var m = document.getElementById('mname').value;
console.log(m);
}
<body>
<input type="text" id="mname" placeholder="Enter movie name" size="40">
<input onclick="print()" type="submit" value="Search">
</body>
I believe this source may be useful to improve your knowledge https://www.w3schools.com/js/
You should add an event trigger for the console.log().
Like this:
<body>
<input type="text" name="mname" id="mname" placeholder="Enter movie name" size="40">
<input id="active" type="submit" value="Search" onclick="log()">
<script>
function log(){
var m = document.getElementById('mname');
console.log(m.value);
}
</script>
</body>
I think 'console.log','getElementById' would be answer.
Yes, you can use these two methods to achieve your task. Here is a snippet with some points to consider:
Change name attribute to id attribute on input as getElementById requires it
Use .value to get the input's text
Add onclick attribute to link input to the log function
function log() {
var m = document.getElementById('mname').value;
console.log(m);
}
<input type="text" id="mname" placeholder="Enter movie name" size="40" value="Superman" />
<input id="active" onclick="log()" type="submit" value="Search" />
I have a logic error and cant seem to find it. I think I am "getting" the elements by ID correctly, but it yields NAN. Any help with this is appreciated.
I am not sure what else I am doing wrong, any suggestions are welcome. I am new to DOM and not very familiar with Javascript.
var avgGrade
function calcAvg()
{
avgGrade = document.getElementById("finalExam") +
document.getElementById("homework") + document.getElementById("projects");
alert("Your average is " + avgGrade);
document.getElementById("stuAverage").value = avgGrade;
}
//-->
</script>
</head>
<body>
<h1>Calculate average</h1>
<h3>Enter the following information and then press the <b>AVERAGE</b> button
to calculate
your grade.</h3>
<p>To clear the data fields, click here <b>Refresh this page</b></p>
<form action="#" name="gradeInfo" id="gradeInfo">
<p>
Enter Final Exam Grade:
<input type="text" name="finalExam" id="finalExam" size="4" /><br />
Enter Homework Grade:
<input type="text" name="homework" id="homework" size="4" /><br />
Enter Projects Grade:
<input type="text" name="projects" id="projects" size="4" /><br />
<br /><br />
<input type="button" value="AVERAGE" onclick="calcAvg()" />
<br /><br />
Your Average is:
<input type="text" name="stuAverage" id="stuAverage" size="4" /><br />
</p>
</form>
</body>
</html>
First missing a ; at the end of var avgGrade
Second you need to get values of the inputs not the inputs itself.
document.getElementById("homework").value
Third you need to convert the values from string to integer using parseInt
avgGrade = parseInt(document.getElementById("finalExam").value) +
parseInt(document.getElementById("homework").value) +
parseInt(document.getElementById("projects").value);
jsfiddle DEMO
P.s. you gotta divide it to the number of grades to get the average.
to get the value in the input field you need to write -
document.getElementById("finalExam").value
I am trying to create a simple calculator that takes a number from 1 text box and after hitting a submit button it takes the number and multiplies it by 92 then puts it in a read only box.
This is what I have so far:
<form name="1star">
<input type="text" name="input"/>
<input type="button" value="Enter" OnClick="1star.output.value == 1star.input.value * 92"/>
<br/>
<input type="text" name="output" readonly="readonly" />
</form>
This is not working and I could use some help. I know its easy but I am very new to js and I'm not understanding why this isn't working.
<form name="onestar">
<input type="text" name="input"/>
<input type="button" value="Enter" OnClick="onestar.output.value = onestar.input.value * 92"/>
<br/>
<input type="text" name="output" readonly="readonly" />
</form>
An identifier cannot start with a digit in JavaScript, so 1star is an error. Also, you wanted = (assignment), not == (comparison).
That said, there are a number of outdated or beginner practices above. If I was writing it, I would separate the script from the markup, and I'd use document.getElementById to fetch the element rather than relying on implicit variables defined by name. I would also explicitly parse the string into a number. But for now no need to worry about it too much. Even though the code seems much more complicated at first glance, it's all things that will make your life easier later, with bigger programs.
var input = document.getElementById('input');
var output = document.getElementById('output');
var button = document.getElementById('button');
button.addEventListener('click', function(evt) {
var value = parseInt(input.value, 10);
if (!isNaN(value)) {
output.value = value * 92;
}
});
<form>
<input type="text" id="input"/>
<input type="button" id="button" value="Enter"/>
<br/>
<input type="text" id="output" readonly="readonly" />
</form>