Download Build Great Web Applications Fast & Easy

Survey
yes no Was this document useful for you?
   Thank you for your participation!

* Your assessment is very important for improving the work of artificial intelligence, which forms the content of this project

Document related concepts
no text concepts found
Transcript
Build Great Web Application
'Fast and Easy'
An Introduction to the Visual DataFlex AJAX Library
Eddy Kleinjan, Data Access Europe, [email protected]
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
http://www.google.com/webhp?complete=1&hl=en
Backpack
http://educ.backpackit.com/
Google Maps
http://maps.google.com/?ie=UTF8&t=k&om=1&ll=25.823
965,-80.121118&spn=0.003385,0.007135&z=18
Yahoo news
http://news.yahoo.com/
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
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.
http://adaptivepath.com/publications/essays/archives/
000385.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
May 16 – 18, 2007
Copyright 2007, Data Access Worldwide
Source: http://adaptivepath.com/publications/essays/archives/000385.php
Asynchronous AJAX Call Yahoo News Sample
Source: http://www.javarss.com/ajax/j2ee-ajax.html
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
Samples
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
May 16 – 18, 2007
Copyright 2007, Data Access Worldwide
Server
Build page using ASP
Client
2
1
Request page
.asp page or
HTML page
Optional ASP Calls
3
4
Web
Business
Object
WebService
SessionManager
Page is shown
Meta data is requested
Meta Data is delivered
5
7
8
AJAX Request
AJAX Response
6
Build
Data
Structure
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
Client
·
Request page
·
Request Meta Data from Web Object
·
·
·
Server
·
Delivers page (ASP processing when
necessary)
·
Looks up Web Object; Sends back XML
document containing Meta Data
Stores XML Meta data
Processes All Forms
Attaches Attributes to Input Elements
based on Meta Data
May 16 – 18, 2007
Copyright 2007, Data Access Worldwide
Processing a Client Request
Client
·
·
·
Server
Performs Client Side Validation
Creates XML Document based on Form
data
Sends Data with Session Key to Server
·
·
·
·
·
Processes Request
Updates the Screen
May 16 – 18, 2007
·
Validates Session
Looks up Web Object
Processes Request
Creates XML Document containing
requested data
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 www.dataaccess.eu/ajax
Downloads  Visual DataFlex Ajax Library
Support: news.dataaccess.nl  Libraries  AJAX
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 App Components
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
Questions?
May 16 – 18, 2007
Copyright 2007, Data Access Worldwide
Thank you!
May 16 – 18, 2007
Copyright 2007, Data Access Worldwide
Related documents