357 Lotus blogs updated hourly. Who will post next? Home | Downloads | Events | Pods | Blogs | Search | myPL | About 
 
Latest 7 Posts
On SocialBizUg: Modern Domino: Bootstrap 3 Inheritable Layout
Fri, May 30th 2014 174
XMage, your XPrentice will surely miss you
Mon, May 12th 2014 331
On SocialBizUg - Web Worker Basics
Sun, Apr 13th 2014 237
Popover to Google Maps
Wed, Jan 1st 2014 217
My first impressions of using Titanium Appcelerator
Sun, Dec 8th 2013 306
Asymmetric Modernization Explained
Mon, Nov 25th 2013 189
2 Days with Domino 9.0.1 Mobile Controls - And I'm not happy
Wed, Oct 30th 2013 256
Top 10
XMage, your XPrentice will surely miss you
Mon, May 12th 2014 331
My first impressions of using Titanium Appcelerator
Sun, Dec 8th 2013 306
2 Days with Domino 9.0.1 Mobile Controls - And I'm not happy
Wed, Oct 30th 2013 256
On SocialBizUg - Web Worker Basics
Sun, Apr 13th 2014 237
JQuery FullCalendar in XPages
Sun, Feb 17th 2013 224
Easy Mobile Browser Detection
Tue, Nov 27th 2012 221
Popover to Google Maps
Wed, Jan 1st 2014 217
Implementing a Dojo Scrollable pane with the XPages Mobile Controls
Mon, Jul 29th 2013 210
Make your Bootstrap site Responsive
Fri, Sep 20th 2013 191
Asymmetric Modernization Explained
Mon, Nov 25th 2013 189


SnTT: Sectioned XPages Menu
Keith Strickland    

>I recently completed my first "Production" XPages application. Messing with the XPages calendar really helped but I learned that too long away from something after just learning it is bad. But anyways, while researching for said application I came across the IBM Lotus User Interface Developer Documentation site. I don't know where or how I found it but it contains a wealth of information on the oneUI classes with examples using them. On this site I found a Menu with Sections and the app needed a sectioned navigational menu. Since I was using the XPages Framework for this application (BTW, this is a great package and makes it VERY easy to come up with a very nice looking, functional app very quickly) I decided to just make a few modifications to add the required navigational menu. I sent these changes over to Steve Castledine for inclusion in the XPages Framework. Whether or not he'll use it, I don't know, but hopefully he will.

To make this I created a new custom control and called it ccSectionSideMenu. This very closely resembles the ccSideMenu custom control within the XPages Framework.

Now, to support the computed field in the code above, I had to make some changes to the xpUtil Server Javascript script libaray. These are the 2 functions I added:


And I modified the createFromProperties function and just added this code in between Side Bar and Footer Column blocks:

I really can't take a lot of credit for all the Javascript code I listed above. This code was just adapted from other functions and code blocks already in that script library. So I guess Steve Castledine and/or Niklas Heidloff wrote this code and really deserve the credit as all I did was re-task it to meet my needs. But the last piece of this puzzle is the layout.properties file. I added the following:

#Side Bar Menu Sections
sideBarSectionMenu.title=Section1,Section2
sideBarSectionMenu.link=Section1.xsp,Section2.xsp
sideBarSectionMenu1.title=subMenu1.1,subMenu1.2,subMenu1.3
sideBarSectionMenu1.link=subMenu1-1.xsp,subMenu1-2.xsp,subMenu1-3.xsp
sideBarSectionMenu2.title=subMenu2.1,subMenu2.2,subMenu2.3
sideBarSectionMenu2.link=subMenu2-1.xsp,subMenu2-2.xsp,subMenu2-3.xsp

This just sets up the data to be parsed and turned into the sectioned menu and follows the same format as the footer columns section.

Here's what you end up with:
sectionedMenu.jpg

And that's it, hopefully you'll get some mileage out of this. I didn't have time to give it twisty support where the menus collapse when you close the section, but I do plan on adding that in the future when time permits or the absolute need arises. But as long as you don't have a ton of menu items to display this actually works really well. Enjoy!



