A html text area is binded to a popup screen.
Texts dont remain in the area after the popup is re-opened. Save button saves the content of textarea to a variable:
let textAreaContent=""; //in the beginning of script page.
function handleClick(){
textAreaContent = document.getElementById("textarea").value;
console.log(textAreaContent)
return null;
}
I can see the changed value of textarea content in console when i click on save button. I tried to assing textAreaContent variable to HTML textarea but it didnt work. Popup page:
<textarea id="textarea" rows="4" cols="40" style="border 1px solid black">${textAreaContent}</textarea>
<button onClick={handleClick()}>Save</button>
Why the content of textarea does not change? What am i doing wrong?
First you made a typo in with the style attribute, Here is the correct syntax.
style="border: 1px solid black;"
For the onClick handler try the following instead :
<button onClick="handleClick()">Save</button>
If you want the information to persist you can use a global variable or session storage.
function handleClick() {
var textAreaContent = document.getElementById("textarea").value;
sessionStorage.setItem("textAreaContent", textAreaContent);
return null;
}
You can then get the information later with the sessionStorage.getItem method later and add the value back
// whenever popup opens,
document.getElementById("textarea").value = sessionStorage.getItem('textAreaContent')