CFForm xml forms

Posted At : December 4, 2006 12:04 PM | Posted By : Mike Nimer
Related Categories: ColdFusion, CFForm XML Skins, CFForm

Sure it's a slow adoption feature in ColdFusion, but it hasn't been forgotten. And those that know how to use it - love it.

Wim Dewijngaert @ http://cfform.dewijngaert.be has created a number of great DHTML components that work with CFForm (format="xml").

So if you've already discovered the hidden power in xml forms or have been meaning to use them - go take a look and try some of them out.

I knew that people would eventually start posting components/xsl skins for cfform. Does anyone else have any that they would like to post (they aren't hard to make).

Comments (2) | Print | Send | del.icio.us | Digg It! | Linking Blogs | 7702 Views

FCKEditor for CFTextarea

Posted At : June 20, 2005 11:54 PM | Posted By : Mike Nimer
Related Categories: CFForm XML Skins

This is an fckeditor rule for the XML Forms in ColdFusion 7+. Using this rule with cfform allows you to easily switch between the standard html textarea or the richer fckeditor editor.

Requires ColdFusion 7

Includes the FCKEditor 2.0 Final Canidate

See the "ColdFusion startup.txt" file for install instructions.

All fckeditor attributes are supported as attributes to the cftextarea tag. For instance to change the default toolbars to the use the basic toolbar and to set a specific height and width all you need to do is use the fckeditor properties as attributes.

View Example

<cfform format="XML" skin="basic">
<cfinput type="Text" name="fname" label="First Name">
<cfinput type="Text" name="lname" label="Last Name">
<cfinput type="Text" name="email" label="Email">
<cftextarea name="bio" editor="fckeditor"></cftextarea>
</cfform>

Comments (21) | Print | Send | Download | del.icio.us | Digg It! | Linking Blogs | 6497 Views

Multi-Step Wizard

Posted At : March 25, 2005 8:39 PM | Posted By : Mike Nimer
Related Categories: CFForm XML Skins

This skin rule will create a multi-step wizard interface. It does this by using layered divs, each next button will show/hide the correct layers, allowing a user to walk through the form steps and submit all the steps as 1 form.

Installation: To Install, unzip this into your /CFIDE folder. Then edit the skin you would like to use this with, and add an xsl:include to the file.

View Example

<cfform name="form1" format="xml" skin="./basic.xsl">
    <cfformgroup type="wizard">
        <cfformgroup type="wizardstep" label="Personal Info" addButtons="false">
            <cfformgroup type="vertical">
            <cfformgroup type="horizontal" label="Name">
                <cfinput type="Text" name="fname" value="" size="10">
                <cfinput type="Text" name="lname" value="" size="10">
            </cfformgroup>
            <cfinput type="Text" name="email" label="Email:" size="27" value="">            
            </cfformgroup>
        </cfformgroup>
        <cfformgroup type="wizardstep" label="Billing Info">
            <cfformgroup type="vertical">
            
            <cfinput type="Text" name="billing_address1" label="address 1:" value="" size="30">
            <cfinput type="Text" name="billing_address2" label="address 1:" value="" size="30">
            
            <cfformgroup type="horizontal" label="City/State/Zip">
                <cfinput type="Text" name="billing_city" value="" size="8">
                <cfselect name="billing_state">
                    <option value="ca">CA</option>
                    <option value="ut">UT</option>
                </cfselect>
                <cfinput type="Text" name="billing_zip" value="" size="8">
            </cfformgroup>
            
            </cfformgroup>
        </cfformgroup>
        <cfformgroup type="wizardstep" label="Shipping Info">
            <cfformgroup type="vertical">
            
            <cfinput type="checkbox" name="sameAsBilling" label="Same As Billing">
            <cfinput type="Text" name="shipping_address1" label="address 1:" value="" size="30">
            <cfinput type="Text" name="shipping_address2" label="address 2:" value="" size="30">
            
            <cfformgroup type="horizontal" label="City/State/Zip">
                <cfinput type="Text" name="shipping_city" value="" size="8">
                <cfselect name="shipping_state">
                    <option value="ca">CA</option>
                    <option value="ut">UT</option>
                </cfselect>
                <cfinput type="Text" name="shipping_zip" value="" size="8">
            </cfformgroup>
            
            </cfformgroup>
        </cfformgroup>    
    </cfformgroup>
</cfform>

Comments (6) | Print | Send | Download | del.icio.us | Digg It! | Linking Blogs | 3566 Views

Related Select List

Posted At : March 9, 2005 9:16 PM | Posted By : Mike Nimer
Related Categories: CFForm XML Skins

This is a unique way of using the xml cftree to map each level of the tree to a select list, generating related select lists. This can be 1-x levels deep, supporting an unlimited number of related select lists. IE Only


To Install, unzip this into your /CFIDE folder. Then edit the skin you would like to use this with, and add an xslinclude to the file.

<xsl:include href="samples/_relatedselectlists.xsl" />

View Example

<cfformgroup type="vertical_relatedselectlists">
    <cftree
        name="select1"
        format="xml">
        <cftreeitem value="land">
            <cftreeitem value="car" parent="land">
                <cftreeitem value="ford" parent="car">
                <cftreeitem value="chevy" parent="car">
                <cftreeitem value="train" parent="land">
                <cftreeitem value="amtrak" parent="train">
                <cftreeitem value="Thomas the Train" parent="train">
                    <cftreeitem value="blue" parent="Thomas the Train">
        <cftreeitem value="sea">
        <cftreeitem value="motorboat" parent="sea">
        <cftreeitem value="sailboat" parent="sea">
            <cftreeitem value="dingy" parent="sea">
        <cftreeitem value="air">
            <cftreeitem value="plane" parent="air">
            <cftreeitem value="blimp" parent="air">
            <cftreeitem value="glider" parent="air">
    </cftree>
    <cfselect name="item1" style="width:150;"></cfselect>
    <cfselect name="item2" style="width:150;"></cfselect>
    <cfselect name="item3" style="width:150;"></cfselect>
    <cfselect name="item4" style="width:150;"></cfselect>
</cfformgroup>

Comments (5) | Print | Send | Download | del.icio.us | Digg It! | Linking Blogs | 3432 Views

Dual Select lists - "Slush Box"

Posted At : March 9, 2005 9:03 PM | Posted By : Mike Nimer
Related Categories: CFForm XML Skins

This is a new cfformgroup type that will take 2 selects located inside the formgroup and automatically lay them out and generate the html and js needed for them to work as a dual select list or "Slush Box" control.


To Install, unzip this into your /CFIDE folder. Then edit the skin you would like to use this with, and add an xslinclude to the file.

<xsl:include href="samples/__dualselectlists.xsl" />

View Example

<cfform name="test1" format="xml" skin="demo">
    <cfformgroup type="dualselectlist">
        <cfselect name="avail" label="Available:" size="8" multiple="Yes" style="width:150;">
            <option value="CA">California</option>
            <option value="MA">Massachussets</option>
            <option value="UT">Utah</option>
            <option value="FL">Florida</option>
        </cfselect>

        <cfselect name="sel" label="Selected:" size="8" multiple="Yes" style="width:150;">
            <option value="AZ">Arizona</option>
        </cfselect>
    </cfformgroup>    
</cfform>

Comments (7) | Print | Send | Download | del.icio.us | Digg It! | Linking Blogs | 3363 Views


AIR (4) [RSS]
CF Event Gateways (3) [RSS]
CFForm (40) [RSS]
CFForm XML Skins (5) [RSS]
ColdFusion (32) [RSS]
dpHibernate (3) [RSS]
Eclipse (2) [RSS]
Flex (25) [RSS]
Flex Builder and ColdFusion (9) [RSS]
General (13) [RSS]
hibernate (1) [RSS]
Java, SpringMVC (1) [RSS]
nomee (5) [RSS]
Personal (9) [RSS]
Travel (4) [RSS]
No recent entries.