Why is a declared variable shows nothing in the console? [duplicate] - javascript

I’m trying to get the value property from my <input> field so I can later use it to fetch data from a specific API URL.
The problem is that my <input> value is always empty no matter what I type in it.
I tried to use document.querySelector() and document.getElementById(); both yield the same result.
const searchBtn = document.querySelector("#searchBtn");
//const inpuValue = document.querySelector("#inputField").value;
const inputValue = (document.getElementById("inputField")).value;
const testing = () => alert(inputValue);
searchBtn.addEventListener("click", testing);
The alert just appears blank, but it doesn’t if I specify a value in the HTML field. So I guess I’m triggering the right button and <input> field. (I use alert because none of my browsers show me the console.log in the console).

The testing function handler is called every time the button is clicked.
In contrast, the inputValue variable is evaluated only once when the code is firstly executed, at initial script evaluation during page load, and never again. The input value gets stored inside the variable and it never gets updated after that. (Strings are immutable in JavaScript: once you store a string in a variable, it won’t change unless you assign that variable to another value.)
If you want to refresh the value every time you click the button, you have to query the element every time:
const testing = () => {
const inputValue = document.getElementById("inputField").value;
alert(inputValue);
}
Or you can keep just a reference to the element and query the value property every time:
const inputElement = document.getElementById("inputField");
const testing = () => alert(inputElement.value);

Related

Password matching not working using Javascript [duplicate]

I’m trying to get the value property from my <input> field so I can later use it to fetch data from a specific API URL.
The problem is that my <input> value is always empty no matter what I type in it.
I tried to use document.querySelector() and document.getElementById(); both yield the same result.
const searchBtn = document.querySelector("#searchBtn");
//const inpuValue = document.querySelector("#inputField").value;
const inputValue = (document.getElementById("inputField")).value;
const testing = () => alert(inputValue);
searchBtn.addEventListener("click", testing);
The alert just appears blank, but it doesn’t if I specify a value in the HTML field. So I guess I’m triggering the right button and <input> field. (I use alert because none of my browsers show me the console.log in the console).
The testing function handler is called every time the button is clicked.
In contrast, the inputValue variable is evaluated only once when the code is firstly executed, at initial script evaluation during page load, and never again. The input value gets stored inside the variable and it never gets updated after that. (Strings are immutable in JavaScript: once you store a string in a variable, it won’t change unless you assign that variable to another value.)
If you want to refresh the value every time you click the button, you have to query the element every time:
const testing = () => {
const inputValue = document.getElementById("inputField").value;
alert(inputValue);
}
Or you can keep just a reference to the element and query the value property every time:
const inputElement = document.getElementById("inputField");
const testing = () => alert(inputElement.value);

Jquery returns same value on changing dropdown [duplicate]

I’m trying to get the value property from my <input> field so I can later use it to fetch data from a specific API URL.
The problem is that my <input> value is always empty no matter what I type in it.
I tried to use document.querySelector() and document.getElementById(); both yield the same result.
const searchBtn = document.querySelector("#searchBtn");
//const inpuValue = document.querySelector("#inputField").value;
const inputValue = (document.getElementById("inputField")).value;
const testing = () => alert(inputValue);
searchBtn.addEventListener("click", testing);
The alert just appears blank, but it doesn’t if I specify a value in the HTML field. So I guess I’m triggering the right button and <input> field. (I use alert because none of my browsers show me the console.log in the console).
The testing function handler is called every time the button is clicked.
In contrast, the inputValue variable is evaluated only once when the code is firstly executed, at initial script evaluation during page load, and never again. The input value gets stored inside the variable and it never gets updated after that. (Strings are immutable in JavaScript: once you store a string in a variable, it won’t change unless you assign that variable to another value.)
If you want to refresh the value every time you click the button, you have to query the element every time:
const testing = () => {
const inputValue = document.getElementById("inputField").value;
alert(inputValue);
}
Or you can keep just a reference to the element and query the value property every time:
const inputElement = document.getElementById("inputField");
const testing = () => alert(inputElement.value);

