CODEWITHSUNDEEP
javascripthtmlreactjs
Michael
Michael

Reputation: 1684

How do you dynamically set a recipient in a mailto link?

I'm trying to dynamically set the recipient of my mailto link in javascript. I thought that I could just put a javascript variable in the recipient place of the link, but I get errors when trying to do so. Anyone have any suggestions of why this might not be working?

This is what I currently have, which is throwing errors inside my code.


var customerEmail = "[email protected]";

<a href='mailto:' + customerEmail + '?subject=Quote&body=I%20would%20like%20to%20accept%20this%20quote' ><button>Click To Accept</button></a>

Upvotes: 3

Views: 2435

Answers (2)

Girgetto
Girgetto

Reputation: 1086

You are missing the curly braces inside the href attribute:

var customerEmail = "[email protected]";

<a href={'mailto:' + customerEmail + '?subject=Quote&body=I%20would%20like%20to%20accept%20this%20quote'} >
  <button>Click To Accept</button>
</a>

The curly braces are a special syntax to let the JSX parser know that it needs to interpret the contents in between them as JavaScript instead of a string.

Upvotes: 3

Lukasz &#39;Severiaan&#39; Grela
Lukasz &#39;Severiaan&#39; Grela

Reputation: 6258

either pull out the concatenation out of the href or use bacticks to fill the href.

<a href={`mailto:${customerEmail}?subject=Quote&body=I%20would%20like%20to%20accept%20this%20quote`} >
   <button>Click To Accept</button>
</a>

Upvotes: 5

Related Questions