AndreGTH
AndreGTH

Reputation: 31

How to get input text from text edit

I have simple text editor, where user can use bold/italic etc format for input. This is simply generating text in div container of id="sampleeditor", so if user want bold it`s just adding html tag , italic so the generated dom code for BOLD ENTER ITALIC will looks like:

<div class="editor" id="sampleeditor" contenteditable="true">
<b>BOLD</b>
<div><b>
<i>ITALIC</i>
</b>
</div>
</div>

The thing is that i want to fetch whole user input data which are stored in the main div and save it to json file, but when i try to get that div value:

var x = document.getElementById("sampleeditor").value;
    console.log(x);

It`s just loging - undefined, so how to target whatever is inside that div?

Upvotes: 0

Views: 1116

Answers (3)

David &#214;zt&#252;rk
David &#214;zt&#252;rk

Reputation: 3634

let x = document.querySelector(".editor");
console.log(x.textContent);
<div class="editor" id="sampleeditor" contenteditable="true">
  <b>BOLD</b>
    <div>
    <b>
      <i>ITALIC</i>
    </b>
  </div>
</div>

Upvotes: 0

Ahmed Alhameli
Ahmed Alhameli

Reputation: 63

this is my solution

var x = document.getElementById("sampleeditor").innerText;
console.log(x);

Upvotes: 0

Musa
Musa

Reputation: 97672

Divs do not have value properties, you have to use inner html

var x = document.getElementById("sampleeditor").innerHTML;
console.log(x);

Upvotes: 1

Related Questions