javascript - HTML input output -

user enters name here part of form.

  <p>name <font color="red">(required) </font> <input name="flname" required="required" placeholder="your name" </p> 

this solution provides way of providing sample text can edited, , php can run inside it, unlike <textarea>. however, problem unlike <textarea>, cannot seem <div contenteditable... submit information email php file have set on server. have idea how i'd implement this.

  <div contenteditable="true" name="message" required="" placeholder="your message" >dear <?php echo "$mptitle $mpsecondname" ?>, <p> please support us... </p>  <p> kind regards, </p>  <script type="text/javascript"> document.write(document.getelementbyid('flname').id);</script>  </div>  <div align="center"> 

# update 2: hi,

thank both quick resposnes.

i tried implement solution here:

    <div align="left">      <form action="form.php" method="post" enctype="multipart/form-data">      <p>name <font color="red">(required) </font> <input name="flname"       required="required" placeholder="your name" </p>     <p>email <font color="red">(required) </font> <input name="emailfrom" type="email" required="required" placeholder="your email">  </p>     <p>address <font color="red">(required) </font> <input name="address" type="name" required="required" placeholder="address"> </p>         <p>city <font color="red">(required) </font> <input name="city" type="name" required="required" placeholder="city"> </p>         <p>postcode <font color="red">(required) </font> <input name="postcode" type="name" required="required" placeholder="postcode"> </p>                <p>what 2+2? <font color="red">(required) </font> <input name="human" required placeholder="type here">  </p>         <p> <b> can edit text below or little wish </b> </p>           <div contenteditable="true" required="" placeholder="your              message" >dear <?php echo "$mptitle $mpsecondname" ?>, <p> please support us... </p> <p> kind regards, </p>     </div>          <input type=hidden name=usercontent id=usercontent>         <script>         var el=document.getelementbyid('userform');         el.addeventlistener('submit', function() {         var elinput=document.getelementbyid('usercontent');         var eldiv=document.getelementbyid('divcontent');         elinput.value = eldiv.innerhtml;         });         </script>       <div align="center">     <input id="cancel" name="cancel" type="submit" value="cancel" />         <input id="submit" name="submit" type="submit" value="submit"> </form> </div> </div> 

php:

  <?php     ini_set('display_errors',1);  error_reporting(e_all);     include('mplookup.php');     $name = $_post['flname'];     $email = $_post['emailfrom'];     $message = $_post['usercontent'];      $address = $_post['address'];      $city = $_post['city'];      $postcode = $_post['postcode'];     $human = $_post['human'];     $to = "";     $body = $message;     $subject = 'from: $email \r\n : sisi\'s visit uk: sent using eg4demuk\'s tool ';      ?>     <?php     if ($_post['submit']) {         if (mail ($to, $subject, $body, $email))         {             echo '<p>thank email!</p>';         } else {             echo '<p>oops! error occurred. try sending message again.</p>';         }     }     ?> 

however, emails outputed this

from: hassan ismail e-mail:  message 

thanks in advance

a <div> not form element, won't submitted. need implement event listener on submit event of form picks content of <div> , puts in form element. add hidden <input> form purpose.

here's simple example:

<div id=divcontent style="width:400px; height=200px;overflow:auto" contenteditable>some content</div> <form id=userform>     <input type=hidden name=usercontent id=usercontent>         <input type=submit name=submit value="send!"> </form>   <script>         var el=document.getelementbyid('userform'); el.addeventlistener('submit', function() {     var elinput=document.getelementbyid('usercontent');     var eldiv=document.getelementbyid('divcontent');     elinput.value = eldiv.innerhtml; });  </script> 

var el=document.getelementbyid('userform');  el.addeventlistener('submit', function() {      var elinput=document.getelementbyid('usercontent');      var eldiv=document.getelementbyid('divcontent');      elinput.value = eldiv.innerhtml;  });

<div id=divcontent style="width:400px; height=200px;overflow:auto" contenteditable>some content</div>  <form id=userform>      <input type=hidden name=usercontent id=usercontent>          <input type=submit name=submit value="send!">  </form>  <script>