We Keep Coding

How to create divisions in Javascript that are mathematically correct and acceptable [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 2 years ago.
Improve this question
The code does not create allways mathematically correct divisions, for exp. it creats divisions like 2/0 etc. and it also does not accept for "1/3" rounded answers like "0.33" or "0.33333". What do I need to change in the code?
Thanks for your help and time.
document.getElementById("button1").addEventListener("click", question);
var mulDiv = document.getElementById("mulDiv");
function question()
{
var startButton = document.getElementById("button1");
var number1 = document.getElementById("number1");
var number2 = document.getElementById("number2");
var decider = Math.random();
button1.textContent = "New Question";
number1.textContent = Math.floor(Math.random()*5);
number2.textContent = Math.floor(Math.random()*5);
mulDiv.textContent = "/"
};
document.getElementById("button2").addEventListener("click", answer);
function answer()
{
var num1 = parseInt(document.getElementById("number1").textContent, 10);
var num2 = parseInt(document.getElementById("number2").textContent, 10);
var answer = parseInt(document.getElementById("userAnswer").value, 10);
var feedBack = document.getElementById("feedBack");
if (mulDiv.textContent == "/"){
if(answer == num1 / num2) {
feedBack.textContent = "right";
} else {
feedBack.textContent = "wrong";
}
}
};
<button id = "button1">
Start
</button>
<p>
<label id = "number1"> </label>
<label id = "mulDiv"> </label>
<label id = "number2"> </label>
= <input id = "userAnswer" type=text>
<button id = "button2">Answer</button>
</p>
<p id = "feedBack"> </p>

This line of code:
number2.textContent = Math.floor(Math.random()*5);
generates random numbers from 0 to 4, because Math.random() returns a number from 0 to 1(not including 1). You should do:
number2.textContent = 1 + Math.floor(Math.random()*4);
That way the minimum will be 1 and the maximum will be 5.

Weather app Javascript isn't working [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 years ago.
Improve this question
I ve got nothing in console. It should change contain of html to the information taken from openweatherapp for this zip code(i check this zip and it exists and function updateByZip creates good link). First code is JS and second HTML.
JS
var temp;
var loc;
var humidity;
var icon;
function bg() {
var backs = ["http://wallpapercave.com/wp/JthAGYd.jpg", "http://www.desktopwallpaperhd.net/wallpapers/20/b/welshdragon-landscapes-cometh-background-204971.jpg", "http://s1.picswalls.com/wallpapers/2014/08/08/scottish-landscape-desktop-backgrounds_015751372_152.jpg", "http://img.wallpaperfolder.com/f/4313075B95B2/amazing-winter-backgrounds-6770538-landscape.jpg"];
var ran = Math.floor(Math.random() * (backs.length));
$('body').css("background-image", "url('" + backs[ran] + "')")
//document.body.style.background = "url/'('" + backs[0] + "') no-repeat";
}
function tempCF() {
var x = document.getElementById("temp").innerHTML;
var y = document.getElementById("CF").innerHTML;
x = parseInt(x);
if (y == "C") {
x = Math.floor((9 / 5 * x + 32));
document.getElementById("temp").innerHTML = x;
document.getElementById("CF").innerHTML = "F"
} else if (y == "F") {
x = Math.floor((x - 32) * 5 / 9);
document.getElementById("temp").innerHTML = x;
document.getElementById("CF").innerHTML = "C";
};
}
function updateByZip(zip) {
var APPID = "55e568aa04114cdf3dc4b90c9ae0a60c";
var url = "api.openweathermap.org/data/2.5/weather?zip=" + zip + "&APPID=" + APPID;
sendRequest(url);
}
function sendRequest(url) {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
var data = JSON.parse(xmlhttp.responseText);
var weather = {};
weather.temp = data.main.temp;
weather.humidity = data.main.pressure;
weather.loc = data.name;
//weather.icon = data.weather[0].id;
update(weather);
}
};
xmlhttp.open("GET", url, true);
xmlhttp.send();
}
function update(weather) {
document.getElementById("temp").innerHTML = weather.temp;
document.getElementById("humidity").innerHTML = weather.humidity;
document.getElementById("loc").innerHTML = weather.loc;
//document.getElementById("icon").innerHTML = weather.icon;
};
window.onload = function() {
var temp = document.getElementById("temp").innerHTML;
var loc = document.getElementById("loc").innerHTML;
var humidity = document.getElementById("humidity").innerHTML;
//var icon = document.getElementById("icon").innerHTML;
updateByZip(94040);
//weather.icon = "https://cdn1.iconfinder.com/data/icons/hawcons/32/700175-icon-1-cloud-128.png";
};
HTML
<head>
<link href="https://fonts.googleapis.com/css?family=Poiret+One" rel="stylesheet">
</head>
<body onclick="bg()">
<div class="container-fluid">
<div class="wrapper">
<div class="row">
<div class="title"><span id="loc"> Your location</span></div>
</div>
<div class="row">
<div class="col-ms-4">
<div class="fircol"><span id="temp">0</span>°<span onclick="tempCF()" id="CF">C</span></div>
</div>
<div class="col-ms-4">
<div class="seccol"><span id="humidity">Rain</span></div>
</div>
<div class="col-ms-4">
<div class="thicol"><span class="icon"><img src= https://cdn1.iconfinder.com/data/icons/hawcons/32/700175-icon-1-cloud-128.png></img></span></div>
</div>
</div>
</div>
</div>
</body>

