Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
D    Creating Web 2.0 applications made easy
What about me?• Oracle since v5, Forms 2.3, Case*Designer etc• Presenter at UKOUG (4x), OOW (3x), Collab (1x),   ODTUG (2x...
APEX 4.0 - What do you like best?
WHY ?
Declarative definitionof client-side behaviour……without needing to know JavaScript
Just specify           When           Action           What
Specification 1The application should disable the AlternateNumber field until the Phone Number field isfilled in.   –   Wh...
Specification 2The application should hide the List Price andProduct Image if the Product Available is No.   – When: Produ...
Specification 3The application should have a button thatallows users to increase all customers creditlimit.   – When: Butt...
Specification 4The application should set Credit Limit’s coloraccording to the amount (green if < 5000, redif > 5000).   –...
Debugging• Switch on ‘Debug’• Check the Console
Debugging• Switch on ‘Debug’• Check the Console• Use console.log(this);
Debugging•   Switch on ‘Debug’•   Check the Console•   Use console.log(this);•   Check your AJAX processes
Performance• Downloads and executes additional code• Increases page size
Learn about HTML and the DOM • What is the DOM?   – Document Object Model   – How your browser “sees” a web page   – Allow...
Learn JavaScript (jQuery)  • What is JavaScript?    – Well… it’s not Java!    – Client side (browser) scripting language  ...
Learn CSS • What is CSS?   – Cascading Style Sheets   – Rules that are applied to element       • Pertain to visual aspect...
Specification 5  Edit customer in popup window and reflect  the changes immediately in the report.
Buy   this   Book
Questions
To Do List             21
Thank youLogica | Meander 901 P.O. Box 7015 | 6801 HA Arnhem | The Netherlands | www.logica.comContact: Roel Hartman - Lea...
Done in 60 seconds - Creating Web 2.0 applications made easy
Upcoming SlideShare
Loading in …5
×

Done in 60 seconds - Creating Web 2.0 applications made easy

2,341 views

Published on

Presentation during OBUG APEX SIG about one of the major APEX 4 features: Dynamic Actions.

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Done in 60 seconds - Creating Web 2.0 applications made easy

  1. 1. D Creating Web 2.0 applications made easy
  2. 2. What about me?• Oracle since v5, Forms 2.3, Case*Designer etc• Presenter at UKOUG (4x), OOW (3x), Collab (1x), ODTUG (2x), OBUG, OGH, etc..• Oracle ACE Director [DB Dev]• Co-author of Expert Oracle Application Express
  3. 3. APEX 4.0 - What do you like best?
  4. 4. WHY ?
  5. 5. Declarative definitionof client-side behaviour……without needing to know JavaScript
  6. 6. Just specify When Action What
  7. 7. Specification 1The application should disable the AlternateNumber field until the Phone Number field isfilled in. – When: Phone Number is null – Action : Disable – What : Alternate Phone – ( False: Enable Alternate Phone )
  8. 8. Specification 2The application should hide the List Price andProduct Image if the Product Available is No. – When: Product Available = ‘N’ – Action : Hide – What : • List Price • Product Image region – Opposite : • Show List Price • Show Product Image region
  9. 9. Specification 3The application should have a button thatallows users to increase all customers creditlimit. – When: Button clicked – Action : Update credit limit – What : [none]
  10. 10. Specification 4The application should set Credit Limit’s coloraccording to the amount (green if < 5000, redif > 5000). – When : Credit Limit changes – Action : Change color – What : Credit Limit itself
  11. 11. Debugging• Switch on ‘Debug’• Check the Console
  12. 12. Debugging• Switch on ‘Debug’• Check the Console• Use console.log(this);
  13. 13. Debugging• Switch on ‘Debug’• Check the Console• Use console.log(this);• Check your AJAX processes
  14. 14. Performance• Downloads and executes additional code• Increases page size
  15. 15. Learn about HTML and the DOM • What is the DOM? – Document Object Model – How your browser “sees” a web page – Allows access /manipulation of content • Methods – Select elements – Traverse the hierarchy – Manipulate elements • Events – User actions fire events in DOM – We can attach code to these events • Like triggers in the DB
  16. 16. Learn JavaScript (jQuery) • What is JavaScript? – Well… it’s not Java! – Client side (browser) scripting language – Allows us to make HTML applications interactive • jQuery & jQuery UI built in – JavaScript libraries that make things easier • Dynamic Actions are generating JavaScript
  17. 17. Learn CSS • What is CSS? – Cascading Style Sheets – Rules that are applied to element • Pertain to visual aspects: location, fonts, colors, etc. – Closest rule wins (almost always) • Selectors – Used to target which elements rules are applied to – Common selectors include • HTML tag: input • HTML ID: #the_elements_id • Class: .the_elements_class • Pseudo-class: a:hover
  18. 18. Specification 5 Edit customer in popup window and reflect the changes immediately in the report.
  19. 19. Buy this Book
  20. 20. Questions
  21. 21. To Do List 21
  22. 22. Thank youLogica | Meander 901 P.O. Box 7015 | 6801 HA Arnhem | The Netherlands | www.logica.comContact: Roel Hartman - Lead Technical Architect Oracle: +31 (0) 26 3765 000 M: +31 (0) 6 2954 3729 E: roel.hartman@logica.comAll slides © 2011 LogicaLogica is a business and technology service company, employing 39,000 people. It provides business consulting, systems integration and outsourcing to clients around the world, including many ofEuropes largest businesses. Logica creates value for clients by successfully integrating people, business and technology. It is committed to long term collaboration, applying insight to createinnovative answers to clients’ business needs. Logica is listed on both the London Stock Exchange and Euronext (Amsterdam) (LSE: LOG; Euronext: LOG). More information is available atwww.logica.com

×