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!
Overview
Features highlights:
- Dependent Grids
- Row behaviors
- Full unicode support
- Support for views
- Customized error handling
- Customize the grid any way you want it
Destination Availability Demo
In this demo we used CSS edited and customized Universal CSS Navigation Menu, DMXzone Lightbox that the images are opening in and DMXzone Google Maps that shows the hotel's location. The Ajax Datagrid displays the hotels' details and can be sorted by hotel name, rating and price.
Facebook Christmas Catalog Demo
In this demo you can see how
easy it is to create a product catalog using 3 Dreamweaver extensions.
All products are displayed in the updated Ajax DataGrid and on click a DMXzone Lightbox opens to preview a bigger image. Also the tab is wrapped with the help of Facebook Fan Page.
Upcoming Events Demo
In this demo you can see how easy it is in an event calendar to display additional info, which is placed in a grid.
Laptop Grid Slideshow
New Demo
Click(on a non-blurred date) to see the Events for each day of the festival.
Demo - Connect Two Ajax DataGrids Together and Include an Editor
The Latest Demo displays two dependent Ajax DataGrids. Select an e-Magazine in the top grid and the second grid automatically lists its articles. New: You can edit the description of the articles using Advanced HTML Editor 2 by clicking on it.
Features
Features in Detail
Presenting your data has never been so intuitive and easy!
- New: Dependent Grids
Visually link two grids together to create a master/detail relationship
- New: Row Behaviors
Add any action with the DMXzone behavior connector on the grid row
- New: Runtime Filtering
Filter the grid based on input from any other grid or form field on the page
- New: Full Unicode Support
Your grids (including filters) can display any foreign characters
- New: Extended Grid Filtering
Specify dynamic filters based on a query string, cookies or session variables
- New: Support for Views
Use more then just tables from your database, use views for more complicated queries
- New: Improved Security
The generated Ajax Service handles its inputs more secure, blocking various SQL injection attacks
- New: Customized Error Handling
In Case of problems with the Ajax service, you'll get a full error report in your grid
- New: Optimized Performance
Various Server Side Speed Optimalizations, Especially When Using Microsoft Access Databases
- Create a cool Ajax DataGrid in seconds
Create a great looking, interactive Ajax Grid in Dreamweaver without coding.
- Customize the grid any way you want to
- Give your DataGrid a sleek and stylish look with one of the predefined styles.
- Columns are sortable, can be reordered and resized.
- Resize the grid by dragging its borders.
- Select one of the many table formatting options to fit the Grid perfectly in your site.
- Choose from a rich set of navigation options that include paging, searching and filtering options.
- You can customize the content/images inside your table with formatting, alignment, width, and more.
- Choose to highlight rows or columns, wrap cells, and set opacity while loading.
- Enable the users to collapse the grid.
- Ajax Technology
The grid loads extremely fast due to Ajax technology that only loads the displayed data. - Connectivity
Connect with any datasource, whether it’s MySQL or MS SQL Server, using auto generated ASP or PHP Code. Use an intuitive interface to browse trough your database and select the table and columns you would like to display.
- Accessibility
- Inline search enables users to quickly find any content they are looking for
- Search and sort content
- Use Behaviors to control your table from your page.
- Fully integrated in Dreamweaver
Configure the grid with a great looking dialog that visually displays all options. No coding is required.
- Fully PC and MAC (OSX and Leopard) compatible.
- Accessible property inspector for easy editing
The property inspector enables you to change several options directly.
- Interoperability
- Add interactive components and behaviors to your Data Grid such as 3D ImageFlow Gallery, Advanced Tooltips, Advanced Layer Popup or Flash MP3 Player.
- Control the grid with your own customized interface, using behaviors.
Showcases
Laptop Grid Slideshow
New Demo
Click(on a non-blurred date) to see the Events for each day of the festival.
Demo - Connect Two Ajax DataGrids Together and Include an Editor
The Latest Demo displays two dependent Ajax DataGrids. Select an e-Magazine in the top grid and the second grid automatically lists its articles. New: You can edit the description of the articles using Advanced HTML Editor 2 by clicking on it.
Ajax DataGrid Teams Up with Advanced Layer Popup and Advanced Tooltips
In this Demo the grid is integrated with Advanced Layer Popup and Advanced Tootltips. Click on the planes for a larger version in a popup.
Another Cool AjaxGrid Demo
Check out the LIVE demoof a basic Ajax Grid:
-
Destination Availability Showcase
In this showcase we used CSS edited and customized Universal CSS Navigation Menu, DMXzone Lightbox that the images are opening in and DMXzone Google Maps that shows the hotel's location. The Ajax ...
-
Facebook Christmas Catalog Showcase
In this showcase you can see how easy it is to create a product catalog using 3 Dreamweaver extensions. All products are displayed in the updated Ajax DataGrid and on click a DMXzone Lightbox opens ...
-
Upcoming Events Showcase
In this showcase you can see how easy it is in an event calendar to display additional info, which is placed in a grid.
-
Advanced HTML Editor 3 Meets Ajax DataGrid and DMXzone Lightbox
The Ajax DataGrid shows the database records that contain the movie images and description. In order to edit the description, simply double click the record and the DMXzone Lightbox will popup ...
-
HTML5 Slideshow & Ajax DataGrid
In this showcase you can see how easy it is in an event calendar to display additional info, which is placed in a grid.
-
Wacken 2009 Lineup Showcase
Click(on a non-blurred date) to see the Events for each day of the festival.
-
20th Anniversary Wacken
Click on a non-blurred date in the Calendar in order to see the events for each day of the festival. For band info click on the row.
-
Universal Datagrid Exporter Showcase
Exporting Ajax DataGrid to a PDF with the help of Universal Data Exporter ASP. This showcase shows how the Ajax DataGrid can be exported to a PDF. You can customize the table appearance(sort, move ...
-
Grid Sound Bundle Showcase
We combine the Flash MP3 Player with Ajax Datagrid to create an interactive grid with songs. Browse for your favorite track using the grids navigation. You can also use the search function to filter ...
-
Ajax DataGrid Teams Up with Layer Popup and Tooltips
In this demo the grid is integrated with Advanced Layer Popup and Advanced Tootltips. Click on the planes for a larger version in a popup.
-
Old Cars Collection Showcase
Check out the LIVE showcase of a basic Ajax Grid:
Videos
Add, Edit and Delete Functionality Part 3
In the last part
of the series we will show you how to add the Edit and Delete buttons
functionality. You can download the source code for this video tutorial
from the right sidebar.
Add, Edit and Delete Functionality Part 2
In the second part of this series we're going to show you how to add an "Add new" record button on your Ajax Datagrid page that opens an insert record page within a DMXzone Lightbox.
Add, Edit and Delete Functionality Part 1
In the first part of the movie series we are going to show you how to setup your database and how to add Edit and Delete icons in Ajax Datagrid.
Controlling HTML5 Slideshow with Ajax DataGrid
With this movie we will show you how to control HTML5 Slideshow using Ajax DataGrid and Behavior Connector.
Refreshing your Ajax DataGrid Automatically
In this movie we will show you how to refresh your Ajax DataGrid automatically without user interaction.
Creating an Interactive Grid
This movie tutorial shows how to create an interactive grid using Ajax DataGrid .
Using the Behavior Connector in Ajax Datagrid
This movie presents the different datasources, customizable details and how to use the Behavior Connector.
Make Virtual Table from two MS SQL Tables
In this movie we will show you how to make a virtual table from two MS SQL tables and present the result in Ajax DataGrid.
Filter the Ajax DataGrid by a date from the DMXzone Calendar
In this video we will show you how easily you can filter the contents of your Ajax DataGrid by date from the DMXzone Calendar.
Make a Virtual Table from two MySQL Tables
In this movie we will show you how to make a virtual table from two MySQL tables and present the result in Ajax DataGrid.
Connect Two Ajax Datagrids Together
This movie shows how you can create a master/detail grid as displayed above.
Creating A Basic Datagrid
This movie shows how easy you can create an interactive grid using Ajax Datagrid. We'll present the basic features of this Dreamweaver Extension including interface options, creating a database connection and grid customization.
Make Your DataGrids Printable
MySQL Tables presented Via DMXzone Ajax DataGrid
Refreshing your Ajax DataGrid Automatically
Using the Ajax DataGrid
Using DMXzone Colorpicker Behaviors
Using DMXzone Slider to Filter Ajax Datagrid
Add, Edit and Delete Functionality in Ajax Datagrid Part 3
Add, Edit and Delete Functionality in Ajax Datagrid Part 2
Add, Edit and Delete Functionality in Ajax Datagrid Part 1
Controlling HTML5 Slideshow with Ajax DataGrid
Requirements
History
Version 1.1.1
- jQuery 1.7.2 included
- Improved Dreamweaver CS6 compatibility
- Improved javascript file compression for smaller and faster file loading
- Improved extension installation
Version 1.1.0
- Greatly improved all row and column behaviors
- Various source file optimizations for smaller size
Version 1.0.9
- Improved compatibility with newest jQuery 1.6+ versions
- Included latest jQuery 1.6.3
- Optimized source and files for smaller size
- Improved automatic shared file copy, synchronization and upload from Dreamweaver
- Improved working in Dreamweaver templates
Version 1.0.8
- Improved automatic shared file copy, synchronization and upload from Dreamweaver
- Great speed improvements on the Dreamweaver interface
Version 1.0.7
- New automatic dependent file updater
- Included new jQuery 1.4.4
- Improved depended file includes
- Improvements with the behavior connector events
- Improved working in Dreamweaver templates
- Various UI bugfixes and improvements
- Fixed a bug that caused the column's "sortable" checkbox to be always displayed as checked
- Optimized reading of the value of the combo-control for custom formats. This fixes the bug that prevents the user from adding custom formatting functions.
Version 1.0.6
- Huge speed optimization on database tables and field selections in Dreamweaver
- Improved CS5 compatibility
- Improved JSON data generation to be fully JSON compliant
- Improved jQuery 1.4.2 compatibility
- Improved MySQL support for table names with mixed case
- Optimized database type detection in Dreamweaver
- Fixed inspections of grids with a single field
- Fixed resize on grids with hidden columns
Version 1.0.5
- New option to place the navigation bar on top
- New and improved DMXzone Behavior Connector
- Latest jQuery 1.3.2 included
- Fixed error with show "Choose columns" popup option
- Extensibility improvements
Version 1.0.4
- Enhanced Mac and Dreamweaver CS4 Compatibility
- Improved vertical resizing
- Fixed column - sortable detection
- Results per page can be changed
- Various other bug fixes
Version 1.0.3
- New translation options and other bug fixes
- Two new great looking skins
Update Procedure
- Open one page that use the Ajax DataGrid in Dreamweaver
- Select the Ajax DataGrid Object on your page and then reapply it by clicking on the extension icon from the DMXzone objects panel
- Press the ok button to reapply the extension when the extension dialog pops up
- You should see some alerts about updated files, make sure you upload these to your live server and you are ready.
George Petrov is a renowned software writer and developer whose extensive skills brought numerous extensions, articles and knowledge to the DMXzone- the online community for professional Adobe Dreamweaver users. His expertise in countless languages and technologies gives inspiration and teach valuable lessons on his website – DMXzone.com, which is visited daily by more than 30.000 people and is most popular for its over high-quality Dreamweaver extensions and templates.