Your API url is not correct.
You should write:
var url = "http://api.openweathermap.org/data/2.5/weather?zip=" + zip + "&APPID=" + APPID;

Add two numbers and display result in textbox with Javascript [closed]

Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 5 months ago.
Improve this question
I was just trying to write a simple javascript program that will demonstrate to take user input from text field, and clicking the button will display the summation result of those number in another text field. But unfortunately the below code is not working. Clicking the button does not show anything in the result text field.
<body>
<div>
<div>
<h1>Add two number using text box as input using javascript</h1>
</div>
Enter First Number : <br>
<input type="text" id="Text1" name="TextBox1">
<br>
Enter Second Number : <br>
<input type="text" id="Text2" name="TextBox2">
<br>
Result : <br>
<input type="text" id="txtresult" name="TextBox3">
<br>
<input type="button" name="clickbtn" value="Display Result" onclick="add_number()">
<script type="text/javascript">
function add_number(){
var first_number = parseInt(document.getElementsById("Text1").value);
var second_number = parseInt(document.getElementsById("Text2").value);
var result = first_number + second_number;
document.getElementById("txtresult").innerHTML = result;
}
</script>

Here a working fiddle: http://jsfiddle.net/sjh36otu/
function add_number() {
var first_number = parseInt(document.getElementById("Text1").value);
var second_number = parseInt(document.getElementById("Text2").value);
var result = first_number + second_number;
document.getElementById("txtresult").value = result;
}

When you assign your variables "first_number" and "second_number", you need to change "document.getElementsById" to the singular "document.getElementById".

var first_number = parseInt(document.getElementById("Text1").value);
var second_number = parseInt(document.getElementById("Text2").value);
// This is because your method .getElementById has the letter 's': .getElement**s**ById

<script>
function sum()
{
var value1= parseInt(document.getElementById("txtfirst").value);
var value2=parseInt(document.getElementById("txtsecond").value);
var sum=value1+value2;
document.getElementById("result").value=sum;
}
</script>

