200 likes | 284 Views
Energizing Your Business On The Web. CFFORM Enhancements Presentation to MDCFUG Simon Horwith, CIO. Overview. Who Am I? General Overview – What’s New with CFFORM in CFMX 7? New Controls Tree, Select, Grid, Calendar New Formats Flash, XML New Layout Controls New Validation
E N D
CFFORM Enhancements Presentation to MDCFUG Simon Horwith, CIO
Overview • Who Am I? • General Overview – What’s New with CFFORM in CFMX 7? • New Controls • Tree, Select, Grid, Calendar • New Formats • Flash, XML • New Layout Controls • New Validation • Form, CFParam, isValid(), scriptprotect • New Look • Skins, CSS • Performance Considerations BG Text
CIO – AboutWeb, LLC Editor in Chief, ColdFusion Developer’s Journal Member of Team Macromedia Macromedia Certified Master Instructor Who Am I?
New Formats - Flash and Xforms New Controls – Calendar, Flash Grids and Select boxes, DatePicker New Layout Model – similar to Flex New Validation – new validation types, new methods of validating, new CFParam functionality, new isValid() method, XSS prevention, AND CONSISTENCY! Support for CSS and Skins! New Performance Best Practices General Overview – What’s new ?
CFTREE - Flash, XML, and data formats CFSELECT - Flash Format CFGRID – Flash and XML Format CFCALENDAR Date Picker New Controls
Flash – uses special edition of Flex 1.5 XML (XForms) – many XSLT templates out of the box, or write your own! <CFFORM> “format” attribute HTML Layout (Tables) not used in XML or Flash Forms New Formats
Label Attribute of form controls to define labels <CFFORMGROUP> groups controls (* - flash only) New Formats - Layout
<CFFORMGROUP> tags can be nested to create complex layouts <CFFORMITEM> creates spaces, horizontal rules, vertical rules, and simple text output! Like <CFFORM> controls, these can be dynamically generated and attributes dynamically populated New Formats – Layout cont’d
Pretty much every <CFFORM> control, including <CFFORMGROUP> and <CFFORMITEM> has attributes: toolTip Visible enabled Height/width Style New Layouts
Data validation types: New Validation
New Validation Locations: Validateat onBlur onServer onSubmit New Events (work for most elements): New Validation cont’d
Hidden Fields for Server-Side Validation New Validation – cont’d
You can now “mask” fields - VERY COOL A represents letters 9 represents numbers X represents alpha-numerics ? represents any other single character All other characters represent themselves New Validation cont’d
Flash forms support: AS 2 in the onEvents and expose all of the control values as well as the AS 2 core libraries The ability to “bind” controls with their “bind” attribute. Bind in one control means it’s value derives from another when the other changes. Syntax for a typical bind: {formcontrol.text} For more on the syntax, read the Flex and AS 2 documentation http://livedocs.macromedia.com/flex/15/asdocs_en/asdoc-title.html New Validation cont’d
<CFPARAM> - supports all the new datatypes AND “xml,query,variableName,”, has pattern, max, and min attributes <CFPARAM> will throw an exception if validation fails! New - isValid() function can be used to validate whether or not a value matches any of the datatypes supported by <CFFORM> and <CFPARAM> <CFAPPLICATION> “scriptprotect” attribute prevents XSS (Cross-Site Scripting) New Validation cont’d
<CFFORM> and it’s controls and layout tags support: Skins XML forms supports about 10 skins and you can write your own using CSS and XSL! Flash supports about 4 or 5 “halo” skins CSS Styles XML shouls have full CSS 2 support Flash supports MOST CSS 1 and 2 (not positioning) and has several “extra” styles New Look
Now you can specify the locations of your skins (XML only – ‘skin’), JS SRC (‘scriptSrc’), and applet (‘codebase’) document locations in <CFFORM> Default location for skins is cfusion-ear\cfusion-war\CFIDE\scripts\ (css and xsl subdirectories) <CFFORM> “accessible” attribute makes Flash screen reader accessible (adds 80K) Specify whether to show a preloader (Flash) Control Z-Index and transparency of Flash forms with ‘wMode’ attribute – “window”, “transparent”, “opaque” Other neat stuff
Generating Flash requires compilation To avoid recompilation, only make data dynamic – not attributes or layout If you need to loop (not recommended for 10+ iterations or 5+ elements) use <CFFORMGROUP type=“repeater”> Caching Data: CF stores flash form values in memory when it generates a form <CFFORM> “timeout” is a number of seconds CF stores the data in memory If cache is expired or 0, the user receives “data expired” message and is asked to reload the page Set to 0 for sensitive data that shouldn’t be cached Performance Considerations
The End! Feel free to email questions/comments to shorwith@aboutweb.com Ta-Da!