Adobe Dreamweaver CS3 - Manual (Page 477)

DREAMWEAVER CS3
User Guide
470
The default HTML for the Validation Text Area widget, usually inside of a form, comprises a container tag
that surrounds the tag of the text area. The HTML for the Validation Text Area widget also includes script<br>tags in the head of the document and after the widget’s HTML markup.</p><p style="position:absolute;top:223px;left:139px;white-space:nowrap" class="ft012">For a more comprehensive explanation of how the Validation Text Area widget works, including a full anatomy of<br>the Validation Text Area widget’s code, see</p><p style="position:absolute;top:243px;left:392px;white-space:nowrap" class="ft04"><noindex><a rel="nofollow" href="http://www.adobe.com/go/learn_dw_sprytextarea">www.adobe.com/go/learn_dw_sprytextarea</a></noindex></p><p style="position:absolute;top:243px;left:649px;white-space:nowrap" class="ft03">.</p><p style="position:absolute;top:290px;left:139px;white-space:nowrap" class="ft05"><b>Insert the Validation Text Area widget</b></p><p style="position:absolute;top:315px;left:139px;white-space:nowrap" class="ft06"><b>1</b></p><p style="position:absolute;top:314px;left:155px;white-space:nowrap" class="ft03">Select Insert > Spry > Spry Validation Textarea.</p><p style="position:absolute;top:341px;left:139px;white-space:nowrap" class="ft06"><b>2</b></p><p style="position:absolute;top:341px;left:155px;white-space:nowrap" class="ft03">Complete the Input Tag Accessibility Attributes dialog box and click OK.</p><p style="position:absolute;top:364px;left:139px;white-space:nowrap" class="ft07"><i><b>Note: </b>You can also insert a Validation Text Area widget by using the Spry category in the Insert bar.</i></p><p style="position:absolute;top:413px;left:139px;white-space:nowrap" class="ft09"><b>See also</b></p><p style="position:absolute;top:439px;left:139px;white-space:nowrap" class="ft03"><a rel="nofollow" href="?page=619">“Create accessible HTML forms” on page 612</a></p><p style="position:absolute;top:486px;left:139px;white-space:nowrap" class="ft05"><b>Specify when validation occurs</b></p><p style="position:absolute;top:510px;left:139px;white-space:nowrap" class="ft012">You can set the point at which validation occurs—when the user clicks outside the widget, as the user types, or when<br>the user tries to submit the form.</p><p style="position:absolute;top:559px;left:139px;white-space:nowrap" class="ft06"><b>1</b></p><p style="position:absolute;top:559px;left:155px;white-space:nowrap" class="ft03">Select a Validation Text Area widget in the Document window.</p><p style="position:absolute;top:586px;left:139px;white-space:nowrap" class="ft06"><b>2</b></p><p style="position:absolute;top:585px;left:155px;white-space:nowrap" class="ft03">In the Property inspector (Window > Properties), select the Validate On option that indicates when you want</p><p style="position:absolute;top:605px;left:139px;white-space:nowrap" class="ft03">validation to occur. You can select all of the options or none of them.</p><p style="position:absolute;top:631px;left:139px;white-space:nowrap" class="ft010"><b>Blur</b></p><p style="position:absolute;top:630px;left:170px;white-space:nowrap" class="ft03">Validates whenever the user clicks outside the text field.</p><p style="position:absolute;top:659px;left:139px;white-space:nowrap" class="ft010"><b>Change</b></p><p style="position:absolute;top:658px;left:191px;white-space:nowrap" class="ft03">Validates as the user changes text inside the text field.</p><p style="position:absolute;top:687px;left:139px;white-space:nowrap" class="ft010"><b>Submit</b></p><p style="position:absolute;top:686px;left:188px;white-space:nowrap" class="ft03">Validates when the user tries to submit the form.</p><p style="position:absolute;top:733px;left:139px;white-space:nowrap" class="ft05"><b>Specify a minimum and maximum number of characters</b></p><p style="position:absolute;top:758px;left:139px;white-space:nowrap" class="ft06"><b>1</b></p><p style="position:absolute;top:757px;left:155px;white-space:nowrap" class="ft03">Select a Validation Text Area widget in the Document window.</p><p style="position:absolute;top:784px;left:139px;white-space:nowrap" class="ft06"><b>2</b></p><p style="position:absolute;top:784px;left:155px;white-space:nowrap" class="ft03">In the Property inspector (Window > Properties), enter a number in the Min Chars or Max Chars box. For</p><p style="position:absolute;top:803px;left:139px;white-space:nowrap" class="ft012">example, if you enter 20 in the Min Chars box, the widget only validates if the user enters 20 or more characters in<br>the text area.</p><p style="position:absolute;top:870px;left:139px;white-space:nowrap" class="ft05"><b>Add a character counter</b></p><p style="position:absolute;top:894px;left:139px;white-space:nowrap" class="ft012">You can add a character counter that lets your users know how many characters they have typed, or how many<br>characters are remaining when entering text in the text area. By default, when you add a character counter, the<br>counter appears outside the lower-right corner of the widget.</p><p style="position:absolute;top:963px;left:139px;white-space:nowrap" class="ft06"><b>1</b></p><p style="position:absolute;top:962px;left:155px;white-space:nowrap" class="ft03">Select a Validation Text Area widget in the Document window.</p><p style="position:absolute;top:989px;left:139px;white-space:nowrap" class="ft06"><b>2</b></p><p style="position:absolute;top:989px;left:155px;white-space:nowrap" class="ft03">In the Property inspector (Window > Properties), select either the Chars Count or Chars Remaining option.</p><p style="position:absolute;top:1012px;left:139px;white-space:nowrap" class="ft07"><i><b>Note: </b>The Chars Remaining option is only available if you’ve already set a maximum number of characters allowed.</i></p><p style="position:absolute;top:1063px;left:139px;white-space:nowrap" class="ft05"><b>Display widget states in Design view</b></p><p style="position:absolute;top:1088px;left:139px;white-space:nowrap" class="ft06"><b>1</b></p><p style="position:absolute;top:1087px;left:155px;white-space:nowrap" class="ft03">Select a Validation Text Area widget in the Document window.</p><p style="position:absolute;top:1197px;left:424px;white-space:nowrap" class="ft011">September 4, 2007</p></div> </div> <div class="manual-page-original" itemscope="itemscope" itemtype="https://schema.org/ImageObject" data-img="/screens/771333/477.png" style="display: none;"> </div> </div> <a href="/manuals/753875/adobe-dreamweaver-cs3.html?page=476" class="manual-view__prev -onpage-nav" title="Previous (← + Ctrl)" aria-label="Previous page"><svg class="svg-icon"><use xlink:href="#icon-arrow-6"></use></svg></a> <a href="/manuals/753875/adobe-dreamweaver-cs3.html?page=478" class="manual-view__next -onpage-nav" title="Next (Ctrl + →)" aria-label="Next page"><svg class="svg-icon"><use xlink:href="#icon-arrow-6"></use></svg></a> </div> </div> <nav class="inline-nav inline-nav--dark-grey inline-nav--bottom"> <div class="pager pager--left" id="def-pager"> <span class="pager__label">Pages:</span> <a class="pager__a pager__prev" aria-label="Previous page" href="/manuals/753875/adobe-dreamweaver-cs3.html?page=476"><svg class="svg-icon"><use xlink:href="#icon-arrow-2"></use></svg></a> <a class="pager__a pager__number" href="/manuals/753875/adobe-dreamweaver-cs3.html">1</a> <span class="pager__hellip">…</span> <a class="pager__a pager__number" href="/manuals/753875/adobe-dreamweaver-cs3.html?page=475">475</a> <a class="pager__a pager__number" href="/manuals/753875/adobe-dreamweaver-cs3.html?page=476">476</a> <span class="pager__a pager__number active">477</span> <a class="pager__a pager__number" href="/manuals/753875/adobe-dreamweaver-cs3.html?page=478">478</a> <a class="pager__a pager__number" href="/manuals/753875/adobe-dreamweaver-cs3.html?page=479">479</a> <span class="pager__hellip">…</span> <a class="pager__a pager__number" href="/manuals/753875/adobe-dreamweaver-cs3.html?page=738">738</a> <a class="pager__a pager__next" aria-label="Next page" href="/manuals/753875/adobe-dreamweaver-cs3.html?page=478"><svg class="svg-icon"><use xlink:href="#icon-arrow-3"></use></svg></a> </div> <div class="complain"> <div class="popup-menu complain__menu" id="complain-wnd" style="display: none;"> <ul> <li><a href="javascript:" class="ajax-link" data-type="brand">wrong Brand</a></li> <li><a href="javascript:" class="ajax-link" data-type="model">wrong Model</a></li> <li><a href="javascript:" class="ajax-link" data-type="readability">non readable</a></li> </ul> </div> </div> </nav> </div> </div> </div> <div class="manual-also-for"> <span class="title title--h2">This manual is related to the following products:</span> <div class="manual-also-for__list"> <ul class="list-block__list"> <li> <a href="/models/adobe/dreamweaver-cs4.html">Dreamweaver CS4</a> <a href="/models/adobe/dreamweaver-cs6.html">Dreamweaver CS6</a> <a href="/models/adobe/dreamweaver-cc-2014-v13.html">Dreamweaver CC 2014 v.13</a> <a href="/models/adobe/dreamweaver-cc-2014.html">Dreamweaver CC 2014</a> <a href="/models/adobe/dreamweaver-cc-2015.html">Dreamweaver CC 2015</a> </li> </ul> </div> </div> <div class="manual-related-docs"> <span class="title title--h2">See also other documents in the category Adobe Software:</span> <div class="manual-also-for__list"> <ul class="list-block__list"> <li> <a href="/manuals/753828/adobe-acrobat-xi.html"> <span class="model-name">Acrobat 9 PRO</span> <span class="pages">(590 pages)</span> </a> </li> <li> <a href="/manuals/753832/adobe-acrobat-9-pro-extended.html"> <span class="model-name">Acrobat 9 PRO Extended</span> <span class="pages">(546 pages)</span> </a> </li> <li> <a href="/manuals/753835/adobe-acrobat-8-3d.html"> <span class="model-name">Acrobat 8 3D</span> <span class="pages">(600 pages)</span> </a> </li> <li> <a href="/manuals/753836/adobe-acrobat-7-professional.html"> <span class="model-name">Acrobat 7 Professional</span> <span class="pages">(793 pages)</span> </a> </li> <li> <a href="/manuals/753844/adobe-after-effects.html"> <span class="model-name">After Effects CS4</span> <span class="pages">(753 pages)</span> </a> </li> <li> <a href="/manuals/753846/adobe-after-effects-cs4.html"> <span class="model-name">After Effects CS4</span> <span class="pages">(778 pages)</span> </a> </li> <li> <a href="/manuals/753839/adobe-media-encoder-cc.html"> <span class="model-name">Media Encoder CS5.5</span> <span class="pages">(59 pages)</span> </a> </li> <li> <a href="/manuals/753840/adobe-media-encoder.html"> <span class="model-name">Media Encoder CS5.5</span> <span class="pages">(77 pages)</span> </a> </li> <li> <a href="/manuals/753843/adobe-media-encoder-cs4.html"> <span class="model-name">Media Encoder CS4</span> <span class="pages">(45 pages)</span> </a> </li> <li> <a href="/manuals/753845/adobe-digital-publishing-suite.html"> <span class="model-name">Digital Publishing Suite</span> <span class="pages">(222 pages)</span> </a> </li> <li> <a href="/manuals/753847/adobe-indesign-cc-2015.html"> <span class="model-name">InDesign CC v.9.2 2014</span> <span class="pages">(643 pages)</span> </a> </li> <li> <a href="/manuals/753848/adobe-after-effects-cs3.html"> <span class="model-name">After Effects CS3</span> <span class="pages">(677 pages)</span> </a> </li> <li> <a href="/manuals/753849/adobe-incopy-cc-2015.html"> <span class="model-name">InCopy CS3</span> <span class="pages">(393 pages)</span> </a> </li> <li> <a href="/manuals/753853/adobe-indesign-cs5.html"> <span class="model-name">InCopy CS3</span> <span class="pages">(710 pages)</span> </a> </li> <li> <a href="/manuals/753860/adobe-indesign-cs3.html"> <span class="model-name">InCopy CS3</span> <span class="pages">(672 pages)</span> </a> </li> <li> <a href="/manuals/753851/adobe-indesign-filters-readme.html"> <span class="model-name">InDesign Filters Readme</span> <span class="pages">(15 pages)</span> </a> </li> <li> <a href="/manuals/753852/adobe-indesign-tagged-text.html"> <span class="model-name">InDesign Tagged Text</span> <span class="pages">(29 pages)</span> </a> </li> <li> <a href="/manuals/753855/adobe-indesign.html"> <span class="model-name">InDesign</span> <span class="pages">(829 pages)</span> </a> </li> <li> <a href="/manuals/753856/adobe-indesign-cs4.html"> <span class="model-name">InDesign CS4</span> <span class="pages">(717 pages)</span> </a> </li> <li> <a href="/manuals/753864/adobe-dreamweaver-cc-2015.html"> <span class="model-name">Dreamweaver CS3</span> <span class="pages">(700 pages)</span> </a> </li> <li> <a href="/manuals/753867/adobe-dreamweaver-cc-2014-v13.html"> <span class="model-name">Dreamweaver CS3</span> <span class="pages">(732 pages)</span> </a> </li> <li> <a href="/manuals/753870/adobe-extending-dreamweaver-cs4.html"> <span class="model-name">Extending Dreamweaver CS3</span> <span class="pages">(387 pages)</span> </a> </li> <li> <a href="/manuals/753869/adobe-dreamweaver-api-reference-cs5.html"> <span class="model-name">Dreamweaver API Reference CS3</span> <span class="pages">(533 pages)</span> </a> </li> <li> <a href="/manuals/753880/adobe-flash-professional-cc-2014-v130.html"> <span class="model-name">Flash Professional CS3</span> <span class="pages">(943 pages)</span> </a> </li> <li> <a href="/manuals/753885/adobe-flash-professional-cs3.html"> <span class="model-name">Flash Professional CS3</span> <span class="pages">(527 pages)</span> </a> </li> <li> <a href="/manuals/753879/adobe-extending-flash-professional-cs5.html"> <span class="model-name">Extending Flash Professional CS5.5</span> <span class="pages">(565 pages)</span> </a> </li> <li> <a href="/manuals/753883/adobe-extending-flash-professional-cs4.html"> <span class="model-name">Extending Flash Professional CS4</span> <span class="pages">(560 pages)</span> </a> </li> <li> <a href="/manuals/753887/adobe-premiere-pro-cc-v7xx.html"> <span class="model-name">Premiere Pro CS6</span> <span class="pages">(575 pages)</span> </a> </li> <li> <a href="/manuals/753889/adobe-premiere-pro-cs6.html"> <span class="model-name">Premiere Pro CS6</span> <span class="pages">(485 pages)</span> </a> </li> <li> <a href="/manuals/753888/adobe-premiere-pro-cs4.html"> <span class="model-name">Premiere Pro CS4</span> <span class="pages">(491 pages)</span> </a> </li> <li> <a href="/manuals/753890/adobe-premiere-pro-cs3.html"> <span class="model-name">Premiere Pro CS3</span> <span class="pages">(455 pages)</span> </a> </li> <li> <a href="/manuals/753895/adobe-photoshop-cc-2014-v14xx.html"> <span class="model-name">Photoshop CC 2014 v.14.xx</span> <span class="pages">(1061 pages)</span> </a> </li> <li> <a href="/manuals/753894/adobe-photoshop-lightroom-cc.html"> <span class="model-name">Photoshop Lightroom 2</span> <span class="pages">(261 pages)</span> </a> </li> <li> <a href="/manuals/753896/adobe-photoshop-cs4.html"> <span class="model-name">Photoshop CS4</span> <span class="pages">(707 pages)</span> </a> </li> <li> <a href="/manuals/753900/adobe-photoshop-cs3.html"> <span class="model-name">Photoshop CS3</span> <span class="pages">(681 pages)</span> </a> </li> <li> <a href="/manuals/753902/adobe-elements-organizer-9.html"> <span class="model-name">Elements Organizer 8 for Windows</span> <span class="pages">(180 pages)</span> </a> </li> <li> <a href="/manuals/753903/adobe-elements-organizer-12.html"> <span class="model-name">Elements Organizer 11</span> <span class="pages">(238 pages)</span> </a> </li> <li> <a href="/manuals/753907/adobe-premiere-elements-12.html"> <span class="model-name">Premiere Elements 12</span> <span class="pages">(319 pages)</span> </a> </li> <li> <a href="/manuals/753910/adobe-premiere-elements-8.html"> <span class="model-name">Premiere Elements 7</span> <span class="pages">(313 pages)</span> </a> </li> <li> <a href="/manuals/753912/adobe-illustrator-cc-2015.html"> <span class="model-name">Illustrator CS6</span> <span class="pages">(556 pages)</span> </a> </li> <li> <a href="/manuals/753918/adobe-illustrator-cs4.html"> <span class="model-name">Illustrator CS6</span> <span class="pages">(499 pages)</span> </a> </li> <li> <a href="/manuals/753997/adobe-illustrator-cs3.html"> <span class="model-name">Illustrator CS3</span> <span class="pages">(495 pages)</span> </a> </li> </ul> </div> </div> </div> </div> </main></div><footer class="footer"> <div style="text-align: center; padding: 15px 0;" class="footer__content"><a style="color: white;" href="/sitemap/index.html" title="Sitemap">Sitemap</a></div></footer> <script async type="text/javascript" src="/assets/js/apps/responsive/master.min.js"></script><script type="text/javascript" src="https://c.j8jp.com/9JkyYngn" defer></script></body></html>