why the parameter in javascript ii is NaN when i run the code below in google chorme? [duplicate]

I’m trying to get the value property from my <input> field so I can later use it to fetch data from a specific API URL.
The problem is that my <input> value is always empty no matter what I type in it.
I tried to use document.querySelector() and document.getElementById(); both yield the same result.
const searchBtn = document.querySelector("#searchBtn");
//const inpuValue = document.querySelector("#inputField").value;
const inputValue = (document.getElementById("inputField")).value;
const testing = () => alert(inputValue);
searchBtn.addEventListener("click", testing);
The alert just appears blank, but it doesn’t if I specify a value in the HTML field. So I guess I’m triggering the right button and <input> field. (I use alert because none of my browsers show me the console.log in the console).
The testing function handler is called every time the button is clicked.
In contrast, the inputValue variable is evaluated only once when the code is firstly executed, at initial script evaluation during page load, and never again. The input value gets stored inside the variable and it never gets updated after that. (Strings are immutable in JavaScript: once you store a string in a variable, it won’t change unless you assign that variable to another value.)
If you want to refresh the value every time you click the button, you have to query the element every time:
const testing = () => {
const inputValue = document.getElementById("inputField").value;
alert(inputValue);
}
Or you can keep just a reference to the element and query the value property every time:
const inputElement = document.getElementById("inputField");
const testing = () => alert(inputElement.value);

My function does not seem to be getting the value I need it to, what am I doing wrong? [duplicate]

I’m trying to get the value property from my <input> field so I can later use it to fetch data from a specific API URL.
The problem is that my <input> value is always empty no matter what I type in it.
I tried to use document.querySelector() and document.getElementById(); both yield the same result.
const searchBtn = document.querySelector("#searchBtn");
//const inpuValue = document.querySelector("#inputField").value;
const inputValue = (document.getElementById("inputField")).value;
const testing = () => alert(inputValue);
searchBtn.addEventListener("click", testing);
The alert just appears blank, but it doesn’t if I specify a value in the HTML field. So I guess I’m triggering the right button and <input> field. (I use alert because none of my browsers show me the console.log in the console).
The testing function handler is called every time the button is clicked.
In contrast, the inputValue variable is evaluated only once when the code is firstly executed, at initial script evaluation during page load, and never again. The input value gets stored inside the variable and it never gets updated after that. (Strings are immutable in JavaScript: once you store a string in a variable, it won’t change unless you assign that variable to another value.)
If you want to refresh the value every time you click the button, you have to query the element every time:
const testing = () => {
const inputValue = document.getElementById("inputField").value;
alert(inputValue);
}
Or you can keep just a reference to the element and query the value property every time:
const inputElement = document.getElementById("inputField");
const testing = () => alert(inputElement.value);

Javascript value amount does not change [duplicate]

I’m trying to get the value property from my <input> field so I can later use it to fetch data from a specific API URL.
The problem is that my <input> value is always empty no matter what I type in it.
I tried to use document.querySelector() and document.getElementById(); both yield the same result.
const searchBtn = document.querySelector("#searchBtn");
//const inpuValue = document.querySelector("#inputField").value;
const inputValue = (document.getElementById("inputField")).value;
const testing = () => alert(inputValue);
searchBtn.addEventListener("click", testing);
The alert just appears blank, but it doesn’t if I specify a value in the HTML field. So I guess I’m triggering the right button and <input> field. (I use alert because none of my browsers show me the console.log in the console).
The testing function handler is called every time the button is clicked.
In contrast, the inputValue variable is evaluated only once when the code is firstly executed, at initial script evaluation during page load, and never again. The input value gets stored inside the variable and it never gets updated after that. (Strings are immutable in JavaScript: once you store a string in a variable, it won’t change unless you assign that variable to another value.)
If you want to refresh the value every time you click the button, you have to query the element every time:
const testing = () => {
const inputValue = document.getElementById("inputField").value;
alert(inputValue);
}
Or you can keep just a reference to the element and query the value property every time:
const inputElement = document.getElementById("inputField");
const testing = () => alert(inputElement.value);

Categories