Seaside JQuery Ajax processing question

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

Seaside JQuery Ajax processing question

kmo
Can anyone help with a Seaside jQuery ajax issue?

I want to change the contents of a div when the mouse goes over a document element by means of an ajax call.

In this example, I have rendered a list of words as spans (one span per word). When the mouse goes over any span, I want to show the dictionary definition of the word in another div on the page. The dictionary definition has to be generated on the server side.

So I have to reference the current span ("this") in my ajax processing.

I find I can change the page contents as desired when the mouse moves over a span (see below) but I am completely clueless how to get the text of the span, the word itself, into the html I want to render.

renderContentOn: html
|aQuery anAjax|
        aQuery := html jQuery expression:'span'.
        anAjax := html jQuery ajax.
        anAjax script: [ :s | s << ( (s jQuery: #GlossViewer) html:'This was written by an ajax call')].
        aQuery onMouseEnter: anAjax asFunction.
       
        html div id:#TextViewer; class:'TextPane'; with:[self renderWordsAsSpans: html].
        html div id:#GlossViewer; class:'GlossPane'; with:'The grammatical analysis goes here'.

        html document addLoadScript: aQuery.

My basic problem is that I have no real idea of how data is passed back to my program in an ajax call and how I can reference it in my code. The seaside documentation is not bad on JQuery as a whole, but explanations and examples of ajax processing with Jquery and Seaside are not easily found.

If it's relevant I'm using Pharo 2.0 Summer and Seaside 3.

Thanks.

Ken
Reply | Threaded
Open this post in threaded view
|

Re: Seaside JQuery Ajax processing question

Stephan Eggermont-3
Hi Ken,

Doing this lookup serverside only works if the latency is low, i.e. not for a mobile site or one at the other side of the ocean. Only getting a hovertext can be done easier using the title attribute.

You can find some code showing how to use jQuery in Deltawerken and Storyboard (on ss3.gemtalksystems.com).

Stephan

Verstuurd vanaf mijn iPhone

> Can anyone help with a Seaside jQuery ajax issue?
>
> I want to change the contents of a div when the mouse goes over a document
> element by means of an ajax call.
>
> In this example, I have rendered a list of words as spans (one span per
> word). When the mouse goes over any span, I want to show the dictionary
> definition of the word in another div on the page. The dictionary definition
> has to be generated on the server side.
>
> So I have to reference the current span ("this") in my ajax processing.
>
> I find I can change the page contents as desired when the mouse moves over a
> span (see below) but I am completely clueless how to get the text of the
> span, the word itself, into the html I want to render.
>
> renderContentOn: html
> |aQuery anAjax|
>    aQuery := html jQuery expression:'span'.
>    anAjax := html jQuery ajax.
>    anAjax script: [ :s | s << ( (s jQuery: #GlossViewer) html:'This was
> written by an ajax call')].
>    aQuery onMouseEnter: anAjax asFunction.
>    
>    html div id:#TextViewer; class:'TextPane'; with:[self renderWordsAsSpans:
> html].
>    html div id:#GlossViewer; class:'GlossPane'; with:'The grammatical analysis
> goes here'.
>
>        html document addLoadScript: aQuery.
>
> My basic problem is that I have no real idea of how data is passed back to
> my program in an ajax call and how I can reference it in my code. The
> seaside documentation is not bad on JQuery as a whole, but explanations and
> examples of ajax processing with Jquery and Seaside are not easily found.

kmo
Reply | Threaded
Open this post in threaded view
|

Re: Seaside JQuery Ajax processing question

kmo
Stephan -

Thanks. Latency is not an issue and besides I'm as interested in the principle as I am in this example.

I obviously need to do more research. Thanks for the pointers.

Ken
Reply | Threaded
Open this post in threaded view
|

Re: Seaside JQuery Ajax processing question

Stephan Eggermont-3
In reply to this post by kmo
Hi Ken,

These seaside specific questions will find more response in the seaside mailing list

http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

Stephan
kmo
Reply | Threaded
Open this post in threaded view
|

Re: Seaside JQuery Ajax processing question

kmo
Thanks Stephan. I'll post questions there.
Reply | Threaded
Open this post in threaded view
|

Re: Seaside JQuery Ajax processing question

Paul DeBruicker
In reply to this post by kmo
I cc'd the Seaside list where you should ask these things directly.


In the span you want to trigger an ajax callback & load using the
#onMouseEnter: method.  It should look something like
       
html span
        onMouseEnter:
                ((html jQuery id: 'GlossViewer') load
                        html: [ :h | self renderAnalyzedWord: h ];
                        callback: [ :word | self processWord: word ] value: html jQuery this
text);
        with: 'myWord'




But if you have lots of words you should use the #on:do: method to catch
the hover events on the #TextViewer div rather than setting an event on
each span.


and you don't need to add it as a load script.


On 08/25/2013 05:31 AM, kmo wrote:

> Can anyone help with a Seaside jQuery ajax issue?
>
> I want to change the contents of a div when the mouse goes over a document
> element by means of an ajax call.
>
> In this example, I have rendered a list of words as spans (one span per
> word). When the mouse goes over any span, I want to show the dictionary
> definition of the word in another div on the page. The dictionary definition
> has to be generated on the server side.
>
> So I have to reference the current span ("this") in my ajax processing.
>
> I find I can change the page contents as desired when the mouse moves over a
> span (see below) but I am completely clueless how to get the text of the
> span, the word itself, into the html I want to render.
>
> renderContentOn: html
> |aQuery anAjax|
> aQuery := html jQuery expression:'span'.
> anAjax := html jQuery ajax.
> anAjax script: [ :s | s << ( (s jQuery: #GlossViewer) html:'This was
> written by an ajax call')].
> aQuery onMouseEnter: anAjax asFunction.
>
> html div id:#TextViewer; class:'TextPane'; with:[self renderWordsAsSpans:
> html].
> html div id:#GlossViewer; class:'GlossPane'; with:'The grammatical analysis
> goes here'.
>
>         html document addLoadScript: aQuery.
>
> My basic problem is that I have no real idea of how data is passed back to
> my program in an ajax call and how I can reference it in my code. The
> seaside documentation is not bad on JQuery as a whole, but explanations and
> examples of ajax processing with Jquery and Seaside are not easily found.
>
> If it's relevant I'm using Pharo 2.0 Summer and Seaside 3.
>
> Thanks.
>
> Ken
>
>
>
> --
> View this message in context: http://forum.world.st/Seaside-JQuery-Ajax-processing-question-tp4704949.html
> Sent from the Pharo Smalltalk Users mailing list archive at Nabble.com.
>