<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	xmlns:series="http://unfoldingneurons.com/"
	>

<channel>
	<title>Web Design Tutorials &#187; Dreamweaver CS4 Form Validation Tutorial</title>
	<atom:link href="http://bestwebdesignz.com/tips/tag/dreamweaver-cs4-form-validation-tutorial/feed/" rel="self" type="application/rss+xml" />
	<link>http://bestwebdesignz.com/tips</link>
	<description></description>
	<lastBuildDate>Fri, 30 Jul 2010 09:47:47 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Dreamweaver CS4 Form Validation Tutorial</title>
		<link>http://bestwebdesignz.com/tips/dreamweaver/dreamweaver-cs4-form-validation-tutorial/</link>
		<comments>http://bestwebdesignz.com/tips/dreamweaver/dreamweaver-cs4-form-validation-tutorial/#comments</comments>
		<pubDate>Thu, 19 Mar 2009 07:28:02 +0000</pubDate>
		<dc:creator>clement</dc:creator>
				<category><![CDATA[Dreamweaver]]></category>
		<category><![CDATA[Dreamweaver CS4 Form Validation Tutorial]]></category>

		<guid isPermaLink="false">http://bestwebdesignz.com/tips/?p=254</guid>
		<description><![CDATA[This entry is part 15 of 18 in the series Dreamweaver CS4 TutorialsIn this Dreamweaver CS4 Form Validation Tutorial we will learn how to validate a form in Dreamweaver CS4.
The form we will validate is shown below:

Step 1: Select the form tag
You can do this by clicking anywhere in the form and selecting the &#60;form&#62; [...]]]></description>
			<content:encoded><![CDATA[<div class="seriesmeta">This entry is part 15 of 18 in the series <a href="http://bestwebdesignz.com/tips/series/dreamweaver-cs4-tutorials/" title="series-41">Dreamweaver CS4 Tutorials</a></div><p>In this Dreamweaver CS4 Form Validation Tutorial we will learn how to validate a form in Dreamweaver CS4.</p>
<p>The form we will validate is shown below:</p>
<p><img class="alignnone size-full wp-image-255" src="http://bestwebdesignz.com/tips/wp-content/uploads/2009/03/form-fields.gif" alt="Dreamweaver CS4 Form Validation Tutorial" width="528" height="359" title="Dreamweaver Cs4 Form Validation Tutorial Photo" /></p>
<h2>Step 1: Select the form tag</h2>
<p>You can do this by clicking anywhere in the form and selecting the &lt;form&gt; tag when it shows at the bottom of the document window. The entire form will grey out to show that it is selected.</p>
<p><img class="alignnone size-full wp-image-256" src="http://bestwebdesignz.com/tips/wp-content/uploads/2009/03/form-tag.gif" alt="Dreamweaver CS4 Form Validation Tutorial" width="209" height="45" title="Dreamweaver Cs4 Form Validation Tutorial Photo" /></p>
<h2>Step 2: Open the Behavior Inspector</h2>
<p>Open the Behavior Inspector (Window &gt; Behaviors)</p>
<p><img class="alignnone size-full wp-image-257" title="behavior-inspector" src="http://bestwebdesignz.com/tips/wp-content/uploads/2009/03/behavior-inspector.gif" alt="Dreamweaver CS4 Form Validation Tutorial" width="557" height="281" /></p>
<h2>Step 3: Add the Validate Form Behavior</h2>
<p>Click the &#8220;Add Behavior&#8221; icon (+ icon) and select &#8220;Validate Form&#8221;</p>
<p><img class="alignnone size-full wp-image-258" title="validate-form" src="http://bestwebdesignz.com/tips/wp-content/uploads/2009/03/validate-form.gif" alt="Dreamweaver CS4 Form Validation Tutorial" width="268" height="459" /></p>
<h2>Step 4: Specify the validation requirements for each form field</h2>
<p>In the &#8220;Validate Form&#8221; Panel that opens select each field and specify the validation required.</p>
<p><img class="alignnone size-full wp-image-259" title="validate-form-fields" src="http://bestwebdesignz.com/tips/wp-content/uploads/2009/03/validate-form-fields.gif" alt="Dreamweaver CS4 Form Validation Tutorial" width="511" height="291" /></p>
<p>In the example below I have given the following validation requirements:</p>
<p><strong>name</strong> &#8211; Required, Anything</p>
<p><strong>email</strong> &#8211; Required, Email Address</p>
<p><strong>phone</strong> &#8211; Required, Number</p>
<p><img class="alignnone size-full wp-image-260" title="validate-form-fields2" src="http://bestwebdesignz.com/tips/wp-content/uploads/2009/03/validate-form-fields2.gif" alt="Dreamweaver CS4 Form Validation Tutorial" width="511" height="291" /></p>
<h2>Step 5: Click OK and check in the browser</h2>
<p>Click OK when you are done with the validations.</p>
<p>Save your page and preview in the browser. Test by trying to submit the form without the required values. You should get an error message like the one shown below:</p>
<p><img class="alignnone size-full wp-image-261" title="form-error-message" src="http://bestwebdesignz.com/tips/wp-content/uploads/2009/03/form-error-message.gif" alt="Dreamweaver CS4 Form Validation Tutorial" width="511" height="291" /></p>
<script type="text/javascript"><!--
                    google_ad_client = "pub-7099335855422733";
                    google_ad_slot = "4729128935";
                    google_ad_width = 336;
                    google_ad_height = 280;
                    //-->
                    </script>
                    <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
        </script>
                    ]]></content:encoded>
			<wfw:commentRss>http://bestwebdesignz.com/tips/dreamweaver/dreamweaver-cs4-form-validation-tutorial/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
	
		<series:name><![CDATA[Dreamweaver CS4 Tutorials]]></series:name>
	</item>
	</channel>
</rss>
