XPages - The Ties That Bind


Published on

An introduction to data binding in XPages by Roy Rumaner and myself.

Published in: Technology, Business
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

XPages - The Ties That Bind

  1. 1. The Ties That Bind: Examples of XPages Data Binding
  2. 2. Michael McGarel <ul><li>Blog: http://www.bleedyellow.com/blogs/McGarelGramming/ </li></ul><ul><li>LinkedIn: http://www.linkedin.com/in/mikemcgarel </li></ul><ul><li>Twitter: http://www.twitter.com/mmcgarel </li></ul><ul><li>Mike is a full-time developer for Czarnowski, a North American exhibit services company. A specialist in Web-based collaboration and workflow, he has been concentrating on XPages development for all new projects. Mike is an active member of the IBM/Lotus developer community and is currently the Vice President of GRANITE, the Chicago-based IBM/Lotus user group, where he is a regular presenter. He has been playing working with Notes and Domino for over twelve years, starting with version 4.6. </li></ul>
  3. 3. Roy Rumaner <ul><li>Blog: http://rrumaner.blogspot.com/ </li></ul><ul><li>Blog: http://rrumaner.wordpress.com/ </li></ul><ul><li>LinkedIn: http://www.linkedin.com/in/royrumaner </li></ul><ul><li>Twitter: http://twitter.com/rrumaner </li></ul><ul><li>With over twenty five years experience in software development, Roy has spent the past 19 years working with Lotus Notes. He has co-authored two books on Lotus Notes, taught beginning XPages classes for the GRANITE User Group, writes about Notes and local restaurants on his blogs, holds a CLP in Development and is an IBM Business Partner. He is currently working for a national bank, converting all their Notes applications into XPages. </li></ul>
  4. 4. Agenda <ul><li>Data Binding </li></ul><ul><ul><li>What is Data Binding </li></ul></ul><ul><ul><li>What Can Be Bound </li></ul></ul><ul><li>Examples of Data Binding </li></ul><ul><ul><li>Steps For Form Data Binding </li></ul></ul><ul><ul><li>View Data Binding </li></ul></ul><ul><ul><li>Data Binding In A Repeat </li></ul></ul><ul><li>Resources </li></ul>
  5. 5. Data Binding
  6. 6. What is Data Binding? <ul><li>In XPages, the user interface is completely separate from the data </li></ul><ul><li>You need a way to access the data. </li></ul><ul><li>XPages are tied to traditional Domino forms and views through Data Binding. </li></ul><ul><li>Data Binding is the use of Server-side JavaScript (SSJS) or Expression Language (EL) to connect the backend Notes data to the XPage. </li></ul>
  7. 7. What Can Be Bound <ul><li>Document Field Data </li></ul><ul><li>View Data </li></ul><ul><li>Coding from SSJS </li></ul><ul><ul><li>@DbLookup() </li></ul></ul><ul><ul><li>@DbColumn() </li></ul></ul><ul><li>NotesViewEntryCollections </li></ul><ul><li>NotesDocumentCollections </li></ul><ul><li>and more... </li></ul>
  8. 8. Examples of Data Binding
  9. 9. Current Client Application
  10. 10. Steps for Form Data Binding First we need to create a blank Custom Control
  11. 11. Steps for Form Data Binding Step 1: Select the Data Properties Step 2: Select Add. In this case we are going to create a new form so choose Domino Document
  12. 12. Steps for Form Data Binding Step 3: After selecting Domino Document, the right side of the properties opens up. The default name for your data source is “document1”.
  13. 13. Steps for Form Data Binding Step 4: Change the default name to something meaningful. We chose “dataDoc” for this one.
  14. 14. Steps for Form Data Binding Step 5: Next you need to bind the Custom Control to (in this case) a form. Every form in the database is available from this menu.
  15. 15. Steps for Form Data Binding Step 6: We chose the Library Reference form.
  16. 16. Steps for Form Data Binding Step 7: Next select the default action when this form is accessed.
  17. 17. Steps for Form Data Binding Step 8: We chose Open Document for this form
  18. 18. Steps for Form Data Binding Step 9: Now that you have identified the proper form, a list of all available fields will appear in the Data Controls box (upper right) Step 10: We want all the fields except CheckedOut. Highlight them and drag the list to the design window.
  19. 19. Steps for Form Data Binding
  20. 20. Steps for Form Data Binding Step 11: All the fields you selected are now available for initial set up.
  21. 21. Steps for Form Data Binding Step 12: Change the Date field to a DateTime Picker. Material and Categories to List Boxes and Location to a Combo Box.
  22. 22. New Xpage (based on previous data binding)
  23. 23. Setting the Date Field Step 13: Even though the Date Published field was created as a DateTime, you still need to set it to display properly.
  24. 24. Steps for Form Data Binding Step 14: Now the Date Published field shows as a date field.
  25. 25. Steps for Form Data Binding
  26. 26. Steps for Form Data Binding
  27. 27. View Data Binding
  28. 28. View Data Binding
  29. 29. View Data Binding
  30. 30. Data Binding In a Repeat @DbColumn(@DbName(),'ByCategories',1)
  31. 31. Data Binding In a Repeat
  32. 32. Data Binding In a Repeat
  33. 33. SSJS Syntax <ul><li># indicates dynamic Recalculates every time the section of the page with the code reloads &quot;#{javascript:doc.getItemValueString('Status')}&quot; </li></ul><ul><li>$ static after page load Calculates only on page load &quot;${javascript:@Subset(@DbName(),1)}&quot; </li></ul>
  34. 34. Resources <ul><li>XPages.info </li></ul><ul><li>OpenNTF.org </li></ul><ul><li>NotesIn9.com </li></ul><ul><li>Application Development Wiki http://www-10.lotus.com/ldd/ddwiki.nsf </li></ul><ul><li>Julian Buss' XPages Wiki htttp://xpageswiki.com </li></ul><ul><li>XPages forum http://www-10.lotus.com/ldd/xpagesforum.nsf </li></ul><ul><li>MWLUG 2011 Workshop (on presentations page) http://www.mwlug.com/mwlug/mwlug2011.nsf/uxpages/presentations.uxp </li></ul>
  35. 35. Summary <ul><li>XPages allow you to reuse your current application data and present a new UI. </li></ul><ul><li>Remember that XPages separates data from the UI. </li></ul><ul><li>Data binding allows for more flexibility in presenting data. </li></ul><ul><li>You can have multiple data sources on an Xpage. </li></ul><ul><li>It is not difficult to establish simple data binding. The code is written for you. </li></ul>
  36. 36. Thank You For Attending <ul><li>The authors would appreciate any feedback or comments you care to give. Please contact either one at their respective email addresses. </li></ul>