Using jQuery noConflict with flowplayer tools

Question

hi, i appear to be in the midst of troubleshooting a namespace conflict of the $() function. i'm using validate 1.4. i've attempted to use jQuery's noConflict() method, but i'm still missing something.

<link href="/c/jq/ui.all.css" rel="stylesheet" type="text/css" />
<script src="http://cdn.jquerytools.org/1.1.2/full/
jquery.tools.min.js" type="text/javascript"></script>
<script src="/js/jquery.ui.core.js" type="text/javascript"></script>
<script src="/js/jquery.ui.tabs.js" type="text/javascript"></script>
<script src="/js/jquery.ui.accordion.js" type="text/javascript"></
script>
<script type="text/javascript">
    /* <![CDATA[ */
        var $j = jQuery.noConflict();
    /* ]]> */
</script>
<script src="/js/cilp.js" type="text/javascript"></script>
<script src="/js/jquery.validate.js" type="text/javascript"></script>
<script src="/js/cilp/validate.js" type="text/javascript"></script>

if i comment out the last two external references (the validate files)
all is well.  here is the validate.js file:

$j(function($) {
    $j.extend( $.validator.messages, {
        required: 'Required'
    } );

    $j( '#qotw-form' ).validate( {
        rules: {
            'qotw-options': 'required'
        },

        submitHandler: function() {
            var answer = $j( "input[name='qotw-options']:checked" ).val();
            var correct = answer == 'c' ? true : false;
            var res = correct ? 'Correct!' : 'Try again!';
            $j( '#qotw-answer' ).html(res);
        },

        focusCleanup: true

        //, debug: true
    } );

} );

hopefully i'm doing something silly. i just wish i knew an easy way to namespace a given plugin to avoid this problem. thanks for any help!

Answer 1

You are not passing in the value of $ to $j(function($) {

You need to have something like:

$j(function($,$j) {
    $j.extend( $.validator.messages, {
        required: 'Required'
    } );
[...]

} )($,$j);

Otherwise, the $ you pass in will always be undefined. Assuming, you are passing in the flowplayer $ otherwise, pass in the $j and change the inner variable to $j

Answer 2

I haven't done much with noConflict,but shouldn't this:

$j.extend( $.validator.messages, {

be

$j.extend( $j.validator.messages, {