Ajax ons2

596 views
506 views

Published on

Ajax on Struts 2

Published in: Technology, Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
596
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
12
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • Plus images, css, etc. This is a very small page.
  • show amazon page refresh
  • XMLHttpRequest
  • Ajax ons2

    1. 1. Ajax on Struts 2
    2. 2. About Myself <ul><li>Chad Davis </li></ul><ul><li>Blackdog Software, Inc. </li></ul><ul><li>J2EE Consulting </li></ul><ul><li>Corporate Training </li></ul><ul><li>Struts 2 in Action </li></ul><ul><li>Open Source Enthusiast </li></ul><ul><li>Debian Devotee </li></ul>
    3. 3. Road Map <ul><li>Something for everyone </li></ul><ul><li>Struts 2 introduction </li></ul><ul><li>Ajax introduction </li></ul><ul><li>Walk through a code sample </li></ul><ul><li>Questions at any time </li></ul>
    4. 4. Struts 2 <ul><li>Web application framework </li></ul><ul><li>Java Servlets </li></ul><ul><li>Second generation </li></ul><ul><li>Software engineering </li></ul>
    5. 5. Classic versus Ajax <ul><li>Classic Web Applications </li></ul><ul><li>Ajax Web Applications </li></ul>
    6. 6. Classic Web Applications URL: /manningSampleApp/chapterEight/ClassicRetrieveUser.action Data: username=mary
    7. 7. How it works: classic style <ul><li>Browser makes request </li></ul><ul><ul><li>Http </li></ul></ul><ul><ul><li>URL </li></ul></ul><ul><ul><li>Data </li></ul></ul><ul><li>Server </li></ul><ul><ul><li>Processes data </li></ul></ul><ul><ul><li>Sends HTML page response </li></ul></ul><ul><li>Browser receives, renders HTML </li></ul>
    8. 8. < html > < head > < link rel = &quot;stylesheet&quot; type = &quot;text/css&quot; href = &quot;css/classicUserBrowser.css&quot; /> </ head > < body > < h2 > Artist Browser Control </ h2 > < form id = &quot;ClassicRetrieveUser&quot; name = &quot;ClassicRetrieveUser&quot; onsubmit = &quot;return true;&quot; action = &quot;/manningSampleApp/chapterEight/ClassicRetrieveUser.action&quot; method = &quot;post&quot; > < table class = &quot;wwFormTable&quot; > < tr > < td class = &quot;tdLabel&quot; >< label for = &quot;ClassicRetrieveUser_username&quot; class = &quot;label&quot; > Select an artist: </ label ></ td > < td >< select name = &quot;username&quot; id = &quot;ClassicRetrieveUser_username&quot; > < option value = &quot;Jimmy&quot; > Jimmy </ option > < option value = &quot;Charlie Joe&quot; > Charlie Joe </ option > < option value = &quot;Mary&quot; selected = &quot;selected&quot; > Mary </ option > < option value = &quot;Arty&quot; > Arty </ option > </ select ></ td > </ tr > < tr > < td colspan = &quot;2&quot; > < div align = &quot;right&quot; >< input type = &quot;submit&quot; id = &quot;ClassicRetrieveUser_0&quot; value = &quot;Submit&quot; /></ div > </ td > </ tr > </ table > </ form > < hr /> < h2 > Artist Information </ h2 > < div id = 'console' > < p >< span class = &quot;browser_label&quot; > Name: </ span > Mary Greene </ p > < p >< span class = &quot;browser_label&quot; > PortfolioName: </ span > Wood Cuts </ p > < p >< span class = &quot;browser_label&quot; > PortfolioName: </ span > Oil Paintings </ p > </ div > </ body > </ html >
    9. 9. Classic Problems <ul><li>Slow </li></ul><ul><li>High bandwidth </li></ul><ul><li>Redundant </li></ul><ul><li>Page rendering </li></ul>
    10. 10. Ajax Web Applications URL: /manningSampleApp/chapterEight/ClassicRetrieveUser.action Data: username=mary
    11. 11. How it works: Ajax <ul><li>Browser uses Javascript to submit request </li></ul><ul><ul><li>Http </li></ul></ul><ul><ul><li>URL </li></ul></ul><ul><ul><li>Data </li></ul></ul><ul><li>Server </li></ul><ul><ul><li>Processes data </li></ul></ul><ul><ul><li>Sends data response ( JSON, XML, etc. ) </li></ul></ul><ul><li>Browser Javascript </li></ul><ul><ul><li>Proceses data </li></ul></ul><ul><ul><li>DHTML </li></ul></ul>
    12. 13. Ajax Selling Points <ul><li>Low bandwith </li></ul><ul><li>No page rendering issues </li></ul><ul><li>Supports a stronger Separation of Concerns </li></ul>
    13. 14. Observations . . . What does the server do? The page abstraction: JSP, ASP, PHP What should new frameworks do? What should new frameworks do?
    14. 15. Struts 2 Architecture <ul><li>Does all the dirty work for you </li></ul><ul><li>Separation of Concerns !! </li></ul><ul><li>Interceptors, Actions, Results, ValueStack </li></ul>
    15. 17. Daily development <ul><li>Actions </li></ul><ul><ul><li>you write them </li></ul></ul><ul><li>Results </li></ul><ul><ul><li>declare them </li></ul></ul><ul><ul><li>write them if necessary </li></ul></ul><ul><li>Interceptors </li></ul><ul><ul><li>nothing! </li></ul></ul><ul><ul><li>declare or write if necessary </li></ul></ul>
    16. 18. Configuration <ul><li>Declare your actions </li></ul><ul><li>Declare your results </li></ul><ul><li>XML, Annotations </li></ul>
    17. 19. struts.xml <? xml version = &quot;1.0&quot; encoding = &quot;UTF-8&quot; ?> <! DOCTYPE struts PUBLIC &quot;-//Apache Software Foundation//DTD Struts Configuration 2.0//EN&quot; &quot;http://struts.apache.org/dtds/struts-2.0.dtd&quot; > < package name = &quot;chapterEightPublic&quot; namespace = &quot;/chapterEight&quot; extends = &quot;struts-default&quot; > < action name = &quot;ClassicUserBrowser&quot; class = &quot;manning.chapterEight.UserBrowser&quot; > < result > classicUserBrowser.jsp </ result > </ action > </ package > </ struts > < struts >
    18. 20. Let's code: classic style What do we need to write? Interceptors? Results? An Action A JSP Page
    19. 21. Let's Code: Ajax Style What do we need to write? Interceptors? Results? An Action A JSP Page? Javascript Client Application
    20. 22. Summary Struts 2 – Second Generation Framework Struts 2 – Built on Software Engineering Principles Struts 2 – Fast Development, Flexible Architecture Ajax – No Page Rendering Ajax – Javascript Client Ajax – Lower Bandwidth Ajax – JSON, XML

    ×