CODEWITHSUNDEEP
javascripthtmldynamicmailto
Spags
Spags

Reputation: 541

Is it possible to dynamically set the recipient of MAILTO: with only HTML and JavaScript?

I am creating a form using only HTML and JavaScript where I want to be able to dynamically set the recipient of a POSTed form by altering the MAILTO: address or the CC address of the mailto: line. This will be determined by the value of a text box if at all possible. The purpose of this functionality is that the form data needs to be sent to a different manager depending on the choice they make in a drop down menu. I have seen this done in one place (http://javascript.internet.com/forms/multiple-mailer.html) but my issue is that I am populating my dropdown from a JS array which when selected populates some text fields just like (http://www.webdeveloper.com/forum/showpost.php?p=984036&postcount=8). So what I want to do is populate a hidden text input with my drop down and draw from that to determine who gets the email.

I should note that this is for a corporate INTRAnet site where lack of desktop email client is not an issue and where IE is the only browser usable. I do not have access to server-side tech so mailto is my only option, please refrain from wasting comments telling me how bad an idea it is, lol. Thanks!

Thoughts?

Upvotes: 3

Views: 10283

Answers (3)

chris s.
chris s.

Reputation: 1

Yes, it is possible. I have an option box in my form similar to this:

<td><select name="Division" id="Division" onChange="dirChange()" tabindex="3">
<option selected>Choose One</option>
<option value="Communications">Communications</option>
<option value="Legal Services">Legal Services</option>
</select>        &nbsp;</td>

It refers to a javascript function:

function dirChange()
{
var i = document.all.Division.value;
switch (i)
{

    case "Communications":
        document.all.DeputyDirector.value = "Dave C.";
        document.all.form.action = "mailto:[email protected]?subject=Form";
        break;

    case "Legal Services":
        document.all.DeputyDirector.value = "Dixie P.";
        document.all.form.action = "mailto:[email protected]?subject=Form";
        break;

    default:
        document.all.DeputyDirector.value = "";
        break;

}
}

This javascript then helps fill in the needed information on a text box and for the form to email to the selected person.

<tr>
  <td class="announcementText"> <span class="style12"><span class="style16"><span class="style31">*</span></span></span>Division Deputy Dir.:  </td>
  <td><input name="DeputyDirector" type="text" id="DeputyDirector" style="background-color:#cccccc; color:black; font-weight:bold; border:0; overflow:visible" size="38"></td>

</tr>

<form onChange="dirChange()" method="post" enctype="text/plain" name="form" id="form"   onSubmit="return checkform(this);">

The resulting html for the client, once they select a communications division is: for the text box:

<input name="DeputyDirector" type="text" id="DeputyDirector" style="background-color:#cccccc; color:black; font-weight:bold; border:0; overflow:visible" size="38" value = "Dave C.">

and for the form:

<form onChange="dirChange()" method="post" enctype="text/plain" name="form" id="form"   onSubmit="return checkform(this); action = "mailto:[email protected]?subject=Form">

or if they select legal services for the text box:

<input name="DeputyDirector" type="text" id="DeputyDirector" style="background-color:#cccccc; color:black; font-weight:bold; border:0; overflow:visible" size="38" value = "Dixie P.">

and for the form:

<form onChange="dirChange()" method="post" enctype="text/plain" name="form" id="form"   onSubmit="return checkform(this); action = "mailto:[email protected]?subject=Form">

Upvotes: 0

Delan Azabani
Delan Azabani

Reputation: 81404

To open the mail client with some email address:

location = 'mailto:' + email_address;

To set the href of an a element, first get it using something like document.getElementById, then set the href property:

document.getElementById('someLink').href = 'mailto:' + email_address;

email_address is a string containing the applicable email address -- you can replace this with an expression that gets the value of the dropdown:

document.getElementById('someLink').href = 'mailto:' + document.getElementById('dropdown').value;

Upvotes: 4

SLaks
SLaks

Reputation: 887469

You can just set the href attribute to a string containing an email address using Javascript.

Upvotes: 0

Related Questions