Presenting Data – An Alternative to the View Control
-
Upload
teamstudio -
Category
Technology
-
view
810 -
download
5
Transcript of Presenting Data – An Alternative to the View Control
Presenting Data – An Alternative to the View Control
Tweet about this event
And mention us: @Teamstudio @TLCCLTD
@PaulDN
Mar. 17, 2015
Who We Are
• Teamstudio’s background is in creating tools for
collaborative computing in mid-size and large
enterprises, primarily for IBM Notes
• Easy-to-use tools for developers and administrators
• 1600+ active customers, 53 countries
• Offices in US, UK, and Japan
• Entered mobile space in 2010 with Unplugged: easy
mobilization of Notes apps to Blackberry, Android
and iOS
Teamstudio Unplugged
• Your mobile Domino server: take your IBM Notes
apps with you!
• End-users access Notes applications from mobile
devices whether online or offline
• Leverages the powerful technology of XPages
Unplugged Templates
• Continuity – Mobile offline access to BCM programs
• OneView Approvals – Expense approvals; anywhere, anytime
• CustomerView – lightweight CRM framework for field sales and field service teams• Contacts – customer information database
• Activities – customer activity log
• Media – mobile offline file storage and access
XControls
• Set of Controls for IBM Domino XPages developers
working on new XPages apps and on app
modernization projects
• Re-write of the Teamstudio Unplugged Controls
project, but adds full support for PC browser-based
user interfaces as well as mobile interfaces
• Enables XPages developers to create controls that
are responsive
• Learn more: teamstudio.com/solutions/xfoundations
Teamstudio Services
• Professional services for modernization, web
enablement, project management, development,
and administrationo Modernization Services
o Unplugged Developer Assistance Program
o Application Upgrade Analysis
o Application Complexity Analysis
o Application Usage Auditing
• http://www.teamstudio.com/solutions/services/
• Usage Auditing promotion:
o Now through Mar. 31, 2015, sign up for a free demo of Usage Auditing, and be
automatically entered to win a Nexus 6.
• Engage: Mar. 30-31, 2015
o Come see us in Ghent, Belgium for a chance to win an iPhone 6!
1
#XPages
Your Host Today:
Howard GreenbergTLCC
@TLCCLtd
Presenting Data – An Alternative to the View Control
How can TLCC Help YOU!
2
• Private classes at your location or virtual
•XPages Development
•Support Existing Apps
•Administration
• Let us help you become an expert XPages developer!
• Delivered via Notes
• XPages
• Development
• Admin
• UserSelf-
Paced Courses
Mentoring
Instructor-Led
Classes
Application Development
and Consulting
Free Demo
Courses!
Try a FREE XPages Course!!!
3
Introduction to XPages Development course
• Three Hour self paced course• Has Demonstrations and Activities• Requires Domino Designer• Both an 8.5 and 9.0 version• Perfect for beginners!
Register at www.tlcc.com/admin/tlccsite.nsf/pages/free+course
Great PriceIt’s FREE!!!
Upcoming and Recorded Webinars
4
• April 17th Transformations - Smart Application Migration to XPages
• May 14th App.Next - The Future of Domino App. Development
• www.tlcc.com/xpages-webinar
View Previous Webinars(use url above)
Asking Questions – Q and A at the end
5
Use the Orange Arrow button to expand the GoToWebinar panel
Then ask your questions in the Questions pane!
We will answer your questions verbally at the end of the webinar
Dojo DataGrid Features
• Infinite scrolling
• Adjustable, re-orderable, sortable columns
• Hover and selection highlighting
• In-Grid editing feature
• Enhanced DataGrid: Filtering plugin
7
Dojo DataGrid control - System Requirements
• Release 9 Domino and Designer
– Built in to release 9
• Available for Release 8.5 after installing one of the following …
– IBM Upgrade Pack 1 for Release 8.5
- or -
– XPages Extension Library from OpenNTF
8
Steps to Create
1. Create a REST Service to provide a data source for the Grid
2. Add the Dojo DataGrid control to the page and bind it to the REST Service
3. Add Dojo DataGrid Column controls into the grid for the field data to display
9
Step 1: Create the REST Service
i. Add the REST Service control to the XPage
ii. Choose one of the following service types:
xe:viewJsonService – read only service
xe:viewItemFileService – read/write service
iii. Set the appropriate properties for the service
– databaseName and viewName
– contentType=“application/json”
– defaultColumns=“true”
– sortColumn
– var
– And others depending on the application
iv. Set the pathInfo property for quick testing of the service
10
Step 2: Add the Dojo DataGrid control
i. Add the Dojo DataGrid control to the page
ii. Bind the DataGrid to the REST Service
iii. Set the appropriate properties for the DataGrid
– autoHeight
– rowsPerPage
– And others depending on the application
iv. Add dojoAttributes to the DataGrid
– autoWidth=“true”
– columnReordering=“true”
– canSort
11
Step 3: Add the Dojo DataGrid Column controls
i. Add a Dojo DataGrid Column controls into the DataGrid and set these properties
– field
– label
– width
– And others depending on the application
ii. Repeat to add additional columns
12
The arguments[0] object
• Represents a row object in the DataGrid
• Is passed to the onRowClick, onRowDblClick and onStyleRow events
15
Search and Filter properties of xe:viewJsonService
17
• search
• searchMaxDocs
• categoryFilter
• keys
• keysExactMatch
Enabling In-Grid Editing
18
1. Must use xe:viewItemFileService (read/write)
– Set jsId=“restServiceObj” for client-side access
2. Add Dojo Data Grid, bind to REST service and …
– Set jsId=“gridObj” for client-side access
– Optionally set singleClickEdit=“true”
3. For each column to enable in-grid editing …
– set editable="true"
4. To save changes call in a client-side script …
restServiceObj.save();
5. To cancel changes call …
restServiceObj.close();
gridObj._refresh();
In-Grid Editing with Style
19
OnStyleRow fires …
• New row is added
• Row is hovered
• Row is selected
• Row is changed
Deleting Selected Entries in a Dojo Data Grid
20
gridObj.selection.getSelected()
restServiceObj.deleteItem(selectedItem)
Creating Entries Directly in a Grid
21
1. Must use xe:viewJsonService
2. Set jsId=“restServiceObj2” for client-side access
3. Add Dojo Data Grid, bind to REST service and …
– Set jsId=“gridObj” for client-side access
4. Add a Dialog control to enter the values for the new entry and code a Save button …var rsStore = restServiceObj2;rsStore.newItem(newEntry);rsStore.save(); rsStore.close();
gridObj._refresh();…
The Dojo Enhanced DataGrid and the Filter Plugin
22
1. Must use xe:viewItemFileService
2. Add the following Dojo Modules and StyleSheets
3. Add the dojox.grid.EnhancedGrid type and the filter plugin in the Dojo properties for the grid
Want to Learn More???
• How to improve XPages performance• Understand events on an XPage• XPINC (XPages in the Notes client) performance• Migration strategies for converting traditional
Notes applications to XPages• Localize your XPages applications for different
languages• Use Custom Controls• Add charts to your XPages using DojoX chart
widgets• "XAgents" that return XML, JSON and HTML data• Use the Dojo Data Grid• Create a custom REST Service to aggregates data• Use the Relational controls to access relational
data from an XPage
23
Until April 3rd get this course for only $599, save $300
Learn more about the XPages Development 2 for Notes and Domino 9 course
TLCC’s XPages Development 2 Course covers many advanced XPages techniques like:
Questions????
24
Use the Orange Arrow button to expand the GoToWebinar panel
Then ask your questions in the Questions panel!
Remember, we will answer your questions verbally
#XPages
@TLCCLtd
@Teamstudio
@PaulDN
Upcoming Events:Engage, March 30/31 in Ghent, BelgiumMWLug User Group Meeting, Aug. 19-21, Atlanta
Question and Answer Time!
25
Teamstudio [email protected]
978-712-0924
TLCC [email protected] [email protected]
888-241-8522 or 561-953-0095
Howard GreenbergPaul Della-Nebbia Courtney Carter