You made a simple mistake. Don't worry....
Simply use getElementById instead getElementsById
true
var first_number = parseInt(document.getElementById("Text1").value);
False
var first_number = parseInt(document.getElementsById("Text1").value);
Thanks ...

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.minus = function() {
var a = Number($scope.a || 0);
var b = Number($scope.b || 0);
$scope.sum1 = a-b;
// $scope.sum = $scope.sum1+1;
alert($scope.sum1);
}
$scope.add = function() {
var c = Number($scope.c || 0);
var d = Number($scope.d || 0);
$scope.sum2 = c+d;
alert($scope.sum2);
}
});
<head>
<script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.min.js"></script>
</head>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<h3>Using Double Negation</h3>
<p>First Number:
<input type="text" ng-model="a" />
</p>
<p>Second Number:
<input type="text" ng-model="b" />
</p>
<button id="minus" ng-click="minus()">Minus</button>
<!-- <p>Sum: {{ a - b }}</p> -->
<p>Sum: {{ sum1 }}</p>
<p>First Number:
<input type="number" ng-model="c" />
</p>
<p>Second Number:
<input type="number" ng-model="d" />
</p>
<button id="minus" ng-click="add()">Add</button>
<p>Sum: {{ sum2 }}</p>
</div>

<script>
function myFunction() {
var y = parseInt(document.getElementById("txt1").value);
var z = parseInt(document.getElementById("txt2").value);
var x = y + z;
document.getElementById("result").innerHTML = x;
}
</script>
<p>
<label>Enter First Number : </label><br>
<input type="number" id="txt1" name="text1"><br/>
<label>Enter Second Number : </label><br>
<input type="number" id="txt2" name="text2">
</p>
<p>
<button onclick="myFunction()">Calculate</button>
</p>
<br/>
<p id="result"></p>

It should be document.getElementById("txtresult").value= result;
You are setting the value of the textbox to the result. The id="txtresult" is not an HTML element.

<script>
var text1 = document.getElementById("Text1").value;
var text2 = document.getElementById("Text2").value;
var answer = parseInt(text1) + parseInt(text2);
function add_number(){
document.getElementById("txtresult").value = answer;
}
</script>

its Not document.getElementsById function its document.getElementById try it

Instead of writing
.innerHTML = result;
use
.value = result;

<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>Calculator DEMO</title>
</head>
<body>
<div>
<p>
<label>Enter Number 1: </label><br>
<input type="number" id="txt1" name="text1"><br/>
<label>Enter Number 2: </label><br>
<input type="number" id="txt2" name="text2">
</p>
<p>
<button onclick="resultsum()">+</button>
<button onclick="resultsub()">-</button>
<button onclick="resultmul()">*</button>
</p>
<p>
<button onclick="resultdiv()">/</button>
<button onclick="resultmod()">%</button>
<button onclick="resultper()">percentage</button>
</p>
<script>
function resultsum()
{
var y = parseInt(document.getElementById("txt1").value);
var z = parseInt(document.getElementById("txt2").value);
var sm = y + z;
document.getElementById("resultsum").innerHTML = sm;
if(document.getElementById("resultsum").innerHTML%2!=0)
{
alert('"calculated Result is odd"');
}
else
{
alert('"calculated Result is not "ODD"');
}
}
function resultsub()
{
var y = parseInt(document.getElementById("txt1").value);
var z = parseInt(document.getElementById("txt2").value);
var sb = y - z;
document.getElementById("resultsub").innerHTML = sb;
{
if(document.getElementById("resultsub").innerHTML%2!=0)
{
alert('"calculated Result is odd"');
}
else
{
alert('"calculated Result is not "ODD"');
}
}
}
function resultmul()
{
var y = parseInt(document.getElementById("txt1").value);
var z = parseInt(document.getElementById("txt2").value);
var ml = y * z;
document.getElementById("resultmul").innerHTML = ml;
if(document.getElementById("resultmul").innerHTML%2!=0)
{
alert('"calculated Result is odd"');
}
else
{
alert('"calculated Result is not "ODD"');
}
}
function resultdiv()
{
var y = parseInt(document.getElementById("txt1").value);
var z = parseInt(document.getElementById("txt2").value);
var dv = y / z;
document.getElementById("resultdiv").innerHTML = dv;
if(document.getElementById("resultdiv").innerHTML%2!=0)
{
alert('"calculated Result is odd"');
}
else
{
alert('"calculated Result is not "ODD"');
}
}
function resultmod()
{
var y = parseInt(document.getElementById("txt1").value);
var z = parseInt(document.getElementById("txt2").value);
var md = y + z;
document.getElementById("resultmod").innerHTML = md;
if(document.getElementById("resultmod").innerHTML%2!=0)
{
alert('"calculated Result is odd"');
}
else
{
alert('"calculated Result is not "ODD"');
}
}
function resultper()
{
var y = parseInt(document.getElementById("txt1").value);
var z = parseInt(document.getElementById("txt2").value);
var per = (y + z )/2;
document.getElementById("resultper").innerHTML = per;
if(document.getElementById("resultper").innerHTML%2!=0)
{
alert('"calculated Result is odd"');
}
else
{
alert('"calculated Result is not "ODD"');
}
}
</script>
<input type="text" name="Answers" id="ans" >
<br/>
<p id="resultsum"></p>
<p id="resultsub"></p>
<p id="resultmul"></p>
<p id="resultdiv"></p>
<p id="resultmod"></p>
<p id="resultper"></p>
</div>
</body>
</html>

