Date post: | 21-Oct-2015 |
Category: |
Documents |
Upload: | sandeep-ratnam |
View: | 21 times |
Download: | 0 times |
OpenNTF.org
Getting Started with XPages
June 4th, 2013
Dr. Mark Roden David Leedy
Tuesday, June 4, 13
2NotesIn9.com
Mark Roden
• Senior Consultant for PSC Group LLC.• XPages and jQuery Enthusiast• NotesIn9 Contributor• DC Users Group Organizer• http://xomino.com demo.xomino.com
• Twitter: @MarkyRoden
2
Tuesday, June 4, 13
3NotesIn9.com
David Leedy
• Corporate Developer• NotesIn9 ScreenCast http://notesin9.com
index.notesin9.comcheatsheet.notesin9.com
• [email protected]• Twitter: @DavidLeedy or @NotesIn9
3
Tuesday, June 4, 13
5NotesIn9.com
XPages
• Design Elements meant to Modernize Domino Web DevelopmentAdded in 8.5.0 and enhanced through 9.0
• Built on top of Java Server Faces• Dojo JavaScript Framework is built in• Standard LanguagesHTML, CSS, JavaScript, Java
• Works with other Popular OpenSource Projects jQuery, Twitter Bootstrap, and many more
5
Tuesday, June 4, 13
7
It’s the same plumbing
• NSF FileEasy Deployment
• ACL Security• Agents LotusScript or JavaScheduled
• Readers / Authors Fields• Forms and Views• Replication / Clustering• Off-LineXPiNC
7
Tuesday, June 4, 13
8
We use the same Design Elements
• Pseudo mapping of design elements
8
Pre-XPages Design Element Similar XPages Design Element
Notes Form XPage
Subform Custom Control
Notes View Notes View Data Source
Notes Document Notes Document Data Source
Tuesday, June 4, 13
7NotesIn9.com
Key concepts
• Data BindingEasy to separate source code and DataNo need to Rip and Replace
Unless you want to! (And you might)• Repeat Controls• Dojo IntegrationDate Pickers, Partial Refresh, Pagers
• Scoped Variables
7
Tuesday, June 4, 13
8NotesIn9.com
Scoped Variables
• Allow you to pass information in memory• No need for cookies or URL Parsing• applicationScopeAll Users, Long Life
• sessionScopeSingle user, Life of user session
• viewScopeSingle user, Life of Page
• requestScopeSingle User, REALLY SHORT Life
8
Tuesday, June 4, 13
11NotesIn9.com
Things you always wanted to do
• Have the control to refresh/re-compute any element on the page and retain all the values
11
Tuesday, June 4, 13
12NotesIn9.com
Things you always wanted...
• Much better File Management OptionsWeb Content Folder
WindowOpen PerspectiveXPages
• This helps reusing OpenSource Projects JavaScript FrameWorksCSS FrameWorks Images/Graphicsetc..
12
Tuesday, June 4, 13
13NotesIn9.com
Things you always wanted...
• Compute almost EVERYTHINGHide When’sView Column Titlesmany more..
13
Tuesday, June 4, 13
15NotesIn9.com
Things you always wanted...
• Core Controls vs Extension LibraryUpgrade Pack 1 vs Ext. Library vs Domino 9.0
• Ext. includes the easy to use framework OneUI• XML based “SOURCE”• RDBMS CapabilitiesNative connection to RDBMS
Ext. Lib JDBC Connectors• Build Custom ObjectsCan Span Pages
• Seamlessly integrate external Java librariesPOI, Apache, org.openntf.domino
15
Tuesday, June 4, 13
29NotesIn9.com
Tools you will need
• Nothing makes your live easier than tools to help code and debugDomino Designer in Eclipse
Increase JVM Memory for acceptable performance http://www-01.ibm.com/support/docview.wss?uid=swg21617708
Local History TODO TrackingCustomize your Perspective
Work the way YOU wantColor your code
Source Control IntegrationSearch and Replace
29
Tuesday, June 4, 13
30NotesIn9.com
Tools you will need
• Domino Designer in EclipseSearch and Replace
30
Tuesday, June 4, 13
31NotesIn9.com
Tools you will need
• Browser debugging tools FirebugChrome Developer Tools IE Developer Tools
• Debug Tools are your friend It will tell you if you:
Have a JavaScript ErrorHave a file which is not loadingYour REST service isn’t workingYour anything isn’t working
31
Tuesday, June 4, 13
34NotesIn9.com
Tools you will need
• Debuggers Java Debugger
8.5+SSJS debugger
New with 9.0
http://notesin9.com/index.php/2013/04/05/notesin9-105-introduction-to-ssjs-debugger/ Fredrik Norling
34
Tuesday, June 4, 13
36NotesIn9.com
Tools you will need
• DebuggersXPages debug toolbar
• XPages debug Toolbar
http://www.openntf.org/internal/home.nsf/project.xsp?action=openDocument&name=XPage%20Debug%20Toolbar Mark Leusink
36
Tuesday, June 4, 13
37NotesIn9.com
Tools you will need
• DebuggersXPages debug toolbar
Access to scoped variables
http://www.openntf.org/internal/home.nsf/project.xsp?action=openDocument&name=XPage%20Debug%20Toolbar Mark Leusink
37
Tuesday, June 4, 13
39NotesIn9.com
Learning Curve
• With all these new technologies where do I start?HTML / XML JavaScript Syntax
DojoBackend Server Side Processing
This is the “LotusScript” of XPagesExternal frameworks like jQuery
CSS Java
Not Needed to start - Can be handy later
39
Tuesday, June 4, 13
40NotesIn9.com
Learning Curve
• How do I get started?
• Start with a low pressure project• Set a personal goal to convert an existing piece of code to XPages FormViewApplication
• Designer Wiki http://www-10.lotus.com/ldd/ddwiki.nsf
40
Tuesday, June 4, 13
42NotesIn9.com
Additional Resources
• CommunityOpenNTF.orgXPages.InfoCollaborationToday.InfoStackOverFlow.com
Over 1,300 questions asked and answeredGoogle for “XPages Forum”Google+ community - “XPages”
• PaidXPages101.net TLCC.comEngage a mentor
42
Tuesday, June 4, 13
43NotesIn9.com
Additional NotesIn9 resources
• notesIn9.com• index.notesin9.comAlso XPages.TVAll episodes in an easier to find format
By Episode numberBy contributor
• cheatsheet.notesin9.comAlso XPagesCheatSheet.com
Downloadable and printable CheatsheetsOnline URL CheatSheetDownloadable demo application and FakeNames database
43
Tuesday, June 4, 13
18NotesIn9.com
Rookie Mistakes
• Mistakes everyone makes starting out with XPagesWhy does my code not run when I click a button?Why do I make 5 documents every time I save a new form?Why does the same document come back when I save?Why can’t I Hide/Show a Panel?Why doesn’t my dojo/jQuery selector work?Why can’t I get two document data sources to open in read mode and edit mode
18
Tuesday, June 4, 13
19NotesIn9.com
Rookie Mistakes
• Why does my code not run when I click a button?Did you put it in the right place?
19
Tuesday, June 4, 13
20NotesIn9.com
Rookie Mistakes
• Why does my code not run when I click a button?Did you put it in the right place?
20
Tuesday, June 4, 13
21NotesIn9.com
Rookie Mistakes
• Why do I make 5 documents every time I save a new form?New custom control new binding right?
Multiple data bindings means multiple documents
21
Tuesday, June 4, 13
22NotesIn9.com
Rookie Mistakes
• Why do I make 5 documents every time I save a new form?
• Solution
Copy and Paste the data binding in the source panel from one custom control to the next
When finished move it to the XPage
22
Tuesday, June 4, 13
23NotesIn9.com
Rookie Mistakes
• Why does the same document come back when I save?When I have two data sources on the same page – when I create a new document it always
comes back on the page? http://blog.hughesconnect.com/?p=62
Mark Hughes
• AnswerCreate the document with a scope: request
23
Tuesday, June 4, 13
24NotesIn9.com
Rookie Mistakes
• Why can’t I Hide/Show a Panel?• Server Side SolutionUse Nested Divs
panelOuter panelInner
Control rendering on Inner PanelUse panelOuter as partial refresh target
• Client Side SolutionUse dojo.style
dojo.toggleClass("#{id:contentsOuter}", "hide");Assumes .hide { display: none};
Add to CSS file via resource
24
Tuesday, June 4, 13
25NotesIn9.com
Rookie Mistakes
• Why doesn’t my dojo/jQuery selector work? dojo.byId is good with Colons dojo.query does not like Colons
25
<xp:button value="Label" id="button1">
<xp:eventHandler event="onclick" submit="false">
<xp:this.script>
<![CDATA[
var theField;
theField = dojo.query("#{id:fruit1}");
alert(theField.value);
]]>
</xp:this.script>
</xp:eventHandler>
</xp:button>
Tuesday, June 4, 13
26NotesIn9.com
Rookie Mistakes
• Why doesn’t my dojo/jQuery selector work?• Suggest use class selectorsAvoid CSS Frameworks that use ID (#) selctors
<xp:inputText styleClass="fruitField" value="#{document1.fruit}" id="fruit1"> </xp:inputText>
dojo.query(“.fruitField”)
26
Tuesday, June 4, 13
27NotesIn9.com
Rookie Mistakes
• Why can’t I get two document data sources to open in read mode and edit mode
• Request Parameters in the URL ?action=editdocument
• Solution ignoreRequestParameters = true
27
Tuesday, June 4, 13
47NotesIn9.com
XPages and Bootstrap
• Twitter Bootstrap is UI and JavaScript FrameWork• A lot of interest in the combination http://www.bootstrap4xpages.com - Mark Leusink
• OpenNTFOliver Busse - Bootstrap UI Template Kit
• Steve Zavocki - notesspeak.blogspot.com http://notesspeak.blogspot.com/2013/05/bootstrap-modal-dialog-custom-control.html
• Henning Schmidt - http://www.schmhen.de/2012/08/30/xpages-create-a-responsive-layout-with-twitter-bootstrap-2/
• Kathy Brown’s blog (runningnotes.net), and I’m sure more.• Possible alternative for Mobile Development
47
Tuesday, June 4, 13