Populating an email from an HTML field

I have an application with many fields over several pages. After hitting Load, a Summary field is filled (via Javascript) with all the input from the various fields. This is working perfectly.

Is it possible to make a button that, when clicked, will open the user’s email client with the body filled in with the contents of this Summary field? Obviously the field will need a unique ID so JS can target it, I’ll use onClick, and I’ll need the mailto: tag, but I don’t know what syntax to use to put it all together. Also, the script should check to make sure the field is full (they should tap on “Load” first), so the length of Summary needs to be checked. Only the Safari browser will be used for this.


One option is to put the data you want in the email into a <form> with “mailto:someEmailAddress” as the form’s action value.

But I think you would be better off sending the email from a server side script which will work in all cases. Mailto will not work for users who do not have an email client installed on their pc or whatever.

Also, any data validation prior to sending the email should be done server side because javascript validation won’t work on javascript disabled browsers. Even if javascript is enabled, it can easily be turned off in the browser by the user and so bypass any javascript validation.

This is in the iPhone, so the mail client is built in.

ok, then just use mailto:

No disrespect intended, but this response has nothing to do with the original post.

I am using this JS code. (I got it from http://www.webmasterworld.com/forum9/4864.htm ) I need the code to work on multiple forms on the same page. This works for emailing a textarea named setupSummaries in form name=“form2” on the page:

function send_setupSummaries(form2) {
"use strict" 
var eml="";
var bod = "+body="+form2.setupSummaries.value;
var subj= "?subject=from App";

With small changes for form name=“form1a” on the page, textarea named setupSOneSummary, this does not work:

function send_setupSOneSummary(form1a) {
"use strict" 
var eml="";
var bod = "+body="+form1a.setupSOneSummary.value;
var subj= "?subject=Setup 1";

For both places I have this as the button:

<input type="submit" value="Send above summary via email">

The textareas are formatted as follows:

<li><textarea name="setupSummaries" cols="20" rows="7" style="background-color:#fff; color:#000; height:40em;" placeholder="Tap on Load to fill this area."></textarea>

How do I get the second one to work?


Go back and look at my earlier post tell me why mailto: would not work. It works perfectly well for me :slight_smile:

According to my code, I am using mailto: But the Javascript code used to populate the body field is not working with it. In other words, your response does not address my Javascript issue. Thanks!

I gave you a description of the syntax for mailto in a <form> which is what you asked for in your op. If it isn’t then you should consider explaining more clearly what you actually need and in the mean time hopefully someone else will come along to show you what you have done wrong.

Thanks! I thought this was clear: “Is it possible to make a button that, when clicked, will open the user’s email client with the body filled in with the contents of this Summary field?” Mailto: is needed, but how to get the contents from the textarea into the body portion of the mailto is the hard part, especially when you don’t know what the content will be in advance.

Examples of the syntax to use for mailto can be found at http://zoomquiet.org/res/scrapbook/ZqSKM/data/20100419224556/

You could have scripting update the mailto information on the blur event of the textarea part itself, so that whenever focus leaves the textarea, the mailto information then becomes updated.

Thanks, Paul!