Text to Outlook body

Question

I have this button which when clicked opens outlook with the details i have provided. I also have a TEXTAREA which is holding certain texts. I'm looking for a way to have this text appear in the body of my outlook. Can this be done.? Please find code below -

     <!DOCTYPE html>
<html lang="en">
<head>
<body>
  <title>NMUK</title>
  <script type=”text/javascript” language=”javascript” src=”Mail.js”></script>




  <script src="http://code.jquery.com/jquery-1.9.1.js" type="text/javascript"></script>
  <script type="text/javascript">
    $(function () {
      $('.btnSendEmail').click(function (event) {
        var email = 'example@email.com';
        var subject = 'Creation Checklist';
        var emailBody = $('#holdtext').val();
        window.location = 'mailto:' + email + '?subject=' + subject + '&body=' + emailBody;
      });
    });
  </script>
</head>


  </head>
  <br><br><br><br><br><br>
  <div id="container">
<TEXTAREA ID="holdtext" rows="15" cols="100">
</TEXTAREA><br><br>

<button class="btnSendEmail" ><span>Send Email</span></button>
</div>

<div>



<style>#container {width:100%; text-align:center;}</style>

  <h2></h2><br><br><br>
 <p>  <SPAN ID="Fetch"> Fetch next</p> <br>      

 <button class="button2" button onclick="FetchFunction()"><span>Next  </span></button>


  <p>  <SPAN ID="GroupCompanies"> In AD goto Group</p>       

 <button class="button1" button onclick="GroupCompaniesFunction()"><span>Next  </span></button>



 <script>
function FetchFunction() {    
holdtext.innerText = Fetch.innerText;
}

function GroupCompaniesFunction() {    
holdtext.innerText += "\n"+GroupCompanies.innerText;
}
</script>




</body>


</html>

Grizzly · Accepted Answer · 2016-10-13T18:02:13.013

1

Try changing this line:

var emailBody = 'Body';

To:

var emailBody = $('#holdtext').val();

Because textarea is a form element.. val() is the proper way to retrieve the text inside of it.

Let me know if this helps!

UPDATE

To preserve the line breaks.. change this line:

window.location = 'mailto:' + email + '?subject=' + subject + '&body=' + emailBody;

To:

window.location = 'mailto:' + email + '?subject=' + subject + '&body=' + encodeURIComponent(emailBody);

edited Oct 13 '16 at 18:02

answered Oct 13 '16 at 15:29

Grizzly

5,873
8
56
109

I dont know if i can ask question here again. This code copies the content to outlook body. But after i added few more lines in my TEXTAREA, in outlook all my texts appear in one single line. Is there any way to separate it to different lines. – Pete Oct 13 '16 at 17:02
like [this](http://stackoverflow.com/questions/24120797/copy-a-textarea-value-into-a-div-keeping-line-breaks-and-html-as-text/24121114)? – Grizzly Oct 13 '16 at 17:08
Thanks BviLLe_Kid. But my texts appear in different lines in the TEXTAREA. But the same texts appear in one single line in outlook. I want it to appear in the same way its displayed in the TEXTAREA. Thank you so much for coming back and helping me again on this – Pete Oct 13 '16 at 17:17
@user2515101 is it only you who will be entering things into this text-area? Or will users be interacting with it? – Grizzly Oct 13 '16 at 17:30
Its only me who enters the texts.. And the update works exactly like how i wanted. Thank you so very much. – Pete Oct 13 '16 at 18:11
@user2515101 glad i was able to help :) – Grizzly Oct 13 '16 at 18:11

score 0 · Answer 2 · answered Oct 13 '16 at 15:25

Here is an example that I have used with the textarea tag and javascript:

<div class="contact-form">
<br>
<div class="alert alert-success hidden" id="contactSuccess">
  <strong>Success!</strong> Your message has been sent to us.
 </div>
 <div class="alert alert-error hidden" id="contactError">
   <strong>Error!</strong> There was an error sending your message.
 </div>
 <form name="sentMessage" id="contactForm" novalidate>
   <div class="form-group">
      <input type="text" class="form-control" placeholder="Full Name" id="RecipientName" 
        required name="RecipientName" 
        data-validation-required-message="Please enter your name" />
   </div>
   <div class="form-group">
     <input type="email" class="form-control" placeholder="Email"
       id="RecipientEmail" name="RecipientEmail" required
       data-validation-required-message="Please enter your email" />
   </div>
   <div class="form-group">
     <textarea rows="10" cols="100" class="form-control"
       placeholder="Please enter your message" id="RecipientMessage" name="RecipientMessage" 
       required data-validation-required-message="Please enter your message" minlength="5" 
       data-validation-minlength-message="Min 5 characters" maxlength="999" 
       style="resize:none">
     </textarea>
   </div>
    <input class="btn btn-primary pull-right" type="submit" id="EmailSendButton" 
        name="EmailSendButton" value="send message" onclick="EmailData()">
   </form><br /><br />
   <div id="EmailConfirmation"></div>
  </div>



<script>
function EmailData() {
    $("#EmailSendButton").attr("disabled", "true");

    var url = "/Home/EmailData";
    var recipientName = $("#RecipientName").val();
    var recipientEmail = $("#RecipientEmail").val();
    var recipientMessage = $("#RecipientMessage").val();
    var postData = { 'Name': recipientName, 'Email': recipientEmail, 'Message': recipientMessage }
    $.post(url, postData, function (result) {
        $("#EmailConfirmation").css({ 'display': 'block' });
        $("#EmailConfirmation").text(result);
        $("#EmailConfirmation").attr({ class: 'alert alert-success' })
        $("#RecipientName").val('Your Name *');
        $("#RecipientEmail").val('Your E-mail *');
        $("#RecipientMessage").val('Your Message *');
    })
}</script>

Thanks a Lot to that person who posted the code : var emailBody = $('#holdtext').val(); This actually worked like charm.. I came back to say thanks and that answer was deleted.. I did not notice that persons name — Pete, Oct 13 '16 at 15:34
@user2515101 that person was me lol it was just a comment so I deleted it and posted it as an answer — Grizzly, Oct 13 '16 at 15:37
I guessed it coz i remembered your profile pic :).. Thank you so much — Pete, Oct 13 '16 at 15:46

Text to Outlook body

2 Answers2

Linked