jQuery/Javascriptを使用して電子メールフォームでcontenteditableを使用する

Question

私はスタック上の他の場所からいくつかのスクリプトを取って、ユーザが投稿したときに私に電子メールを送る連絡フォームを作成しました。

HTML：

<form onsubmit="return getContent()"> 
    <fieldset> 
     <input name="name" value="NAME" style="max-width:15%" type="text"/> 
     <input name="email" value="EMAIL" style="max-width: 30%" type="text"/> 
     <div id="message" contenteditable="true" name="message" value="expanding textarea">HELLO</div> 
     <textarea id="my-textarea" value="MESSAGE" style="display:none"></textarea> 
     <input type="submit" style="margin-right:0" value="Submit" /> 
    </fieldset> 
</form> 

SCRIPTS：

function getContent(){ 
     document.getElementById("my-textarea").value = document.getElementById("message").innerHTML; 
    } 

    $('form').submit(function() { 
    $.ajax({ 
     type: "POST", 
     url: "email.php", 
     data: $(this).serialize(), 
     success: function() { 
      // Update page with success message 
     } 
    }); 
    return false; 
}); 

PHP：

<?php 

$recipient = "my.email@whatever.com"; //recipient 

$Name = ($_POST['name']); //senders name 
$email = ($_POST['email']); //senders e-mail adress 
$mail_body = ($_POST['message']); //mail body 

$header = "From: ". $Name . " <" . $email . ">\r\n"; //optional headerfields 

mail($recipient, $subject, $mail_body, $header); //mail command :) 
?> 

スクリプトが取得する必要contenteditable divに入力されたコンテンツを非表示のテキストエリアに渡してから、メールに送信します。ただし、現時点では"name"とのフィールドを通過し、メールの本文は空白のままです。

私はここで何が欠けていますか？

EDIT：上記のコード非表示のテキストエリアで小さなエラーが発生しました。値= "MESSAGE"ではなく "SUBJECT"です。それでもコードは機能しません。

Answer 1

contenteditableコンテンツは、送信時にフォームを通過しません。 しかし、編集可能なコンテンツdivのコンテンツを取得し、それを "subject"という名前のテキストエリアに入れるためにJSを使用しているようです。

したがって、$_POST['subject']によってのみアクセスできます。

また、HTMLファイルではonsubmit = ""を、JSファイルでは "on"を実行しています。私は両方がうまくいくとは思わない、あなたは2つを組み合わせるほうがいいだろう（つまりJSファイルを使う）。

JSを有効にしないとうまくいきませんが、これはもっと大きな問題です。