Hack to use jQuery AMD widgets and Dojo together

	<xp:this.resources>

		<!-- temporary redefine define.amd object  (Dojo AMD loader) -->
		<xp:script clientSide="true" type="text/javascript">
			<xp:this.contents><![CDATA[${javascript:"if (typeof define === 'function' && define.amd) {if(define.amd.vendor =='dojotoolkit.org'){define._amd = define.amd;delete define.amd;}}";}]]></xp:this.contents>
		</xp:script>

		<!-- load jquery AMD enabled widgets -->
		<xp:script src="/select2.js" clientSide="true"></xp:script>

		<!-- restore define.amd object (Dojo AMD loader) -->
		<xp:script clientSide="true">
			<xp:this.contents><![CDATA[${javascript:"if (typeof define === 'function' && define._amd) {define.amd = define._amd; delete define._amd;}"}]]></xp:this.contents>
		</xp:script>

	</xp:this.resources>






The Dojo AMD loader in Xpages is causing issues with newer jQuery widgets. Examples with issues are jQuery Mobile, Select2 v4.0.0 and Bootbox (modal alert boxes).
Mark Roden blogged about this issue here: http://xomino.com/2015/06/02/select2-v4-needs-amd-fixing-in-domino-r9-xpages/

But what if you don't want to use "resource aggregation" and also don't want to manually edit these Javascripts? This is an alternative option.

The first script tag will temporary disable the Dojo AMD loader by removing "define.amd". After this script tag you should add all jQuery widgets that cause issues.
Last step is to add the a script tag to restore de Dojo AMD loader. That's it!


XPages
F. Kranenburg
June 3, 2015 4:01 PM
Rating
291

All code submitted to OpenNTF XSnippets, whether submitted as a "Snippet" or in the body of a Comment, is provided under the Apache License Version 2.0. See Terms of Use for full details.



No comments yetLogin first to comment...