Introduction

Adobe's Spry Ajax and JavaScript framework provides web application developers with a relatively easy to use collection of dynamic tags, widgets and Ajax features. Behind the scenes, Spry can use either XML or JavaScript Object Notation (JSON) as the data source for its dynamic areas and widgets. Spry can be used with any server-side technology, including Java.

In this article I'll review how to use Java to transform a collection of Java objects into a collection of JSON objects and return the JSON objects to the browser where they can be used by Spry. I'll then show a simple Spry dynamic region that creates a table that can be sorted by each column heading. The table will contain a row for each JSON object. (Updated example includes an accordion widget and data paging)

[More]

Introduction

Spry now supports the JavaScript Object Notation (JSON) data format. You can use ColdFusion to generate JSON formatted data that can be used by Spry. One advantage of using the JSON data format over XML is the JSON format enables a smaller file size and quicker processing (see references 1 and 2). I wanted to test using JSON formatted data instead of XML with a project I was working on so I researched how to use ColdFusion to create JSON formatted data and use that data with Spry. This post provides a step-by-step tutorial to create a very simple example of using JSON formatted data with Spry.

[More]

I needed to create a web page that would show data from a database a page of data at a time and for each item shown, have a link that would dynamically load into the page--just below the item--more details about that item. The challenge was that I could not return all the details needed from the database into one dataset because of the number of items and the size of each item. It would just take too long to get back all that XML. However, by using Spry and ColdFusion I could get the additional details for an item and load it into the page after the user clicked on a link for that item. Thus the dataset I first get when the page loads can be much smaller since it doesn't have to include all the extra details for each item.

[More]

I recently needed to validate how many checkboxes a user checks on one of my forms. I decided to use the Spry checkbox validation widget. The checkbox validation widget can display error messages if a user fails to select a minimum number of checkboxes or selects more than the maximum allowed number of checkboxes. The widget can validate the form when the user clicks on the submit button or when the user changes a checkbox. Since the demo provided by Adobe for this widget doesn't show some of the different ways to use the checkbox validation widget I thought I would provide an example of the different ways you may use this widget.

[More]

Spry (Adobe's ajax/dhtml javascript library) "pre-release"1.5 is now available on Adobe labs. New in this release are JSON and HTML data sets, changes in the effects model, and new widgets. There is now avalilable an Application Program Interface document for Spry and additional documentation. Below are some links to the various Spry 1.5 pages on Adobe labs.

[More]

Introduction

In mid-March 2007, the Adobe Spry team provided developers with a sneak peak at the upcoming Spry 1.5 release (see reference 1). As part of this update, the Auto Suggest widget was given additional capabilities. A new feature of the Auto Suggest widget is the ability to specify a minimum number of characters before auto suggestions are shown and also to dynamically get the auto suggestions from a server, rather than from a cached data set.

The sample code provided in the Spry 1.5 Preview did not include using a ColdFusion backend that was pulling data from a database to populate the auto suggestions. So in this blog entry, I'll explore how you can use ColdFusion on the backend and Spry's updated Auto Suggest widget on the front end to handle large numbers of auto suggestions.

[More]

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]

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]

This blog entry discusses how I create a function that queries a database, transforms the query results into XML, and returns the XML in a format that can be used by either Spry (pre-release version 1.3) or Flex 2.0. ColdFusion 7 added a return type of XML (see: ColdFusion 7 documentation). However, I've had to experiment some to get my CFC functions to return XML that can be used by both Spry and Flex 2.0.

[More]

I recently had to develop a new administrative interface for our staff to use to track presenters and update their contact information. I decided to use Adobe's Spry ajax tool set to make the pages more interactive and to save time for staff. One use case I had was staff needed to be able to find a specific presenter using his last name (which is not unique among presenters) and then update his contact information.

I could have fulfilled this use case by having the staff person enter the last name, return a page with presenters matching that last name, then have the user select the specific presenter from all those with that last name, and then populate the update contact form. But I had recently been learning how to use Spry's auto suggest widget and decided to try to modify the widget so that the staff person could start typing the presenter's last name and Spry would show possible matches. Then the user could select the correct presenter and the form fields would be populated with that presenter's information. I wanted to do all these tasks without a page refresh.

[More]