Hi,

> I thought scriptaculous issues come
> here :P

They do. (No need for sticking one's tongue out, though.)

To use jQuery on the same page as script.aculo.us, you have to use
jQuery.noConflict to return the `$` symbol back to Prototype.
Otherwise, script.aculo.us won't work, as it uses `$` assuming it will
be Prototype's `$`. Looking at the parts of your code you quoted, you
_seem_ to be using `$` as a global symbol referring to jQuery, which
won't work.

Normally, when using jQuery, `jQuery` and `$` are both global symbols
(window properties) aliasing one another, but using noConflict
releases `$` back to whatever had it before jQuery loaded. It doesn't
release the `jQuery` symbol, though, so you can still use jQuery via
that rather than `$`:

    jQuery.noConflict();
    // ...
    jQuery("#foo").css({color: "blue"});

But don't worry, you don't have to do a massive search-and-replace on
your code changing `$` to `jQuery`, you can just re-alias it within a
constrained scope and then put all your code inside that scope. (This
is a good idea _anyway_, to avoid polluting the global namespace.) So
you can use checkLogin and your other code as written:

    jQuery.noConflict();
    (function($) {
        // Here, $ === jQuery
        function checkLogin() {
            // ...
        }
    })(jQuery);
    // Here, $ !== jQuery, it's Prototype's $ function

That works by defining a scoping function and immediately executing
it, passing the jQuery function into it as an argument that it
receives as $ -- shadowing the global within the closure.

If you don't need _any_ of your code to be executed until the DOM is
ready, you can do this to make it really short:

    jQuery.noConflict()(function($) {
        // Here, $ === jQuery
        function checkLogin() {
            // ...
        }
    });
    // Here, $ !== jQuery, it's Prototype's $ function

That works because `noConflict` returns the `jQuery` function, which
when called with a function argument[2] sets up the DOM ready
callback, and jQuery passes the DOM ready callback the jQuery function
as an argument.

If you are correctly using noConflict and still having trouble, I'd
suggest doing up a minimalist, self-contained test page[3]
demonstrating the problem and posting it to Pastie.org, jsbin.com,
jsfiddle.net, or whatever, and replying with the link.

[1] http://api.jquery.com/jQuery.noConflict/
[2] http://api.jquery.com/jQuery/#jQuery3
[3] http://proto-scripty.wikidot.com/self-contained-test-page

HTH,
--
T.J. Crowder
Independent Software Consultant
tj / crowder software / com
www.crowdersoftware.com


On Jul 19, 2:26 pm, Silvershaft <samppalehtonenle...@gmail.com> wrote:
> Yes but I got the problem with the effect thing, why won't the
> BlindDown work, I even tried to make another function and called it
> from onClick but nothing.,. I thought scriptaculous issues come
> here :P
>
> On 19 heinä, 16:24, Guillaume Lepicard <guillaume.lepic...@gmail.com>
> wrote:
>
>
>
> > hi Silvershaft,
>
> > You're on the wrong list : you're obviously using jQuery...
>
> > On Mon, Jul 19, 2010 at 3:06 PM, Silvershaft
> > <samppalehtonenle...@gmail.com>wrote:
>
> > > Hey I got a little problem with my div what should appear if the login
> > > fails, the alert will show up meaning that the function works, but the
> > > blinddown doesn't work. Code for checkLogin function
>
> > > function checkLogin()
> > > {
> > >        var username = $('#name').attr('value');
> > >        var password = $('#password').attr('value');
> > >        alert(username);
>
> > > $.ajax({
> > >  type: "POST",
> > >  url: "check.php",
> > >  data: "username=" + username + "password=" + password,
>
> > >  success: function(data) {
> > >        alert('works!');
> > >    Effect.BlindDown('error');
> > >  },
>
> > >  error: function() {
> > >    alert('failure');
> > >  }
> > > });
>
> > > Code for my DIV
> > >   <div id="error" style="width:25%; height:40px; margin-left:38%;
> > > margin-top:1%; margin-right:auto; font-size:140%; background:#F33;
> > >                height:30px;
> > >                font-weight:bold;
> > >                color:#000;
> > >                background-color:#F30;
> > >        display:none;">
> > >        Incorrect login!
> > > </div>
>
> > > And finally the code for the button
> > >            <p>&nbsp;
> > >            <a href="#" onclick="checkLogin()"
> > > onmouseover="test(this)"
> > >            ><img src="images/login2.png" name="submitbtn" border=0
> > > alt="Submit" id="img1" style="width:25%; height:31px;"  /></a></p>
>
> > > I can't seem to understand why it doesn't work, I think it's just a
> > > small problem but I don't get it.. Thanks in advance!
>
> > > --
> > > You received this message because you are subscribed to the Google Groups
> > > "Prototype & script.aculo.us" group.
> > > To post to this group, send email to
> > > prototype-scriptacul...@googlegroups.com.
> > > To unsubscribe from this group, send email to
> > > prototype-scriptaculous+unsubscr...@googlegroups.com<prototype-scriptaculou
> > >  s%2bunsubscr...@googlegroups.com>
> > > .
> > > For more options, visit this group at
> > >http://groups.google.com/group/prototype-scriptaculous?hl=en.

-- 
You received this message because you are subscribed to the Google Groups 
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptacul...@googlegroups.com.
To unsubscribe from this group, send email to 
prototype-scriptaculous+unsubscr...@googlegroups.com.
For more options, visit this group at 
http://groups.google.com/group/prototype-scriptaculous?hl=en.

Reply via email to