Home     SSI Lab     CSS Templates     CSS     Htaccess     Web Design     XHTML

X-SSI Lab

graphic-img   

SSI-D HOME

SSI LAB

Introductory Topics

SSI Directives

Extending SSI

Apps/Examples

Top Resources

CSS Templates

CSS

.Htaccess

Web Design

(X)HTML

HTML-Kit

Resources





Form & Thank-you on same page!

Introduction

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
Else
display HTML Form here
END



Code

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" />
.......
</form>
<!--#endif-->

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" />
.......
</form>

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

<!--#endif-->

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.