Effectively Requiring Both Cookies and JavaScript Before Submitting a Form
Sometimes a business relationship expands to include
personal friendship. That's what happened as a result
of doing some custom programming work for Charles Kirk
4-5 years ago. Charles and Rachel have become very good
friends.
Charles writes the The Kirk Report
(he is a pro, as you'll
realize soon after you read a few of his stock trading
blog entries).
Charles needed a way for his members to pick favorite
stocks from a short list of best recommendations. It was
important that each member voted only once.
Master Survey
was used to generate the form and tally the results.
The software has the ability to limit double-voting by
setting and recognizing cookies. But cookies can be turned
off.
What was needed was a method of ensuring cookies are turned
on before the form is submitted, to give the member the
opportunity to change the browser's settings before voting.
JavaScript can be used to verify browsers accept cookies.
The cookie verification process would break down, however,
for any browser with JavaScript turned off.
We needed a way to ensure browsers have both JavaScript and
cookies turned on, else block them from using the voting form.
This article reveals how it was solved.
An Overview
The centerpiece is the fact that the form's HTML source
code action="_____" attribute contains no URL.
JavaScript is used to assign a URL to the action="_____"
attribute. Therefore, JavaScript must be turned on to
successfully submit the form.
When the web page with the form is first loaded, a test
cookie is sent to the browser -- if JavaScript is turned
on.
Later, when the form's submit button is clicked, two things
happen:
-
JavaScript checks to see if the test cookie is
present.
-
If the cookie is still present, the JavaScript
assigns the correct URL to the action="_____"
attribute and lets the submission proceed.
Otherwise, it blocks the submission.
As you can see, without JavaScript the form can not be
successfully submitted.
And with JavaScript, the form submission is allowed to
proceed only if the browser accepts cookies.
The Details
Somewhere on the page is a notice that is printed only when
the page is loaded into a non-JavaScript browser. It alerts
the user to the fact that JavaScript is required.
Here is what Charles uses on his voting page:
The form's action="_____" attribute contains a note that
should only be seen if the form is submitted without
JavaScript turned on. Here it is:
That's the extent of the provisions for non-JavaScript
browsers. If the user ignores the first notice, s/he is
still unable to successfully submit the form. If the form
is submitted, the "URL" informs the user what to do.
For browsers that are JavaScript-enabled, a cookie is set
when the voting page first loads.
http://bontragercgi.com/Are_Browser_Cookies_Enabled.html
contains code for testing two types of cookies, session
cookies (which are deleted when the browser closes) and
persistent cookies (which remain with the browser for one
or more days). The article contains good information if
you plan on testing browsers for their ability to accept
cookies.
Charles' page has a version of the persistent cookie code
found at the above URL. The number of days the cookie shall
persist is hard coded, and the error message is rather
lengthy:
Notice that the cookie error message is stored in a
variable. This allows the same message to be used in the
later JavaScript if cookies are turned off after loading
the page but before submitting the form.
When the form is submitted, the onsubmit="_____" attribute
in the
Here is the function:
If the test cookie is no longer available, the cookie error
message is displayed and false is returned. If the cookie
is present, the form's action="_____" is assigned the
correct URL and true is returned.
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.
