Complex popup with JQuery

Hi,

I want to create a complex popup with JQuery. Until now were simple JQuery
popups like confirmation dialog, information dialog and so on ("one click
and close dialog").

But now a complex popup is required and the web user will perform various
different operation on the popup window requiring information from the
server.

Is there anyway to tell Seaside to update only the component of the JQuery
popup ?
(using some high level AJAX library for Seaside - maybe this does not exist)

Or i have to do an AJAX query for each Seaside component of the popup and
populate the required changes ?
I think the ultimate questions is: can this be done for a whole component or
i have to handle an AJAX query for each individual component in the popup.

It will useful to know how other Seaside user implement complex JQuery
popups.

regards,
bruno
<http://forum.world.st/file/t111409/popup-01.jpg>




--
Sent from: http://forum.world.st/Seaside-General-f86180.html
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

Bruno,

if you do a

(html ajax callback: ()) onComplete:(html jQuery: idOfRootCompForRedraw)
load html: [html render: rootComponentForRedraw]

(not tested, just from my head)
this should redraw the complete subtree of rootComponentForRedraw. If
this component is inside your popup, the popup will be redrawn. So you
do do both: just redraw individual components or redraw complex
component trees.

One thind to keep in mind, however, is that you need to be careful when
using forms in popups. A Form will only submit its own contents, and it
will redraw the whole page. So forms with submitbuttons etc. are a no-go
for popups, or you need to work some JS magic around that.

HTH

Joachim



Am 16.03.18 um 20:35 schrieb BrunoBB:

_______________________________________________
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

2018-03-17 4:12 GMT-03:00 [hidden email] <[hidden email]>:
> Bruno,
>
> if you do a
>
> (html ajax callback: ()) onComplete:(html jQuery: idOfRootCompForRedraw)
> load html: [html render: rootComponentForRedraw]
>
> (not tested, just from my head)

The "fixed" version would be something like this:

onClick: ((html jQuery ajax callback: ["..."]) onComplete: (
                 (html jQuery id: idOfRootCompForRedraw)
                   load html: [:h | h render: rootComponentForRedraw]))

Another alternative is to execute the callback within a script
response, saving one extra HTTP roundtrip for the "onComplete".

onClick: (html jQuery ajax script: [:s |
                "your callback actions".
                (html jQuery id: idOfRootCompForRedraw) html: [:h | h
render: rootComponentForRedraw]
               ])

> this should redraw the complete subtree of rootComponentForRedraw. If this
> component is inside your popup, the popup will be redrawn. So you do do
> both: just redraw individual components or redraw complex component trees.

I managed to get a similar behavior using Bootstrap's Popover plugin
<https://getbootstrap.com/docs/3.3/javascript/#popovers>, where the
popover is dynamically attached and its content is loaded from the
server once opened (so you get an "updated" content every time you
open it).

> One thind to keep in mind, however, is that you need to be careful when
> using forms in popups. A Form will only submit its own contents, and it
> will redraw the whole page. So forms with submitbuttons etc. are a no-go
> for popups, or you need to work some JS magic around that.

Submit buttons cause a full page reload, unless you handle the submit
event and return false at the end.
Why I do these days is submit almost everything using
#serializeChildren: on the form, triggered by a button or anchor that
IS NOT a submit button.

There are a lot of "recipes" like this that we should share in the
Seaside wiki or somewhere.

Regards,
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside