PHP $_GET content in <div> - php

Question

first of all i'm new here so if I do mistakes pls let me know^^"
I try to get the content of a div element with php $_POST and I dont really know how to do it. I use MVC patter if that matters.
My div is editable and the answer box to write something on the page.
<form action="index.php?page=addPost&topic_id={TOPIC_ID}" method="post">
<div id="editor" name="editor">
Lorem Ipsum...
</div>
<input type="submit" name="submit" value="senden" >
</form>
I can't just use a textarea but I would like to get everything between the div element with something like
$text = $_POST['editor'];
is that possible?

Answer 1

You could use a hidden textarea, and add the contents of the div to the textarea on form submit:
<form action="index.php?page=addPost&topic_id={TOPIC_ID}" method="post" onsubmit="getEditorContents(this);">
<div id="editor">
Lorem Ipsum...
</div>
<textarea style="display:none;" name="editor"><!-- --></textarea>
<input type="submit" name="submit" value="senden" >
</form>
<script>
function getEditorContents(form){
var html = document.getElementById("editor").innerHTML;
form.editor.value = html;
return true;
}
</script>

Answer 2

Use ajax or just use a textarea form element
<form id="data" method="post" enctype="multipart/form-data">
<div id="editor" name="editor">
Lorem Ipsum...
</div>
<input type="submit" name="submit" value="senden" >
<input type="hidden" id="topicId" value="{TOPIC_ID}" >
</form>
<script>
$(document).ready(function(){
$("form#data").submit(function(){
var formData = new FormData($(this)[0]);
formData.append('editor', $('#editor').html());
$.ajax({
url: 'index.php?page=addPost&topic_id='+$('$topicId').val(),
type: 'POST',
data: formData,
async: false,
success: function (data) {
alert(data);
location.reload();
},
cache: false,
contentType: false,
processData: false
});
return false;
});
});
</script>

Answer 3

Here is how you can proceed with:
<script>
$(document).ready(function(){
$("#myform").on("submit",function(e){
e.preventDefault(); //Prevent default form submission
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
if (xmlhttp.responseText == "true") {
//success message
} else {
//error message
}
}
}
xmlhttp.open("POST", "index.php", true);
xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); //to maintain HTML format though you pass value through POST
xmlhttp.send("page=addPost&topic_id="+$('#topicID').val()+"value=" + $('#editor').html());
});
});
</script>
Small rework with your form:
<form id="myform" method="post">
<div id="editor" name="editor">
Lorem Ipsum... in WYSIWYG format
</div>
<input type="hidden" id="topicID" value="{TOPIC_ID}"/>
<input type="submit" name="submit" value="senden" />
</form>