198 Lotus blogs updated hourly. Who will post next? Home | Blogs | Search | About 
 
Latest 7 Posts
Quick NPM tip: don’t forget to uninstall node modules
Tue, Jul 4th 2017 3
Angular 4 bug in combination with latest Typescript
Sat, Jul 1st 2017 6
Angular and base64 encoding and decoding
Fri, Jun 30th 2017 7
The slides of my session at Engage
Tue, May 9th 2017 6
Learn, share and Engage in Antwerp
Tue, May 2nd 2017 7
Bulk import in a Cloudant database
Thu, Apr 27th 2017 3
IBM InterConnect 2017 as a developer
Fri, Apr 7th 2017 6
Top 10
I am an IBM Champion, again
Thu, Dec 15th 2016 12
Quick XPages tip: add Fullcalendar plugin to your application
Thu, Aug 27th 2015 11
XPages Quick tip: Move Java files for a better Source Control experiences
Fri, Sep 23rd 2016 10
Websphere Liberty Profile and external authentication redirect
Wed, Dec 21st 2016 10
Leaving the class
Wed, Dec 3rd 2014 8
Xcode update breaks Bower, but there is a solution
Thu, Sep 25th 2014 8
XPages quicktip: use the Calendar build in Months
Thu, Nov 26th 2015 8
HR Assistant now as project at OpenNTF
Mon, Oct 24th 2016 8
My steps in the JSF 2.0 world
Fri, Oct 24th 2014 7
Primefaces upload control and ClickJacking filter on IE8
Wed, Mar 11th 2015 7


Quick XPages tip: add Fullcalendar plugin to your application
Twitter Google+ Facebook LinkedIn Addthis Email Gmail Flipboard Reddit Tumblr WhatsApp StumbleUpon Yammer Evernote Delicious
Frank van der Linden    

In one of my XPages projects there was the need of a calendar display of data. First stop was the Demo application of the OpenNTF Extension Library, which contains a calendar control.

After some attempts to get my data displayed in this control, I skipped it and moved to a JQuery plugin, FullCalendar. I was surprised by how the easiness to get everything up and running.

 

Get started

For this project I already used Bower to include all the required client side frameworks, I run Bower once again to install the full calendar files in my application. How to use Bower in your XPages application, see my blog about it.

 

Make it work

In your XPages app, add the javascript file via the resource tags

FullcalendarJSFile

 

Further down the page include a div tag, with the id of calendar (1). At the bottom of the page I included a script block, with the call to the full calendar javascript object. In the call I added some parameters to tell the code how to display the code and what to display. Documentation of all the parameters can be found on the website of the Fullcalendar plugin.

I added code to get my data and language from a Java Controller (2 and 3)

FullcalendarScriptBlock

 

Last thing is to get the data as JSON from my Java Controller class. With the use of the build in ‘

com.ibm.commons.util.io.json.JsonJavaObject’ I build my JSON, every event entry is a entry of an array.

The JSON array entry should have as minimum the obviuos values like title, start and end date

title: ‘Click for Google’,

url: ‘http://google.com/’,

start: ‘2015-02-28’

end: ‘2015-02-28’

 

After the data is collected from my Java Contoller my entry data for the full Calendar looks like this

FullcalendarJSON

 

Final result

The final result looks, in my opinion very good.

FullcalendarResult

 

 

 

 

 

 

 

twittergoogle_plusredditpinterestlinkedintumblrby feather

The post Quick XPages tip: add Fullcalendar plugin to your application appeared first on elstar IT.



---------------------
http://elstarit.nl/?p=320
Aug 27, 2015
12 hits



