Search code examples
javascriptjquerywysiwygcontenteditable

Contenteditable div can´t be read by Jquery, variable returns as undefined

I need to pass the content from a contenteditable div into an input, in order to submit it with PHP. I found out that Jquery can´t read its content, I'd be thankful if anyone could solve my problem.

function textChange() {
  var str = $('#preblogbody').html();
  $("#blogbody").val(str);
  alert(str);
}
<form>

.....

<div id="WYSIWYG" id="preblogbody" contenteditable="true" onkeyup="textChange()" onmouseup="textChange()">	
			</div>
			<textarea class="hidden" id="blogbody"  name="blogbody"></textarea>
      
.....
      
</form>

Solution

  • You have two ID's on the same element. The second one is being ignored.

    Change 

    <div id="WYSIWYG" id="preblogbody" contenteditable="true"...

    To

    <div id="preblogbody" contenteditable="true"...

    and your code works fine as shown