Dear Wiki user,

You have subscribed to a wiki page or wiki category on "Tapestry Wiki" for 
change notification.

The following page has been changed by PahneAndy:
http://wiki.apache.org/tapestry/Tapestry5HowToIntegrateJQuery

New page:
How to integrate [http://jquery.com/ jQuery] with Tapestry 5.[[BR]]

== Introduction ==

Unfortunatly it is not possible to use a current jQuery release out of the box 
with Tapestry 5. But only one small step is necessary to make them play 
together well.

It is necessary to adjust the jQuery sources, because Tapestry 5 uses the 
Prototype Javascript library. Both javascript libraries make use of the 
variable {{{ $ }}} in the global javascript namespace. See the 
[http://docs.jquery.com/Using_jQuery_with_Other_Libraries jQuery docs] for a 
more detailed explanation of the problem.


== Adjusting jQuery ==

1. Download the current jQuery release. Be sure to use the minimized version 
for production use

2. Open the file and append {{{  jQuery.noConflict();  }}} on a separate line 
at the very end of the file

Your file should look like this:

{{{
/*
 * jQuery JavaScript Library v1.3.2
 * http://jquery.com/
 *
 * Copyright (c) 2009 John Resig
 * Dual licensed under the MIT and GPL licenses.
 * http://docs.jquery.com/License
 *
 * Date: 2009-02-19 17:34:21 -0500 (Thu, 19 Feb 2009)
 * Revision: 6246
 */
(function(){var l=this,g,y=l.jQuery,p=l.$,o=l.jQuery=l.$=function(E,F){return 
new .........

/*
 * Sizzle CSS Selector Engine - v0.9.3
 *  Copyright 2009, The Dojo Foundation
 *  Released under the MIT, BSD, and GPL Licenses.
 *  More information: http://sizzlejs.com/
 */
(function(){var R=/((?:\((?:\([^()]+\)|[^()]+)+\)|\[(?:\[[^[\]]*\]|['"]........

/*
 * Must run in noConflict mode! 
 */
jQuery.noConflict();


}}}

That's it. Now you can use this script like you use any other javascript on 
your Tapestry 5 pages. 

Unfortunatly the {{{ $ }}} name is still reserved for Prototype. The jQuery 
documentation has more information on how to overcome this limitation.

== Creating a Component Library ==

You may want to create a component library for your adjusted jQuery source and 
the most useful plugins that you'll need in your projects. If you don't know 
how to do that, see Tapestry5HowToCreateYourOwnComponentLibrary

We have choosen to create a library that contains jQuery core, the UI plugin 
and the well known form plugin. Using any of these is as simple as this:

{{{
    @IncludeJavaScriptLibrary({
            "classpath:/x/y/z/jquery/components/jquery.min.js",
            "classpath:/x/y/z/jquery/components/jQuery.forms.js",
        }
)
public class SomePageClass {

}
}}}






== Related Mailing List Threads ==

[http://tapestry.markmail.org/message/zqvcgktzg4nxluos?q=jQuery#query:jQuery+page:1+mid:zqkeztubr7tuv7b7+state:results
 Thread integration jQuery components]

[http://tapestry.markmail.org/message/pgyn7jojrmzepjeo?q=jQuery&page=2#query:jQuery+page:2+mid:xjxead7q7xuacfs2+state:results
 Thread using jQuery in 5.0.18]

---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]

Reply via email to