---------------------
http://www.keithstric.com/A55BAC/keithstric.nsf/d6plinks/KSTD-86VK8M
Jun 29, 2010
50 hits



Recent Blog Posts
174


On SocialBizUg: Modern Domino: Bootstrap 3 Inheritable Layout
Fri, May 30th 2014 6:35p   Keith Strickland
I've got a new post over on SocialBizUg. Modern Domino: Bootstrap 3 Inheritable Layout [read] Keywords: domino
331


XMage, your XPrentice will surely miss you
Mon, May 12th 2014 3:45p   Keith Strickland
I am truly saddened and devastated by the news I received today of the death of Tim Tripcony. I would like to express my heartfelt condolences and sympathy to Tim's family and friends. I would also like to explain how Tim helped change both my personal and professional life. The loss of Tim has already left me feeling a rather large empty space where he once stood. Before I was hired at GBS I learned a lot from Tim's blog and the few chat sessions I had with him. I had never met him [read] Keywords: xpages development
237


On SocialBizUg - Web Worker Basics
Sun, Apr 13th 2014 11:26a   Keith Strickland
Over on SocialBizUg - Web Worker Basics [read] Keywords:
217


Popover to Google Maps
Wed, Jan 1st 2014 11:34a   Keith Strickland
Posted over on SocialBizUg - Popover to Google Maps [read] Keywords: google
306


My first impressions of using Titanium Appcelerator
Sun, Dec 8th 2013 11:48a   Keith Strickland
A couple of weeks ago I started messing with Titanium Appcelerator. Coming from Domino Designer and Eclipse the IDE will look very familiar. It's eclipse and it's based off of Aptana Studio. I guess the biggest issue to being productive is the learning curve for the API. But honestly when is that not the case? So starting to delve into this, Titanium apps are purely client side javascript based. You write the CSJS that builds the UI, Business Logic, Layout, everything. While this may [read] Keywords: domino ibm lotus notes notes client application dojo eclipse iphone javascript mobile oop openntf wiki
189


Asymmetric Modernization Explained
Mon, Nov 25th 2013 6:32a   Keith Strickland
Posted Asymmetric Modernization Explained over on SocialBizUg. [read] Keywords:




256


2 Days with Domino 9.0.1 Mobile Controls - And I'm not happy
Wed, Oct 30th 2013 1:42p   Keith Strickland
OK, so today is the 2nd day I've spent with the Mobile controls from Domino 9.0.1. I must say the lack of a 9.0.1 Beta is quite obvious. So some of the "improvements" IBM made to the mobile controls are the addition of onBeforeTransitionIn/Out onAfterTransitionIn/Out. While these events are sorely needed, the implementation IBM chose to use doesn't work is kind-of odd. So, a brief rundown of the transition events pre 9.0.1. I posted a while back about how to implement these methods i [read] Keywords: domino ibm application community dojo mobile network server
191


Make your Bootstrap site Responsive
Fri, Sep 20th 2013 2:50p   Keith Strickland
Just posted over on SocialBizUg a tutorial for putting together a responsive layout for your XPage Applications. [read] Keywords: applications
164


The Modern Notes Developer
Mon, Aug 19th 2013 8:09a   Keith Strickland
On SocialBiz User Group - The Modern Notes Developer [read] Keywords: notes xpages
210


Implementing a Dojo Scrollable pane with the XPages Mobile Controls
Mon, Jul 29th 2013 4:45p   Keith Strickland
Check out my first NotesIn9 video about adding a Dojo Scrollable Pane in order to get a fixed bottom tab bar with the Extension Library Mobile Controls. A big thanks to David Leedy for publishing my video. Hope you enjoy the video. [read] Keywords: xpages dojo mobile planetlotus planetlotus.org




Created and Maintained by Yancy Lent - About - Blog Submission - Suggestions - Change Log - Blog Widget - Advertising - Mobile Edition