ButterBall
ButterBall

Reputation: 1

Javascript event listener behavior

I added a listener to an unordered list to perform a function when a text area element within the ul was changed. When the text area is changed, I wanted to get the value of the now changed text area, and save it. When I try to save the value in newNotes, I am given back the INITIAL value of the text area, not the value after the text area has been changed. Isn't that the whole point of the listener, to be triggered upon a change?

ul.addEventListener('change',(e)=> { 
if(e.target.tagName === "TEXTAREA") { // if the ul was changed and a textarea was targeted
    const li = e.target.parentNode; // the parent list item of the text area
    const liName = li.firstChild.textContent; // this is a string
    var newNotes = e.target.textContent; // PROBLEM : RETURNS WRONG VALUE
    console.log(newNotes);
    updateNotesTo(liName, newNotes); // regarding localStorage         

}              
});

Upvotes: 0

Views: 56

Answers (2)

Arber
Arber

Reputation: 541

You have to use the .value attribute.

var newNotes = e.target.value;

See also, Textarea.textcontent is not changing

Upvotes: 0

charlietfl
charlietfl

Reputation: 171679

You want the value from textarea

Change

var newNotes = e.target.textContent; 

To

var newNotes = e.target.value; 

Upvotes: 1

Related Questions