Thursday, October 3, 2013

Custom Callouts in the SharePoint 2013 Metro UI, Part 6: How to update custom callout content on its opening

Previous: Custom Callouts in the SharePoint 2013 Metro UI, Part 5: Modification of the Document Library Item Callout Content
Back to contents.


How to update custom callout content on its opening

Summary

This article describes my approach to modification of the content inside the custom callout in real time - on every opening.

The Problem

Recently I was asked a question: is there any way to update custom callout's content on every opening because it's a quite useful and realistic scenario.

The Solution

I've made some research and have found that there's an addEventCallback method that allows us to subscribe to some events in the callout's lifecycle. Here's my solution: http://pastebin.com/ZM4Xs7Zj Please note that there are 4 available events: 'opening', 'opened', 'closing' and 'closed'. Another important part is that you have to find the element with the specific generated ID to change the real content of the callout without break of the other structure elements such as title and close button.