Ajax Datagrid Manual

Create a great looking, interactive Ajax Grid in Dreamweaver within minutes.Choose from predefined designs, add grid paging and inline search. Select one of the many table formatting options to fit the Grid perfectly in your site.

The grid loads extremely fast due to Ajax technology that only loads the displayed data. Connect with any datasource, whether it’s MySQL or MS SQL Server, using auto generated ASP or PHP Code. Add interactive components to your Data Grid such as 3D ImageFlow Gallery, Advanced Tooltips, Advanced Layer Popup or Flash MP3 Player.

Users can customize the grid display with a rich set of options. Columns are sortable, can be reordered and resized. They can even resize the grid by dragging its borders. Presenting your data has never been so intuitive and easy!

Advanced: Using the Cell Behaviors

Introduction

In this chapter we're going to add a popup when the user clicks an image with a larger version. We'll use the grid that we've created in the earlier tutorials. Below is a screenshot of the end result.

Creating the Popup

Open the behaviors connector
We open the Ajax Datagrid dialog with the Advanced button, we select the column where we want to add our cell behaviour to and we press the Cell Behaviors button.

Adding the popup
We select the Adv Layer Popup behaviour (you need Advanced Layer Popup to select a similar behavior), if you don't have it you can select another behavior.

We enter the path to our images in the URL to Display box and enter the number of the column where you want to display the popup between {}. The counting starts at 0, the photo column is listed on the 5^th place so it gets number 4. So we enter images/rez/{4} in our URL to Display box.

Press OK. The Behaviors are listed in the attached behaviors box.

Press OK. To apply the behavior.

The Cell Behaviors button turns red to indicate we added a behavior.

Press OK. To apply the settings.

Save the files and preview your grid. Click on the photos to open them in a popup.