May 16 – 18, 2007 Copyright 2007, Data Access Worldwide May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Build Great Web Application 'Fast and Easy' An Introduction to the Visual DataFlex AJAX Library Eddy Kleinjan, Data Access Europe,

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Agenda Great Web Application Visual DataFlex AJAX Library Building AJAX Library Web Applications Basic WebApp

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Great Web Applications Good Graphical User Interface Design Extended User Interface Controls Fast Responding Event Driven No Full Page Refresh

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Great Web Application Samples Google Suggest Backpack Google Maps 965, &spn= , &z= , &spn= , &z=18 Yahoo news

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Great Web Applications use AJAX to create User Friendly, Responsive, Interactive Web Sites

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide May 16 – 18, 2007 Copyright 2007, Data Access Worldwide What is AJAX?

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Defining AJAX Ajax isn’t a technology. It’s really several technologies, each flourishing in its own right, coming together in powerful new ways. Jesse James Garrett

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Defining AJAX Asynchronous JavaScript And XML First named by Jesse James Garrett as a project name to help management understand what they were working on php

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Technologies Involved HTML JavaScript Document Object Model (DOM) XML ASP (VBScript) Visual DataFlex Web Services CSS

Source:

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Source: Asynchronous AJAX Call Yahoo News Sample

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Visual DataFlex AJAX Library

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Goals Create Framework for Web Based Database Applications Allow Applications to be build ‘Fast-and-Easy’ Windows like Controls Browser Independent Highly Intuitive Data Dictionary Based Validations Client Side And Server Side Validations Standards Based

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Automated Input Controls Input controls are automatically attached to Data Dictionary items Characteristics like data type, length, etc. are loaded from Data Dictionary upon page load Client side data validation while navigating forward and before sending data Behavior can be influenced by setting attributes on the input element.

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide No Page Reload Only changed parts of the page are updated Data is send and received in the background Use of Modal Popup Object without opening a new browser window

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Lookup Lists and Grids Lists provide a virtual view on a set of data Implemented as normal HTML tables

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Other Controls Tabbed Dialogs Modal Popup Dialogs Pull Down Menu's

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Data Dictionary All Meta Data is available at the Client When possible, validations will be done at the Client Server Validations will always be executed

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Samples

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide May 16 – 18, 2007 Copyright 2007, Data Access Worldwide AJAX Library Components

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide AJAX Library Components Visual DataFlex Data Dictionaries Web Browser Object Web Services Internet Information Server HTML (ASP Pages optional) JavaScript Cascading Style Sheets (CSS)

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Client / Server Client / Server Technology Server Implemented as Web Services Client JavaScript CSS XMLHttpRequest Object

ClientServer WebService Web Business Object SessionManager Optional ASP Calls.asp page or HTML page 1 2 Build page using ASP Page is shown 3 Meta data is requested 4 Meta Data is delivered AJAX Request AJAX Response 5 7 Build Data Structure 6 8 Request page

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Server Implemented as Web Service Extends the Standard Web Business Objects Only One Web Service Object in an Application Web Service Passes Calls on to Web Business Objects All calls can be overruled by Developer Events Are Generated for Developer to Augment

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Client Implemented as set of JavaScript Classes Goal: Developer should not have to use JavaScript Don’t need Active Server Pages (.asp) Control VDF Specific Settings through HTML Attributes

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Page Load Process ClientServer

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Processing a Client Request ClientServer

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide May 16 – 18, 2007 Copyright 2007, Data Access Worldwide How to build

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Create a ‘Workspace’ Create a new workspace Add the “Visual DataFlex Ajax Library”

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Create SessionManager Handles security and creation of Session Id’s New  Web Object  Ajax Library Session Manager Call it “oSessionManager”

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Create Web Service Interface Accepts Incoming Calls New  Web Object  Ajax Library Web Service Interface Call it “WebService”

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Create Web Browser Object Functional unit New  Web Object  Ajax Library Web Business Object Add Data Dictionary Objects Test it

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Create Form Handles ‘one-record-at-a-time’ forms New  Web Markup  Ajax Library Form Call it “MyTable.asp” Replace “MyTable” with your details

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide How to get? Download at Downloads  Visual DataFlex Ajax Library Support: news.dataaccess.nl  Libraries  AJAX

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Basic WebApp

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Basic WebApp Definition Starting Point for Building Web Applications No AJAX Required

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Basis Web AppComponents SessionManager Extended Data Dictionary Alternative Auto Increment Function Register Created/Modified Data (when fields supplied) Translation (Multi Lingual Sites) User Rights Table

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Basic WebApp Availability Will be made Available to all Conference Attendees

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Questions?

May 16 – 18, 2007 Copyright 2007, Data Access Worldwide May 16 – 18, 2007 Copyright 2007, Data Access Worldwide Thank you!