Question

I have the following Javascript to copy the user’s textarea input in this iPhone app (built with HTML/CSS/Javascript for PhoneGap), open the email client, and paste it into the body. This script does all that. Unfortunately, the textarea’s line breaks are not preserved, making it a horrible reading experience. How do I preserve the textarea’s line breaks? I read through 12 questions with a similar title on Stackoverflow without seeing the same case as mine.

Form code (with Jquery):

<div data-role="content"><form name="form2" action="mailto:" type="text/html" onSubmit="send_setupSummaries(form2); return false;">

Javascript:

var setupSummaries = document.getElementById('setupSummaries');

function send_setupSummaries(form2) {
"use strict";
var eml="";
var subj= "?subject=from SC10 Setup App";
var bod = "&body="+form2.setupSummaries.value;
location.href="mailto:"+eml+subj+bod;
}

Textarea:

<li><textarea name="setupSummaries" cols="20" rows="7"></textarea>

This is what I’ve tried so far and none have worked. The commented lines are alternate ways that have failed:

var setupSummaries = document.getElementById('setupSummaries');

var str = document.getElementById('setupSummaries');
//setupSummaries = str.replace(/[\r\n]+/g, '<br>');
//setupSummaries = str.replace(/\n/g, '<br>');
//setupSummaries = str.replace(\n\r/g, '<br>'); // Mac uses \r
//setupSummaries = str.replace(/\r/g, '<br>');
//setupSummaries = str.replace(/\r/g, "</p><p>");
var setupSummaries = str.replace(/(\r\n|\n|\r)/gm,"</p><p>"); 

Answer 1

You’re putting together a mailto: URI, so URI-encode the message body:

var bod = "&body="+encodeURIComponent(form2.setupSummaries.value);