Welcome!

You will be redirected in 30 seconds or close now.

ColdFusion Authors: Yakov Fain, Jeremy Geelan, Maureen O'Gara, Nancy Y. Nee, Tad Anderson

Related Topics: ColdFusion, Adobe Flex

ColdFusion: Article

ColdFusion "Real Estate Sample Application" (Part I)

Building the search functionality with Flash Forms

With the release of Macromedia ColdFusion 7 and the arrival of Flash Forms, developers were presented with an alternative to HTML forms that offered them additional functionality, such as full-featured controls not available in HTML and built-in validation.

That alone made Flash Forms appealing - and with the addition of pieces of ActionScript code, developers were able to create truly responsive forms. But because they were meant to be compatible with HTML forms, they still shared the same submit-refresh model. What if you could "submit" the form and, without a page refresh, get feedback from the server?

Enter Flash Remoting. In this series of tutorials you will learn how to create an application that allows users to search and retrieve records from a database, and then edit, add, and remove them from the database - all in one screen. Those functions will be presented in the context of a sample application, a real state management system that administers listings of properties for sale.

In Part 1 of this series, you will build the search functionality in the application.

Requirements
To complete this tutorial you will need to install the following software and files:

Prerequisite Knowledge
Basic knowledge of ColdFusion components and Flash Forms and the ability to set up a data source and write simple SQL statements.

Overview of the Real Estate Management System Sample Application
This article focuses on the search functionality of the sample application (see Figure 1).

When you open the application, a small panel on the left lets users search for a property by specifying search criteria, such as number of bedrooms or price range. The matching properties appear in a data grid in the upper-right panel, and when a user selects a property, the details appear in the lower-right panel (see Figure 2).

In the following sections you will do the following:

  1. Create the search form.
  2. Write a component to make the search query.
  3. Create a Flash Remoting service that handles the search request.
  4. Call the Flash Remoting service and show the results in a datagrid
Creating the Search Form
The whole application user interface is one Flash Form. As such, its contents are within the cfform tag:

<cfform format="flash" name="RealEstateAdmin">
<!--- form content --->
</cfform>

The only necessary attribute of the cfform tag is the format="flash" attribute to create a Flash Form. By assigning a name to the form, you will have a named scope that you can use later. You can also set the form's dimensions by using the width and height attributes.

Note: If you are familiar with the process of defining a simple Flash Form, you can skip this section.

The Search panel (see Figure 3) contains several controls, all of them enclosed in a cfformgroup tag with a type attribute of "panel":

<cfformgroup type="panel" label="Search" height="440" >
<!--- controls --->
</cfformgroup>

These are the controls contained within the Search panel:

  • The cfselect tags for Price range, Bedrooms, Bathrooms, and Minimum footage that create pop-up menus. You can populate cfselect tags from option tags, queries, or a combination of the two, as shown in this example:

    <cfselect name="search_priceRangeFrom"
    query="priceRange"
    display="label"
    value="data"
    queryposition="below">
    <option value="0">No min.</option>
    </cfselect>

    This cfselect tag uses a query called priceRange that contains two columns - data and label - which populate the search_priceRangeFrom select control. In addition, an extra option not present in the query ("No min.") is manually added using an option tag. The name you give each control is important because later you will need to reference the control name when you submit the form.

  • <cfinput type="text"> tag for "MLS number", as follows:

    <cfinput name="search_mls_id" type="text" />

  • <cfinput type="radio"> tags for "Status." You need one cfinput tag for each type of listing status (Active, Sold, Back Up Offers, New Listing). Option button tags that belong to the same group must have the same name. See the following:

    <cfinput type="radio" name="search_status" value="active" label="Active"/>
    <cfinput type="radio" name="search_status" value="backUp" label="Back Up Offers"/>
    <cfinput type="radio" name="search_status" value="sold" label="Sold"/>

  • <cfinput type="checkbox"> tags for "Amenities." You need one tag for each type of amenity (Pool, Laundry, Walk-in Closets, Fireplace). Unlike option buttons, each tag must have a different name, as follows:

    <cfinput type="checkbox" name="search_hasPool" label="Pool"/>
    <cfinput type="checkbox" name="search_hasLaundry" label="Laundry"/>
    <cfinput type="checkbox" name="search_hasFireplace" label="Fireplace"/>

  • <cfformitem type="text"> tags for additional labels or titles, as follows:

    <cfformitem type="text" style="fontWeight:bold;">Status: </cfformitem>

  • <cfinput type="button"> tag for the Search button:

    <cfinput type="button" name="search_submitBtn" value="Search" />

You must also use additional cfformgroup tags to lay out the controls. Look at the index.cfm source file in the ZIP download to see the complete code.

This small section of the application does not do anything yet. It only accepts user input of standard form controls: text inputs, option buttons, check boxes, and selects. At this point, you would normally add a Submit button to submit the form for processing on the server. But don't do that yet - wait just a moment and complete the following sections.

More Stories By Nahuel Foronda

Nahuel Foronda is one of the founders of Blue Instant (http://www.blueinstant.com), a web development firm specializing in Rich Internet Applications where he has been creating award-winning applications and offering training for the last five years. He also maintains a blog, called AS Fusion (http://www.asfusion.com), where he writes about Flash, ColdFusion and other web technologies.

More Stories By Laura Arguello

Laura Arguello is one of the founders of Blue Instant (http://www.blueinstant.com), a web development firm specializing in Rich Internet Applications where she has been creating award-winning applications and offering training for the last five years. She also maintains a blog, called AS Fusion (http://www.asfusion.com), where she writes about Flash, ColdFusion and other web technologies.

Comments (5) View Comments

Share your thoughts on this story.

Add your comment
You must be signed in to add a comment. Sign-in | Register

In accordance with our Comment Policy, we encourage comments that are on topic, relevant and to-the-point. We will remove comments that include profanity, personal attacks, racial slurs, threats of violence, or other inappropriate material that violates our Terms and Conditions, and will block users who make repeated violations. We ask all readers to expect diversity of opinion and to treat one another with dignity and respect.


Most Recent Comments
SYS-CON Belgium News Desk 01/27/06 02:58:22 PM EST

With the release of Macromedia ColdFusion 7 and the arrival of Flash Forms, developers were presented with an alternative to HTML forms that offered them additional functionality, such as full-featured controls not available in HTML and built-in validation.

SYS-CON Netherlands News Desk 01/27/06 02:33:25 PM EST

With the release of Macromedia ColdFusion 7 and the arrival of Flash Forms, developers were presented with an alternative to HTML forms that offered them additional functionality, such as full-featured controls not available in HTML and built-in validation.

SYS-CON India News Desk 01/27/06 12:09:13 PM EST

With the release of Macromedia ColdFusion 7 and the arrival of Flash Forms, developers were presented with an alternative to HTML forms that offered them additional functionality, such as full-featured controls not available in HTML and built-in validation.

SYS-CON Italy News Desk 01/27/06 11:05:16 AM EST

With the release of Macromedia ColdFusion 7 and the arrival of Flash Forms, developers were presented with an alternative to HTML forms that offered them additional functionality, such as full-featured controls not available in HTML and built-in validation.

SYS-CON India News Desk 01/27/06 10:17:12 AM EST

With the release of Macromedia ColdFusion 7 and the arrival of Flash Forms, developers were presented with an alternative to HTML forms that offered them additional functionality, such as full-featured controls not available in HTML and built-in validation.

IoT & Smart Cities Stories
Apps and devices shouldn't stop working when there's limited or no network connectivity. Learn how to bring data stored in a cloud database to the edge of the network (and back again) whenever an Internet connection is available. In his session at 17th Cloud Expo, Ben Perlmutter, a Sales Engineer with IBM Cloudant, demonstrated techniques for replicating cloud databases with devices in order to build offline-first mobile or Internet of Things (IoT) apps that can provide a better, faster user e...
In his keynote at 19th Cloud Expo, Sheng Liang, co-founder and CEO of Rancher Labs, discussed the technological advances and new business opportunities created by the rapid adoption of containers. With the success of Amazon Web Services (AWS) and various open source technologies used to build private clouds, cloud computing has become an essential component of IT strategy. However, users continue to face challenges in implementing clouds, as older technologies evolve and newer ones like Docker c...
The Founder of NostaLab and a member of the Google Health Advisory Board, John is a unique combination of strategic thinker, marketer and entrepreneur. His career was built on the "science of advertising" combining strategy, creativity and marketing for industry-leading results. Combined with his ability to communicate complicated scientific concepts in a way that consumers and scientists alike can appreciate, John is a sought-after speaker for conferences on the forefront of healthcare science,...
Disruption, Innovation, Artificial Intelligence and Machine Learning, Leadership and Management hear these words all day every day... lofty goals but how do we make it real? Add to that, that simply put, people don't like change. But what if we could implement and utilize these enterprise tools in a fast and "Non-Disruptive" way, enabling us to glean insights about our business, identify and reduce exposure, risk and liability, and secure business continuity?
To Really Work for Enterprises, MultiCloud Adoption Requires Far Better and Inclusive Cloud Monitoring and Cost Management … But How? Overwhelmingly, even as enterprises have adopted cloud computing and are expanding to multi-cloud computing, IT leaders remain concerned about how to monitor, manage and control costs across hybrid and multi-cloud deployments. It’s clear that traditional IT monitoring and management approaches, designed after all for on-premises data centers, are falling short in ...
"The Striim platform is a full end-to-end streaming integration and analytics platform that is middleware that covers a lot of different use cases," explained Steve Wilkes, Founder and CTO at Striim, in this SYS-CON.tv interview at 20th Cloud Expo, held June 6-8, 2017, at the Javits Center in New York City, NY.
"MobiDev is a Ukraine-based software development company. We do mobile development, and we're specialists in that. But we do full stack software development for entrepreneurs, for emerging companies, and for enterprise ventures," explained Alan Winters, U.S. Head of Business Development at MobiDev, in this SYS-CON.tv interview at 20th Cloud Expo, held June 6-8, 2017, at the Javits Center in New York City, NY.
The deluge of IoT sensor data collected from connected devices and the powerful AI required to make that data actionable are giving rise to a hybrid ecosystem in which cloud, on-prem and edge processes become interweaved. Attendees will learn how emerging composable infrastructure solutions deliver the adaptive architecture needed to manage this new data reality. Machine learning algorithms can better anticipate data storms and automate resources to support surges, including fully scalable GPU-c...
As IoT continues to increase momentum, so does the associated risk. Secure Device Lifecycle Management (DLM) is ranked as one of the most important technology areas of IoT. Driving this trend is the realization that secure support for IoT devices provides companies the ability to deliver high-quality, reliable, secure offerings faster, create new revenue streams, and reduce support costs, all while building a competitive advantage in their markets. In this session, we will use customer use cases...
Machine learning has taken residence at our cities' cores and now we can finally have "smart cities." Cities are a collection of buildings made to provide the structure and safety necessary for people to function, create and survive. Buildings are a pool of ever-changing performance data from large automated systems such as heating and cooling to the people that live and work within them. Through machine learning, buildings can optimize performance, reduce costs, and improve occupant comfort by ...