manipulating a hidden field value in a HTML form

[edwindavidson]

On our HTML page I have a form and in my form is a hidden field as follows (I'm going to use generic site data but you will get the idea):

<FORM METHOD="POST" ACTION="http://ourwebsite.com/cgi-bin/FormMail.pl">
<input type="hidden" name="recipient" value="department.one@ourdomain.com">

The above 2 lines are the code for the start of my form and this one hidden field.

Furthur down my form, I have a dropdown box coded like this:

<TR>
<TD>Department:</TD>
<TD><SELECT NAME="Department">
<option value="Department1">Department1
<option value="Department2">Department2
<option value="Department3">Department3
</SELECT>
</TD>
</TR>

Formmail executes when the user clicks the "Submit" button at the bottom of our form to email this form data to a certain email address.

Let's say the 3 email addresses are department.one@ourdomain.com, department.two@ourdomain.com and department.three@ourdomain.com. The exact way I want this to work is based on whatever the user clicked for the above 'Department' field, Formmail will sent the form data to just one of three departmental email addresses. So if they chose Department 2, the form data gets sent to department.two@ourdomain.com. If they do not select any department it will go to department.one@ourdomain.com.

What I need to do is to modify the value of the hidden field 'recipient' that gets passed to Formmail. Can a small Javascript do this ? 'receipient' has to end up containing the text of the email address of the department that the user selected BEFORE the user clicks 'Submit'. That way Formmail just sends the form data to the email address that the user selected on my form.

Thank you very much.
Edwin Davidson

[AdamGundry]

You should be able to do something like this (untested):


<form name="form" method="post" action="http://example.com/cgi-bin/FormMail.pl"
onsubmit="if (document.form.department.selectedIndex)
document.form.recipient.value = (document.form.department.selectedIndex == 1 ? 'department.two@example.com' : 'department.three@example.com')">
<input type="hidden" name="recipient" value="department.one@example.com">

...

<select name="department">
<option value="Department1">Department1
<option value="Department2">Department2
<option value="Department3">Department3
</select>



Remember that this will fail for users with JS disabled, and will send the email to department.one in all cases.

Adam

[edwindavidson]

thank you very much Adam for your reply - this worked great !

Edwin