You can simply convert the given number using Number primitive type in JavaScript as shown below.
var c = Number(first) + Number(second);

Remove all items button [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
In this JavaScript code is something like you can delete the items by id and it is too long proces I want something shorter. So I wanna delete all items by pressing one button. I tried to edit it but I always fail.
JavaScript code :
var currentFormVisibilityStatus = false;
function SaveNotes() {
var category = document.getElementById("slSearchCategory").value;
var todo = document.getElementById("txtToDo").value;
if (category == "") {
alert("Please select Category.");
return;
}
var storage = JSON.parse(localStorage.getItem('ToDoList'));
var arrayLength = storage.length;
storage[arrayLength] = category;
storage[arrayLength + 1] = todo;
localStorage.setItem('ToDoList', JSON.stringify(storage));
category = "";
loadNotes();
clearNote();
}
function clearNote() {
var todo = document.getElementById("txtToDo");
todo.value = '';
}
function loadNotes() {
var storage = JSON.parse(localStorage.getItem('ToDoList'));
if (!storage) {
storage = [];
localStorage.setItem('ToDoList', JSON.stringify(storage));
}
var displayArea = document.getElementById("displayArea");
var currentFilter = document.getElementById("slSearchCategory").value;
var innerDiv = "";
for (var i = storage.length - 1; i >= 0; i = i - 2) {
if (currentFilter == storage[i - 1] || currentFilter == "") {
var todoColor = 'ffffff';
switch (storage[i - 1]) {
case 'Sales':
todoColor = 'ffffff';
break;
default:
todoColor = 'ffffff';
break;
}
innerDiv += "<div class='displayToDo' style='background:#" + todoColor + "'><input type='image' src='delete.png' width='15px' height='15px' onclick='removeMe(" + i + ")' /> " + storage[i] + "</div>"+ "</br>";
}
}
if (innerDiv != undefined) {
displayArea.innerHTML = innerDiv;
}
else {
displayArea.innerHTML = "";
}
}
function removeMe(itemId) {
var storage = JSON.parse(localStorage.getItem('ToDoList'));
storage.splice(itemId - 1, 2);
localStorage.setItem('ToDoList', JSON.stringify(storage));
loadNotes();
}
onload = function () {
loadNotes();
ShowHideForm();
}
Html code :
<div class="headerDiv">
<span>Category :</span>
<select id="slSearchCategory" class="textBox" onchange="loadNotes()" style="width: 100px">
<option value="" selected="selected">All ToDo</option>
<option value="Personal">Personal</option>
<option value="HR">HR Query</option>
<option value="Payroll">Payroll</option>
<option id="Sales" value="Sales">Sales</option>
</select>
<span style="padding-left: 20px">Todo : </span>
<textarea id="txtToDo" class="textBox" rows="2" cols="20" style="width: 300px"></textarea>
<input type="button" onclick="SaveNotes()" name="Submit" class="submitButton" title="Submit"
value="Add Todo" />
</div>
<div id="displayArea">
</div>
<input type="button" onclick="removeAll();" value="Remove all"/>

you can create a new function and call it with an onclick event
the HTML code
<input type="button" value="Remove all" onclick="removeAll();"/>
the JavaScript function
function removeAll(){
var storage = JSON.parse(localStorage.getItem('ToDoList'));
storage.length=0;
localStorage.setItem('ToDoList', JSON.stringify(storage));
loadNotes();
}
also take a look at How do I empty an array in JavaScript? so you know how to empty an array the right way

Javascript onkeydown function runs and then display goes away

first time on the website, anyway my problem is that when I use onkeydown and then use GetChar to check if the enter key was pressed, when operAtion runs,the results of the function only shows on the screen for about a second and then goes away, if the user uses the onclick (clicks the enter button), then this problem doesnt occur. How do I get the result of operAtion to stay on the screen when onkeydown is used. The website is sqrtcalc.comze.com if you want to see what I mean
sqrtcalc
<!DOCTYPE html>
<html>
<head>
<title>Square Root Calculator</title>
<script language="javascript">
function operAtion (form){
var x = form.inputbox.value;
if (isNaN(x)){
//document.write("lawl");
var y = "Enter a number";
document.getElementById("failsafe").innerHTML = y;
document.getElementById("demo").innerHTML = "";
} else if (x < 0){
var y = "Number must be positive";
document.getElementById("failsafe").innerHTML = y;
document.getElementById("demo").innerHTML = "";
} else if (x == ""){
var y = "uhm, you didnt enter anything";
document.getElementById("failsafe").innerHTML = y;
document.getElementById("demo").innerHTML = "";
} else {
var y = Math.pow(x, 1/2)
document.getElementById("demo").innerHTML = "The square root of " + x + " is " + y;
document.getElementById("failsafe").innerHTML = "";
}
}
function GetChar (event,form){
var keyCode = event.keyCode;
if (keyCode == 13){
operAtion(form);
}
}
</script>
<p></p>
</head>
<body>
<form name="myform" action="" method="get" style = "font-size:50px"><strong>Square Root Calculator</strong></br>
</br>
<input type="text" name="inputbox" value = "" onkeydown = "GetChar(event,this.form);"> </br>
</br>
<input id="button" type="button" name="button" value=" Enter " onclick="operAtion(this.form)" >
</form>
<h1 id = "failsafe"></h1>
</br>
</br>
</br>
<h1 id = "demo"></h1>
</br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br></br>
<img border="0" src="http://counter.rapidcounter.com/counter/1353157574/a"; ALIGN="middle" HSPACE="4" VSPACE="2" style = "padding-left:1400px;">
</body>
</html>

Add this code:
window.onload = function(){
document.getElementById("myform").onsubmit = function(){
return false;
}
}
And add the id attribute id="myform" to the <form> tag.

I refactored your code a little:
I removed your inline functions (inline JS isn't exactly best
practice)
I added an ID to your form so it could be referenced
I added return false; to keep the form from submitting
onsubmit handles both click and enter
Javascript
document.getElementById('myform').onsubmit = function() {
var x = this.inputbox.value;
if (isNaN(x)) {
//document.write("lawl");
var y = "Enter a number";
document.getElementById("failsafe").innerHTML = y;
document.getElementById("demo").innerHTML = "";
} else if (x < 0) {
var y = "Number must be positive";
document.getElementById("failsafe").innerHTML = y;
document.getElementById("demo").innerHTML = "";
} else if (x == "") {
var y = "uhm, you didnt enter anything";
document.getElementById("failsafe").innerHTML = y;
document.getElementById("demo").innerHTML = "";
} else {
var y = Math.pow(x, 1 / 2)
document.getElementById("demo").innerHTML = "The square root of " + x + " is " + y;
document.getElementById("failsafe").innerHTML = "";
}
return false;
}​
HTML
<form name="myform" action="" method="get" style="font-size:50px" id="myform"><strong>Square Root Calculator</strong><br>
<br>
<input type="text" name="inputbox"> <br>
<br>
<input id="button" type="submit" name="button" value=" Enter ">
</form>
<h1 id="failsafe"></h1>
<h1 id="demo"></h1>
Working demo​