Recent Blog Posts
3
Quick NPM tip: don’t forget to uninstall node modules
Tue, Jul 4th 2017 4:08p   Frank van der Linden
NPM is great tool to have all your Node modules in your front end project, and don’t have to worry about dependencies. When you find a useful module for your project just do ‘npm install –save-dev’ and you are ready to go, but….. it can pollute your node_modules directory with unused node modules. Just uninstall your unused node module by ‘npm uninstall ’ by The post Quick NPM tip: don’t forget to uninstall node modules appeared first on elstar
6
Angular 4 bug in combination with latest Typescript
Sat, Jul 1st 2017 10:51a   Frank van der Linden
When we upgraded our Angular app to the latest version. We noticed everything worked with version 4.2.3 and Typescript 2.4. The problem After we reinstalled all the nom packages the Angular version was upgraded to 4.2.4, because we had in our package.json ‘^4.2.3’ for Angular packages. When we package everything and republished the app to the page, we got errors, huh!!!! The solution After some search I found it has to do with the combination of Typescript and Angular
7
Angular and base64 encoding and decoding
Fri, Jun 30th 2017 7:32p   Frank van der Linden
Currently I am busy building a Proof of Concept at my customer. We are using Springboot for the Backend services, which get data from Tridion and store data in a Oracle database.. The Front end is build with Angular. We started with version 2 with Grunt as build tool, but quickly we changed it to Angular 4 with Webpack. The overall feeling of Angular 4 and Webpack was much better. Another plus was the smaller footprint. Base64 Last request was to store some information in Cookie. Overall no ro
6
The slides of my session at Engage
Tue, May 9th 2017 9:51a   Frank van der Linden
Here are my slides of my session at Engage. DEV03 – How Watson, Bluemix, Cloudant, and XPages Can Work Together In A Real World Application from Frank van der Linden by The post The slides of my session at Engage appeared first on elstar IT.
7
Learn, share and Engage in Antwerp
Tue, May 2nd 2017 6:15p   Frank van der Linden
Next week it is time for Engage Usergroup again. This time Theo Heselmans has chosen a very special location, next to the ZOO of Antwerp. Looking forward to meet everyone again and see what the sponsors have to offer. Theo and his team has put together a amazing agenda with top notch speakers and IBM Champions. This year I am very privileged to be a speaker again. My session Dev03. How Watson, Bluemix, Cloudant, and XPages Can Work Together In A Real World Application The role of a human resour
3
Bulk import in a Cloudant database
Thu, Apr 27th 2017 5:02p   Frank van der Linden
After some issues with HR Assistant I was thinking it would be a good idea to create a separate database with only the Design documents as schema database. So I replicated all the documents from the original database to a brand new one and called it hrassistant_schema. After the successful replication I kept all only the design documents. Today I got a question about the schemas and discovered it should also be a good idea to add all the configuration documents to the schema database of HR Ass
6
IBM InterConnect 2017 as a developer
Fri, Apr 7th 2017 11:27a   Frank van der Linden
As promised in a previous blogpost, I will zoom in on the technologies I have seen and used at IBM InterConnect I was surprised the amount of technical sessions at InterConnect. More then I then was expecting as lots of people told me It was all about middleware. Below my impression as a developer Open Tech Summit On Sunday InterConnect for me started with the Open Tech Summit, a gathering of tech nerds, to learn more on Open Source software. In a TED talk style every speaker got 10 minutes to s
4
IBM InterConnect 2017 – something completely different
Tue, Mar 28th 2017 4:43p   Frank van der Linden
IBM InterConnect 2017 is over, I must say I totally enjoyed it. Lots of attendees, it was crowded everywhere, but it gave a good vibe.  I have met a lot of new people I heard that it was Lotusphere in the old days. I totally agree with the blog by Gabriella Davis, it is time to get out our own yellow bubble and integrate it in InterConnect. There is so much both worlds can learn from each other. Keynotes On Monday there was the InterConnect Welcome keynote with, of course, a lot of announceme
5
Speaking of Las Vegas
Fri, Mar 10th 2017 7:38a   Frank van der Linden
In 1 week I will leave for my second trip to the USA for an IBM Conference. This time it will be IBM InterConnect in Las Vegas. Not only to attend, but also to speak again. A friend of my will join me on this trip. We will fly to Los Angeles and drive up to Las Vegas. After the conference we will have some time get back to LAX, a sort of mini road trip. Out of my comfort zone IBM InterConnect is a much bigger conference, compared to IBM Connect, at the Mandalay Bay in Las Vegas. It is focused
0
New Release: Generic XPages and HTML Widget For IBM Connections 5.5
Thu, Mar 2nd 2017 5:41p   Frank van der Linden
Yesterday I have created a new release of the OpenNTF project, Generic XPages and HTML Widget For IBM Connections. There was a problem with the widgets in IBM Connections 5.5, which was caused by some tags who were not in the expected DOM structure and small problem in the javascript. But many thanks to Christoph Stoettner of Panagenda who found the solution and provided me the modified files to release. Christoph, Thank you very much for the time you spent on this. Want to try it out on your I




Created and Maintained by Yancy Lent - About - Planet Lotus Blog - Advertising - Mobile Edition