How to save contenteditable input to a variable so I can print it on screen

user_19394409 0
Viewed 62

I have this code and I want to save a contenteditable text to a variable so i can print it on screen. HTML:

function saveEdits() {
    //get the editable element
    var editElem = document.getElementById("myText").value;
    document.getElementById("update").innerHTML=editElem;
    //write a confirmation to the user
  }
<h1 id="myText" contenteditable="true">Title</h1>
    <input type="button" value="save edits" onclick="saveEdits()"/>
    <p id="update"></p>

html javascript
3 Answers

I'd try using innerHTML:

function saveEdits() {
    //get the editable element
    document.getElementById("update").innerHTML = document.getElementById("myText").innerHTML;
    //write a confirmation to the user
}
user_21245290

From what I understand you want this :

function saveEdits() {
    //get the editable element
    var editElem = document.getElementById("myText").value;
    document.getElementById("update").innerHTML=editElem;
    //write a confirmation to the user
    alert("your text have been saved");
  }
<input type="text" placeholder="type content here" id="myText">
<input type="button" value="save edits" onclick="saveEdits()"/>
    <p id="update"></p>

The text is stocked in the editElem variable.

user_175604020

Just change .value to .innerHTML .

function saveEdits() {
//get the editable element
var editElem = document.getElementById("myText").innerHTML;
document.getElementById("update").innerHTML=editElem;
//write a confirmation to the user
  }
<h1 id="myText" contenteditable="true">Title</h1>
    <input type="button" value="save edits" onclick="saveEdits()"/>
    <p id="update"></p>

user_180990760
Related