Changes for page Using jQuery and jQuery UI

Summary

• Page properties (1 modified, 0 added, 0 removed)

Details

Page properties

Content

...	...	@@ -1,13 +1,11 @@
1		-jQuery and jQuery UI are provided as Webjars in XWiki, and so can be easily integrated into XWiki using RequireJS ([[see here>>http://platform.xwiki.org/xwiki/bin/view/DevGuide/IntegratingJavaScriptLibraries]] for details).
	1	+jQuery and jQuery UI are provided as Webjars in XWiki, and so can be easily integrated into XWiki using RequireJS ([[see here>>doc:DevGuide.IntegratingJavaScriptLibraries]] for details).
2	2
3	3	The location of the jQuery webjar is declared in the common page template in javascript.vm, so it can be used simply with
4		-{{code}}
5		-require(['jquery'], function($) { jQuery code });
6		-{{/code}}
	4	+{{code}}require(['jquery'], function($) { jQuery code });{{/code}}
7	7
8		-For other webjars such as jQuery UI the location needs to be supplied to require. This is made easier with the webjars service, which can give the location of a specific library with $services.webjars.url() ([[API>>http://nexus.xwiki.org/nexus/service/local/repositories/releases/archive/org/xwiki/platform/xwiki-platform-webjars/7.0/xwiki-platform-webjars-7.0-javadoc.jar/!/org/xwiki/webjars/script/WebJarsScriptService.html]]). See [[this snippet>>http://snippets.xwiki.org/xwiki/bin/view/Extension/Requirejs+and+Webjars+workaround+for+relative+path+dependencies]] for move infromation.
	6	+For other webjars such as jQuery UI the location needs to be supplied to require. This is made easier with the webjars service, which can give the location of a specific library with $services.webjars.url() ([[API>>http://nexus.xwiki.org/nexus/service/local/repositories/releases/archive/org/xwiki/platform/xwiki-platform-webjars/7.0/xwiki-platform-webjars-7.0-javadoc.jar/!/org/xwiki/webjars/script/WebJarsScriptService.html]]). See [[this snippet>>doc:snippets:Extension.Requirejs and Webjars workaround for relative path dependencies]] for move infromation.
9	9
10		-== Example==
	8	+== Example ==
11	11
12	12	The following shows a minimal example of using a [[jQuery UI spinner>>http://api.jqueryui.com/spinner/]] within an XWiki page.
13	13
...	...	@@ -26,6 +26,7 @@
26	26	== Javascript ==
27	27
28	28	The actual jQuery code can be attached to the page as a Javascript Extension object. Go to the page's Object Editor and add an object of type XWiki.JavaScriptExtension. The code body could be:
	27	+
29	29	{{code}}
30	30	require(['jquery',"$services.webjars.url('jquery-ui', 'jquery-ui.js')"], function($) {
31	31	$( "#spinner" ).spinner();
...	...	@@ -36,6 +36,6 @@
36	36
37	37	= References =
38	38
39		-* [[Integrating Javascript Libraries in XWiki>>http://platform.xwiki.org/xwiki/bin/view/DevGuide/IntegratingJavaScriptLibraries]]
40		-* More information about using [[XWiki Javascript events>>http://platform.xwiki.org/xwiki/bin/view/DevGuide/JavaScriptAPI#HRequireJSandjQueryAPIs]]
41		-* [[Incorporating Javascript into skin extensions>>http://platform.xwiki.org/xwiki/bin/view/DevGuide/SkinExtensionsTutorial]]
	38	+* [[Integrating Javascript Libraries in XWiki>>doc:DevGuide.IntegratingJavaScriptLibraries]]
	39	+* More information about using [[XWiki Javascript events>>doc:DevGuide.JavaScriptAPI]]
	40	+* [[Incorporating Javascript into skin extensions>>doc:DevGuide.SkinExtensionsTutorial]]