Stack Overflow Asked by Michael August on December 18, 2021
I’m trying to get the task in my input, but its giving nothing when i console.log. this is the code.
const form = document.querySelector('#add-form');
const taskInput = document.querySelector('#task').value;
const addTask = document.querySelector('#add-task');
const list = document.querySelector('#list');
form.addEventListener('submit', (e) => {
const li = document.createElement('li');
li.innerHTML = taskInput;
li.append(taskInput);
list.appendChild(li);
console.log(taskInput);
e.preventDefault();
})
That way you are taking the value of the input before the user types something, do this:
const form = document.querySelector('#add-form');
const taskInput = document.querySelector('#task'); // remove the .value here
const addTask = document.querySelector('#add-task');
const list = document.querySelector('#list');
form.addEventListener('submit', (e) => {
const li = document.createElement('li');
li.innerHTML = taskInput.value; // and put here
li.append(taskInput);
list.appendChild(li);
console.log(taskInput.value); // and here
e.preventDefault();
})
Answered by iKaio on December 18, 2021
You are querying for the value at initialization of the script. Try retrieving the value on submit e.g.
const form = document.querySelector('#add-form');
const addTask = document.querySelector('#add-task');
const list = document.querySelector('#list');
form.addEventListener('submit', (e) => {
const li = document.createElement('li');
var taskInput = document.querySelector('#task').value;
li.innerHTML = taskInput;
li.append(taskInput);
list.appendChild(li);
console.log(taskInput);
e.preventDefault();
})
Answered by N. Brittain on December 18, 2021
Get help from others!
Recent Answers
Recent Questions
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP