Use Spry to Page Forward and Backward Through Records - A Simple Tutorial

In mid-December, Adobe released Spry 1.4 (see: http://labs.adobe.com/technologies/spry/). Spry is Adobe's ajax framework, enabling developers to build web pages with dynamic regions. Shortly before Christmas, the Spry developers posted a SpryPagedView JavaScript class and a sample of how to use the class. The SpryPagedView class provides the capability to page forward and backward through a Spry DataSet.

The Adobe sample using the SpryPagedView class is available here: http://labs.adobe.com/technologies/spry/samples/data_region/SpryPagedViewSample.html. Adobe's excellent sample include additional Spry features (filtering, master-detail data sets). I wanted to create my own sample and tutorial that just focused on using the SpryPagedView class to page through a DataSet. You can view my sample here: /spry/pagedDataSet/testpaging.cfm.

[More]

Grouping ColdFusion Query Results On Multiple Columns

I needed to display the results of a ColdFusion query grouped by the person's last name, then grouped by the person's areas of experties, and then by the roles for each area. I knew that the group attribute of the cfoutput tag allowed you to group the output (see ColdFusion 7 Online Documentation), but I thought--incorrectly-- that you could only group on one of the query columns.

[More]

Dynamically Create RadioButtons In Flex

Flex provides the RadioButtonGroup and RadioButton components which can be used to display radio buttons and restrict the selection to only one of the radio buttons. The Flex 2.0 Developer's Guide provides instructions on how to use the RadioButtonGroup and RadioButton controls. However, developers may want to dynamically create the RadioButtons based on information stored in a database or XML file.

This tutorial describes how to create multiple radio buttons using data pulled from a database. The database table stores the information used for the RadioButton component's value and label attributes. Thus, if I update the database table, the Flex application will display the new number of RadioButton components each having the correct information for the value and label attributes. You can view a demo application here: /flex/radiobtncontroltest/bin/RadioBtnControlTest.html (right click on the demo to view the MXML source).

[More]

How To Use Spry's Spry.utils.updateContent Function To Update Content Without Reloading The Web Page

Adobe released update 1.4 to their Spry ajax framework. You can learn more about Spry and download the 1.4 release here: http://labs.adobe.com/technologies/spry/. I'm impressed with Spry and how easy Spry makes complex ajax functions and DOM manipulation.

New in Spry release 1.4 is a JavaScript function called Spry.utils.updateContent that you can use to update content in a web page without having to reload the entire page. The documentation for the various Spry capabilities (dataset functions, utility functions, widgets, and effects) has been much improved in this release. However, besides a sample web page that uses Spry.utils.updateContent, this function is not clearly explained in the documentation provided with release 1.4 (at least I could not find it - if there is documentation for this function please post a link to it in a comment).

[More]

Relate Two ComboBoxes In Flex: My Example and Your Suggestions For Improvement

I'm working on an internal Flex application that requires two ComboBoxes. The user's selection in one ComboBox determines the values displayed in the other ComboBox. This post describes my initial solution and seeks any comments improving how I relate the two ComboBoxes. To demonstrate my solution go to: http://www.stfm.org/flex/relateComboBoxes/bin/relateComboBoxes.html (right click to view source).

[More]

How To Get Text To Wrap Correctly In A Flex DataGrid Column

Today I ran across a frustrating problem with the Flex 2.0 DataGrid component. The text in my columns would not wrap, even though I had set the wordWrap attribute to true for the columns. I had used the wordWrap attribute in my other DataGrid components to force the text to wrap to the next line if the text was too long to fit on one line given the width of the column.

I coded my DataGrid as below:

<mx:DataGrid width="100%" height="100%" id="submissionsDG" dataProvider="{submissionsViewAryCol}"
fontFamily="Verdana" fontSize="10">

<mx:columns>
<mx:DataGridColumn dataField="submissionid" width="80" headerText="Sub #"/>

<mx:DataGridColumn dataField="presenter" width="100" headerText="Main Presenter" />

<mx:DataGridColumn dataField="title" width="220" headerText="Title" wordWrap="true"/>
</mx:columns>
</mx:DataGrid>

But after careful inspection I noticed that sometimes the text in my "Title" column would wrap correctly and sometimes the text would not wrap, the title would just be cut off. After some trial and error, it appears that if the first row's title needs to be wrapped given the width of the column then all the titles will wrap correctly. But if the first row's title doesn't need to wrap given the width of the column, then none of the other titles will wrap.

[More]

Processing XML in Flex 2.0 Using The For Each Statement And The Descendent Accessor (..) Operator

This example demonstrates using the for each..in statement and the descendent accessor (..) operator to easily traverse an XML object in Flex 2.0 and ActionScript 3.0. Additionally, I'll touch on the importance of class Namespace when using the e4x XML processing format.

You can view a Flex demonstration application releated to this blog entry (right click to view source) here:

/flex/xmlForEach/bin/xmlForEach.html

[More]

BlogCFC was created by Raymond Camden. This blog is running version 5.1.004.