Search code examples
javascriptgoogle-chromeinternet-explorerundefinedmailto

javascript mailto works in chrome but not IE

I'm trying to build a simple webpage for our lab engineers so when they are sitting at their station they can open the web page shortcut from their desktop > select which lab they are in > select which kind of support they require > then click submit to open an email with all the selected information inserted > then hit send; which then sends an email request to those in the email list.

Everything works great in Chrome, but most of our engineers use IE by default, when I click the submit button in IE, it opens the email, but the To: and Subject: read "UNDEFINED". I am using IE10. 

<!DOCTYPE HTML>
<html>
<link rel="stylesheet" type="text/css" href="silsupport.css">
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />

<title>SILSupport</title>

<body>
<h1>SIL Support</h1>
<SCRIPT>
    function e_mail(e_add,subject1,body)
    {
        window.location="mailto:"+e_add+"?subject="+subject1+"&body="+body;
    }
</SCRIPT>
<form name="e_form" enctype="text/plain">
    <div id="para1">    
        <p>Please select which lab you are in: </p>                     
            <input name="subj" type="radio" value="Lab_1 Support" />Lab 1<br />
            <input name="subj" type="radio" value="Lab_2 Support" />Lab 2<br />
            <input name="subj" type="radio" value="Lab_3 Support" />Lab 3<br />
            <input name="subj" type="radio" value="Lab_4 Support" />Lab 4<br />
            <input name="subj" type="radio" value="Lab_5 Support" />Lab 5<br />
    </div>       

    <div id="para2">
        <p>Please select which support you require:</p>
            <input name="emadd" type="radio"  value="re@abc.com" />RE Support<br />
            <input name="emadd" type="radio"  value="admin@abc.com" />Admin Support<br />
            <input name="emadd" type="radio"  value="system@abc.com" />System Support<br />
            <input name="emadd" type="radio"  value="hwsw@abc.com" />H/W &amp; S/W Support<br />
            <input name="body"  type="hidden" value="I require support now!" />
    </div>
    <input type="button" id="Submit" Value="Submit" onClick="e_mail(this.form.emadd.value,this.form.subj.value,this.form.body.value)" />

</form>

</body>
</html>
Solution

  • You really should have your own code to find the checked radio button:

    function findChecked(radios) {
    for (var i = 0; i < radios.length && !radios[i].checked; ++i);
    return radios[i] && radios[i].value;
}

    That function expects a list, which is what you'll get from the by-name reference to the radio button groups. It looks for the checked button and returns its value.

    Then:

    <input type="button" id="Submit" Value="Submit"
  onClick="e_mail(findChecked(this.form.emadd),findChecked(this.form.subj),this.form.body.value)" />

    JsFiddle link