asked on

Modify mailto code

The mailto code on the page below creates form field that is not needed. Clicking the "Click to Send Email" link on this current-project page does almost what I want it to do but needs to be modified in the following way.

The body of the email should contain the link to the name of the page as it does but should only show the last part of the URL. So instead of showing http://www.frugalmule.com/current-project, it would just show the words current-project.

The title of the email should be formatted as whatever the title is.

The link also doesn't appear to become active until you place your cursor in the form field which should not be required.

Assistance is greatly appreciated.

<label>Email Address: </label>
<input type="text" id="send_email" onBlur="document.getElementById('email_link').href = 'mailto:' + this.value + '?subject=Check Out This Link&body=' + document.URL; ">

<a href="javascript:void(0)" id="email_link">Click to Send Email</a>

Open in new window

HainKurt

looks like not possible, and you cannot trust on client email settings... maybe they dont have email client installed...
create a form, around email and submit to server
on server side, create an email and send using some third party email component
you will have full control on email... with js, probably you willnot be able to use html code in body... email format should be set to HTML

so, forget about client side, and have a look at server side scripting...

rtod2

ASKER

I am just looking to develop a link that can open the person's default email program and include the title of the page along with a link to it. Maybe we are making it too difficult with Javascript but that task is surely doable today.

HainKurt

looks like you cannot use html in body... so, if there is no html, you cannot use links

sample link:

Visit us at <a href="http://www.HainKurt.com">HainKurt</a>!

only simple text in body...

HainKurt

if all users use IE & outlook (maybe an internal web site) you can use Outlook & ActiveX

have a look at this

http://www.webdeveloper.com/forum/showthread.php?t=176548

HainKurt

http://tools.ietf.org/html/rfc2368
-->
http://tools.ietf.org/html/rfc6068

The special <hfname> "body" indicates that the associated <hfvalue>
is the body of the message. The "body" field value is intended to
contain the content for the first text/plain body part of the
message. The "body" pseudo header field is primarily intended for
the generation of short text messages for automatic processing (such
as "subscribe" messages for mailing lists), not for general MIME
bodies.

HainKurt

so, you are out of luck... server side coding is the only way to go, or just plain text (users copy paste the url in email)
or you hope email client will create an auto link around that url (full url, not a description and hidden url)

nap0leon

If you want to only show the path to the current page and not the full URL, replace document.URL with window.location.pathname

If you want to make the email address field optional, you can move the "onBlur" into a function and call that function when the page is loaded.

See below (you will want to add the appropriate document.ready, etc.)

<html>
<head>
<script>
function updateEmailLink(){
  var thisPage = window.location.pathname;
  document.getElementById('email_link').href = 'mailto:' + this.value + '?subject=Check Out This Link&body=' + thisPage; 
}
</script>
</head>
<body>
<label>Email Address: </label>
<input type="text" id="send_email" onBlur="javascript:updateEmailLink();">

<a href="javascript:void(0)" id="email_link">Click to Send Email</a>
<script>
updateEmailLink();
</script>
</body>
</html>

Open in new window

nap0leon

Sorry - I missed the part where you want the page name to actually be a live link.
For that, you'll need to investigate server side scripting as HainKurt mentioned (user submits a form to you and you send them an HTML email)

rtod2

ASKER

Nap0leon,
Thank you for your modification of this code

<label>Email Address: </label>
<input type="text" id="send_email" onBlur="document.getElementById('email_link').href = 'mailto:' + this.value + '?subject=Check Out This Link&body=' + document.URL; ">

<a href="javascript:void(0)" id="email_link">Click to Send Email</a>

Open in new window

with this code

<html>
<head>
<script>
function updateEmailLink(){
  var thisPage = window.location.pathname;
  document.getElementById('email_link').href = 'mailto:' + this.value + '?subject=Check Out This Link&body=' + thisPage; 
}
</script>
</head>
<body>
<label>Email Address: </label>
<input type="text" id="send_email" onBlur="javascript:updateEmailLink();">

<a href="javascript:void(0)" id="email_link">Click to Send Email</a>
<script>
updateEmailLink();
</script>
</body>
</html>

Open in new window

This does seem to get rid of the need to put an email address into the field which allows the "Click to Send Email" to be immediately available. With the old code though, the email body contained a link to the page which does need to be there. Ideally, the title of the email could also take on the title of the page. Please update if possible. I greatly appreciate the assistance!

ASKER CERTIFIED SOLUTION

nap0leon

membership

Create a free account to see this answer

Signing up is free and takes 30 seconds. No credit card required.

See answer

SOLUTION

HainKurt

membership

Create a free account to see this answer

Signing up is free and takes 30 seconds. No credit card required.

See answer

nap0leon

Thanks - I forgot to accept "this" into the function... doh!

rtod2

ASKER

Nap0lean and HainKurt, Thank you!

Nap0lean, Your latest code completed here

<html>
<head>
<script>
function updateEmailLink(){
  var title = "Check out this page";
  if (document.title){title +=': '+document.title;}
  document.getElementById('email_link').href = 'mailto:' + this.value + '?subject='+title+'&body=' + window.location.href; 
}
</script>
</head>
<body>
<label>Email Address: </label>
<input type="text" id="send_email" onBlur="javascript:updateEmailLink();">

<a href="javascript:void(0)" id="email_link">Click to Send Email</a>
<script>
updateEmailLink();
</script>
</body>
</html>

Open in new window

gets me close to what I am looking for but not quite. Here is a 2 minute video with the desired end result pictured at the end http://screencast.com/t/dbmKrj9XZWl. Thanks again for the assist.

rtod2

ASKER

Closing in favor of clarifying desired result.

rtod2

ASKER

new question posted here https://www.experts-exchange.com/questions/27432652/Mailto-code-desired-result.html