How to write jQuery $.ready scripts?

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
7 messages Options
Reply | Threaded
Open this post in threaded view
|

How to write jQuery $.ready scripts?

drush66
I guess I am a bit dense right now, so forgive me if I am askig obvious.

So, I would like to have few jQuery operations executed when DOM is
ready. My best so far is:

renderContentOn: html
        html script: (html jQuery
                                ready: ( (html jQuery: #glavati)
                                                text: 'Njurko';
                                                on: 'click' do: 'alert("gotcha");' )).

        html script: (html  jQuery
                        ready: 'alert("aha");' ).

        html heading
                level: 1;
                id: #glavati;
                with: 'Gurko'.

Which does get job done, but in generated html it opens javascript tag
twice which is kind of ugly (especially if I would have more
operations in the future). So how would I structure code above so that
generated code has just one script tag? Or even better, has one script
tag, and also just one $.ready with 2 statements in it?

Or I am doing it backwards and should put all that code in plain
javascript file and just include it as is?

Am I missing something or there is no Seaside binding for
jQuery(..).click() function? (I am using Dolphin port of Seaside which
is 2.9.something)

Many thanks!

rush
http://www.cloud208.com/
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Reply | Threaded
Open this post in threaded view
|

Re: How to write jQuery $.ready scripts?

Julian Fitzell-2
Hi Davorin,

Try #addLoadScript: - look for senders if you need examples.

Cheers,

Julian

On Fri, Jan 1, 2010 at 2:31 PM, Davorin Rusevljan
<[hidden email]> wrote:

> I guess I am a bit dense right now, so forgive me if I am askig obvious.
>
> So, I would like to have few jQuery operations executed when DOM is
> ready. My best so far is:
>
> renderContentOn: html
>        html script: (html jQuery
>                                ready: ( (html jQuery: #glavati)
>                                                text: 'Njurko';
>                                                on: 'click' do: 'alert("gotcha");' )).
>
>        html script: (html  jQuery
>                        ready: 'alert("aha");' ).
>
>        html heading
>                level: 1;
>                id: #glavati;
>                with: 'Gurko'.
>
> Which does get job done, but in generated html it opens javascript tag
> twice which is kind of ugly (especially if I would have more
> operations in the future). So how would I structure code above so that
> generated code has just one script tag? Or even better, has one script
> tag, and also just one $.ready with 2 statements in it?
>
> Or I am doing it backwards and should put all that code in plain
> javascript file and just include it as is?
>
> Am I missing something or there is no Seaside binding for
> jQuery(..).click() function? (I am using Dolphin port of Seaside which
> is 2.9.something)
>
> Many thanks!
>
> rush
> http://www.cloud208.com/
> _______________________________________________
> seaside mailing list
> [hidden email]
> http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
>
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Reply | Threaded
Open this post in threaded view
|

Re: How to write jQuery $.ready scripts?

Lukas Renggli
In reply to this post by drush66
> So, I would like to have few jQuery operations executed when DOM is
> ready. My best so far is:
>
> renderContentOn: html
>        html script: (html jQuery
>                                ready: ( (html jQuery: #glavati)
>                                                text: 'Njurko';
>                                                on: 'click' do: 'alert("gotcha");' )).
>
>        html script: (html  jQuery
>                        ready: 'alert("aha");' ).
>
>        html heading
>                level: 1;
>                id: #glavati;
>                with: 'Gurko'.

Don't use the JQuery-ready function in Seaside. This gives
unpredictable results. As Julian suggested use #addLoadScript:,
Seaside has its own mechanism to execute scripts. Also check our
JQuery presentation for additional information:
<http://www.slideshare.net/esug/jquery-in-seaside>.

> Or I am doing it backwards and should put all that code in plain
> javascript file and just include it as is?

That is a possibility, but often not that practical if you have lots
of different fine grande behavior and interaction back with the
server.

> Am I missing something or there is no Seaside binding for
> jQuery(..).click() function? (I am using Dolphin port of Seaside which
> is 2.9.something)

There is #onClick: at least in the latest version of JQuery for Seaside.

So in the end your method should look like:

renderContentOn: html
       html document
               addLoadScript: 'alert("aha")'.
       html heading
               level: 1;
               script: (html jQuery this
                     text: 'Njurko';
                     onClick: 'alert("gotcha")');
               with: 'Gurko'.

Lukas

--
Lukas Renggli
http://www.lukas-renggli.ch
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Reply | Threaded
Open this post in threaded view
|

Re: How to write jQuery $.ready scripts?

drush66
On Sat, Jan 2, 2010 at 11:12 AM, Lukas Renggli <[hidden email]> wrote:
> Don't use the JQuery-ready function in Seaside. This gives
> unpredictable results. As Julian suggested use #addLoadScript:,
> Seaside has its own mechanism to execute scripts. Also check our
> JQuery presentation for additional information:
> <http://www.slideshare.net/esug/jquery-in-seaside>.

ah, this presentation is great! One question though, you say in
presentation that we should forget about unobtrusive javascript. Is it
that you consider it somehow harmfull or just not that important in
Seaside, and why?

as for addLoadScript, it seems to attach itself to body onLoad DOM
event. Am I correct that this will execute only after everything has
been downoloaded, including banners and such? In that case I would
rather use jQUery.ready() since it would provide much quicker and
reliable execution. But if you say it is off limits than I should
forget about it. Is there maybe some cheatsheet that would allow me to
use .ready safely with Seaside?

>> Am I missing something or there is no Seaside binding for
>> jQuery(..).click() function? (I am using Dolphin port of Seaside which
>> is 2.9.something)
>
> There is #onClick: at least in the latest version of JQuery for Seaside.

yes, but that also bounds to DOM onClick, instead of using
jQuery.click which might be argued to be more flexible (allows easy
attachment of several handlers), and to some extent normalizes
incompatibilities in browser event handlings.

Thanks a lot, to both of you!

rush
http://www.cloud208.com/
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Reply | Threaded
Open this post in threaded view
|

Re: How to write jQuery $.ready scripts?

Lukas Renggli
> On Sat, Jan 2, 2010 at 11:12 AM, Lukas Renggli <[hidden email]> wrote:
>> Don't use the JQuery-ready function in Seaside. This gives
>> unpredictable results. As Julian suggested use #addLoadScript:,
>> Seaside has its own mechanism to execute scripts. Also check our
>> JQuery presentation for additional information:
>> <http://www.slideshare.net/esug/jquery-in-seaside>.

In fact there is also a video, the slides alone are probably not that useful:

     http://mimer.msc.se/esug/M2U00065.mp4

> ah, this presentation is great! One question though, you say in
> presentation that we should forget about unobtrusive javascript. Is it
> that you consider it somehow harmfull or just not that important in
> Seaside, and why?

It is just not that important. In Seaside we try to encapsulate views
as much as possible in components and keep them independent of each
other and reusable in different contexts. Also when you want to have
interaction from client to server, the whole unobtrusive thing gets in
the way.

There is nothing that prevents you from using unobtrusive Javascript.
If you want you can still use it, especially for simple interactions
and effects you might still find it useful.

> as for addLoadScript, it seems to attach itself to body onLoad DOM
> event. Am I correct that this will execute only after everything has
> been downoloaded, including banners and such? In that case I would
> rather use jQUery.ready() since it would provide much quicker and
> reliable execution. But if you say it is off limits than I should
> forget about it. Is there maybe some cheatsheet that would allow me to
> use .ready safely with Seaside?

The problem is that when you use the JQuery ready-function (or for
that matter the Prototype dom:ready event) things become
unpredictable. Seaside cannot guarantee anymore the order in which
scripts get executed, if you are not a Javascript expert you likely
run into problems ...

I've however created an issue (for this long known problem) right
after I replied to your mail this morning:
<http://code.google.com/p/seaside/issues/detail?id=521>

>> There is #onClick: at least in the latest version of JQuery for Seaside.
>
> yes, but that also bounds to DOM onClick, instead of using
> jQuery.click which might be argued to be more flexible (allows easy
> attachment of several handlers), and to some extent normalizes
> incompatibilities in browser event handlings.

No, that #onClick: is on the JQuery object, it results in exactly the
same behavior as your call to #on:do:.

Also note that Seaside automatically supports multiple #onClick: calls
on DOM elements, so you can safely call it multiple times. The scripts
will just concatenated.

Lukas

--
Lukas Renggli
http://www.lukas-renggli.ch
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Reply | Threaded
Open this post in threaded view
|

Re: How to write jQuery $.ready scripts?

Lukas Renggli
> In fact there is also a video, the slides alone are probably not that useful:
>
>     http://mimer.msc.se/esug/M2U00065.mp4

Forward to 11:50 in the video, where the actual jQuery presentation starts.

Lukas

--
Lukas Renggli
http://www.lukas-renggli.ch
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
Reply | Threaded
Open this post in threaded view
|

Re: How to write jQuery $.ready scripts?

drush66
On Sat, Jan 2, 2010 at 2:08 PM, Lukas Renggli <[hidden email]> wrote:
>> In fact there is also a video, the slides alone are probably not that useful:
>>
>>     http://mimer.msc.se/esug/M2U00065.mp4
>
> Forward to 11:50 in the video, where the actual jQuery presentation starts.

that has helped me a lot, thanks. Fact that you generate jQuery
mapping from the jQuery web site is quite cool.

Davorin Rusevljan
http://www.cloud208.com/
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside