Home     SSI Lab     CSS Templates     CSS     Htaccess     Web Design     XHTML





Introductory Topics

SSI Directives

Extending SSI


Top Resources

CSS Templates



Web Design




Form & Thank-you on same page!


I was asked recently how I have a feedback form on my page that when submitted leads a thank-you message on the same page. This guide shows you how to do this simple but effective query string "trick" which has multiple applications.

How this works is we set a query string to a particular "keyword" then when the page loads the SSI reads the "keyword" and displays the content specified for that keyword.

I'll break it down into steps with an example to explain it better.

Form and Thank-you page

We have a basic HTML form submitting whatever information you require located on contact.shtml. We use a hidden input tag to specify the redirect to the thank you page after form submittal. The "thank-you" page should also be contact.shtml but we add a query string containing our "keyword":

<input type="hidden" name="redirect" value="contact.shtml?submitted">

The SSI then reads this query string and IF the query string IS submitted it will display your thank-you message. (If you check your browser address bar you would see http://domain.com/contact.shtml?submitted) Check this example:

IF Query String IS submitted
display thank you message here
display HTML Form here


The correct syntax for this example would be (remember the form is in contact.shtml) :

<!--#if expr="$QUERY_STRING = 'submitted'" -->
<p>Thank you for your submission.</p>
<!--#else -->
<form method="post" action="feedback.php">
<input type="hidden" name="redirect" value="contact.shtml?submitted" />

You can add any number of "steps" in this process once you get the code right. At the time of writing this I use two steps as shown below for a site feedback form:

<!--#if expr="$QUERY_STRING = 'submitted2'" -->
<p>Thank you for your submission.</p>
<!--#elif expr="$QUERY_STRING = 'submitted1'" -->
<!-- THIS IS FORM 2 -->
<form method="post" action="feedback.php">
<input type="hidden" name="redirect" value="contact.shtml?submitted2" />

<!--#else -->
<!-- THIS IS FORM 1 -->
<form method="post" action="feedback.php">
<input type="hidden" name="redirect" value="contact.shtml?submitted1" />


It's not entirely practical that you receive 2 form submissions but it still has many obvious uses. Be imaginative!

Advertisement Sign up for free to PayBox.me today and get $25 just for joining AND earn up to $20 per day for participating.