Create Online Forms
In the past few years there has been a lot of talk about web security. At the web communications office, we have created a set of scripts to help web authors create safe email forms.
What are Online Forms?
Online forms on the UNC server ask users for input and then email the results to an email address. The information passed is not secure so if your form requires the user's Social Security number, Bear number, birthday and address combined, or any confidential information contact IT to request a secure form. The information is passes as clear text (nonencrypted) and can be captured and used by others.
What Information can I NOT collect?
If you have a form that asks for social security number, bear number, or a combination of mailing address and birth date you can not use the instructions below. Contact IT to create a secure form.
How Do I Create them?
There are two parts to creating an online form: the form itself, and the thank you page. These can be done on the same page if needed, but we encourage less experienced web developers to use two pages.
Below is a standard form that asks First Name, Last Name and Email Address. There are two hidden inputs that are required (bolded below), "formsubject" and "formrecipient". Change the value of these two items so the form is sent to your address with the subject line of your choice.
<form id="form1" name="form1" method="post" action="thankyou.asp">
<input type="hidden" name="formsubject" value="The Email Subject" />
<input type="hidden" name="formrecipient" value="firstname.lastname@example.org" />
<p><label>First Name:</label><input type="text" name="first_name" id="first_name" maxlength="15" /></p>
<p><label>Last Name:</label><input type="text" name="last_name" id="last_name" maxlength="15" /></p>
<p><label> Email:</label><input type="text" name="email" id="email" maxlength="30" /></p>
<p><input type="submit" name="button" id="button" value="Submit" /></p>
The Thank You Page:
Above on line 1 the form is directed to the page "thankyou.asp". On "thankyou.asp", place the following code anywhere on the page:
That's it, test it out and it will send you an email with the responses.
Formatting the Email:
Once you have tried it out, you will notice that the email doesn't sort the results. There are two ways to organize the results.
You can add the tag "formorder" as a hidden input box and indicate the order in which the fields will be sorted. If you use this field, place it under the "formrecipient" tag:
<input type="hidden" name="formorder" value="first_name,last_name,[hr],email" />
Separate field names with a comma (no spaces!).
Any values not included in this field will not be sent with the email.
[hr] will put in a horizontal rule between fields.
formtemplate is similar to formorder except it allows you to create an HTML template that the content will be pasted into. This should be used when the response has graphics components or large tables.
<input type="hidden" name="formtemplate" value="emailTemplate.html" />
The code above assumes that emailTemplate.html and the form are in the same directory.
In the HTML response template, form items are marked with @@elementname@@. For example, if the form name was "email", the template region would be called @@email@@. Items not listed in the HTML template will not be shown on the page.
For security reasons certain words are not allowed as field names or as user input. There is a huge list, but here are the ones that are most common:
"There was an error with input. Check with the system administrator or the webmaster for more information"
If you are getting this error and don't know why, you can put in the following line and a error box will display with possible problems.
<input type="hidden" name="debug" value="yes">
Please note: this is for testing only and should be turned off for production scripts.
If you are still getting this error and don't know why, please contact Jesse Clark.
<input type="hidden" name="email" value="myAddress@unco.edu" />
By default, the script will send from email@example.com. If there is a input field with the name "email" it will use this field instead. If you wish to have it controlled and sent from a specific email address, put a hidden field called email in:
<input type="hidden" name="email" value="firstname.lastname@example.org" />
<input type="hidden" name="qs" value="5" />
If you are are using the same page for both from and response then you may need to use a querystring. This value can be anything from 0 to 10. For security reasons the query string can not be longer than 10 characters. Please remember that "?" is counted as one of the characters.