Automatically Inserting the Current URL Into Forms
When you have the same form on many pages, and it needs to
contain the current page's URL, then either the form needs
to be edited for every page or an automated method is used
to insert the current page's URL.
This article shows you an automated method.
With this system, the form can be pasted into pages without
further editing. This can save so much work!
Examples of forms that might appear on many pages are "email
this page," "recommend this page," "translate this page,"
and "tell us if something is wrong with this page."
This article will use as an example a "tell us if something
is wrong with this page" form handled with the easy and free
Master Feedback
The form in the example below was designed to fit within
common widths of web page navigation areas. Modify the
fields and style as you see fit.
Here is an example form before the edits.
<p>Something wrong with this page? Tell us!</p>
<form
method="POST"
action="/cgi-bin/MasterFeedback.cgi">
<input
type="hidden"
name="x_url"
value="http://example.com/thispage.html">
<input
type="hidden"
name="subject"
value="Something wrong!">
<input
type="hidden"
name="thankyou"
value="http://example.com/thankyou.html">
Your name:<br>
<input
style="font-family: monospace; font-size: 12px;"
type="text"
name="realname"
size="19">
<br>
Your email:<br>
<input
style="font-family: monospace; font-size: 12px;"
type="text"
name="email"
size="19">
<br>
What is wrong?<br>
<textarea
style="font-family: monospace; font-size: 12px;"
name="message"
rows="4"
cols="16"
wrap="soft">
</textarea>
<br>
<input
type="submit"
value="Send Message">
</form>
The URL in the hidden field name="x_url" is what we want to
insert automatically.
And while we're at it, let's give non-JavaScript browsers a
form field where they can type in the URL of the web page.
Replace the hidden field name="x_url" in the above form
with this (the JavaScript variable document.URL contains
the current web page's URL):
<script type="text/javascript" language="JavaScript"><!--
document.write('<input ');
document.write(' type="hidden" ');
document.write(' name="x_url" ');
document.write(' value="' + document.URL + '">');
//--></script>
<noscript> <!-- for non-JavaScript browsers -->
Copy the URL in your browser's address bar
and paste it here.<br>
<input
type="text"
name="x_url"
style="font-family: monospace; font-size: 12px;"
size="19">
<br>
</noscript>
If the user's browser is JavaScript-enabled, the page's URL
will be inserted into the hidden field at the time the page
is loaded into the browser.
If the user's browser is not so enabled, s/he will see an
empty form field with a note to "Copy the URL in your
browser's address bar and paste it here:"
For reference, here is the entire form, modified as
indicated above.
<p>Something wrong with this page? Tell us!</p>
<form
method="POST"
action="/cgi-bin/MasterFeedback.cgi">
<script type="text/javascript" language="JavaScript"><!--
document.write('<input ');
document.write(' type="hidden" ');
document.write(' name="x_url" ');
document.write(' value="' + document.URL + '">');
//--></script>
<noscript> <!-- for non-JavaScript browsers -->
Copy the URL from your browser's address bar
and paste it here.<br>
<input
type="text"
name="x_url"
style="font-family: monospace; font-size: 12px;"
size="19">
<br>
</noscript>
<input
type="hidden"
name="subject"
value="Something wrong!">
<input
type="hidden"
name="thankyou"
value="http://example.com/thankyou.html">
Your name:<br>
<input
style="font-family: monospace; font-size: 12px;"
type="text"
name="realname"
size="19">
<br>
Your email:<br>
<input
style="font-family: monospace; font-size: 12px;"
type="text"
name="email"
size="19">
<br>
What is wrong?<br>
<textarea
style="font-family: monospace; font-size: 12px;"
name="message"
rows="4"
cols="16"
wrap="soft">
</textarea>
<br>
<input
type="submit"
value="Send Message">
</form>
The above form can be used for other types of feedback, of
course, it is simply an example. Other forms can be modified
in a similar manner.
Question:
Did you find this article interesting and understandable? How can it be improved?
Your response is anonymous.
When done typing, click anywhere outside the box. [more info]
Will Bontrager
©2005 Bontrager Connection, LLC
Please note:
Articles on this website are presented "as is". However -
If you have a question about a CGI script, HTML, CSS, PHP, or JavaScript
Ask one of our Experts and you'll have your answer!
Click here for details.