divの内容がデータベースに挿入されていません

Question

contenteditableというdivを使用して、ユーザーがその中のテキストを編集できるようにしました。

フォームが送信されるときに、Javascriptを使用して非表示の入力フィールドの値をdivのコンテンツとして設定し、それをデータベースに挿入します。

私の問題は、divのコンテンツがデータベースに入力されていないことです。

<?php 
if(isset($_POST['submit'])) { 
echo' 
<script> 
    document.getElementById("hiddenTextarea").value = 
    document.getElementById("post").innerHTML; 
    return true; 
</script> 
'; 

$post = $_POST['hiddenTextarea']; 
$stmt = $con->prepare("INSERT INTO posts (post) VALUES (:post)"); 
$stmt->bindParam(':post', $post); 
$stmt->execute(); 
} 
?> 

<form method="post"> 
<div id="post" contenteditable></div> 
<input type="hidden" id="hiddenTextarea" name="hiddenTextarea"> 
<input type="submit" name="submit"> 
</form> 

は、問題はおそらくクエリはJavascriptコードの前に実行されていることを#hiddenTextareaの値を変更しましたか？次のコードから

Answer 1

は、私には、JavaScriptのonkeyupイベントを使用して解決策を考え出すことができましたタイプはcontenteditable divで、自動的に非表示の入力フィールドに入力され、変数を使用して定義してデータベースに入力することができます。

Answer 2

用途：

<?php 
if(isset($_POST['submit'])) { 
$post = $_POST['hiddenTextarea']; 
$stmt = $con->prepare("INSERT INTO posts (post) VALUES (:post)"); 
$stmt->bindParam(':post', $post); 
$stmt->execute(); 
} 
?> 

<form method="post"> 
<div id="post" contenteditable></div> 
<input type="text" name="hiddenTextarea" id="hiddenTextarea"> 
<input type="submit" name="submit"> 
</form> 

<script> 
var contentText = document.getElementById('post'); 
var hiddenInput = document.getElementById('hiddenTextarea'); 
contentText.onkeyup = function() { 
    hiddenInput.value = this.innerHTML; 
}; 
</script> 

ユーザーを：別のフォーラムや、様々なユーザからの様々な提案をした後

<?php 
if(isset($_POST['submit'])) { 
    $post = $_POST['post']; 
    $stmt = $con->prepare("INSERT INTO posts (post) VALUES (:post)"); 
    $stmt->bindParam(':post', $post); 
    $stmt->execute(); 
} 
?> 

<form method="post"> 
    <textarea name="post"></textarea> 
    <input type="hidden" id="hiddenTextarea" name="hiddenTextarea"> 
    <input type="submit" name="submit" onsubmit="return copyContent()"> 
</form>