You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by Joseph Pachod <jp...@thomas-daily.de> on 2010/09/07 15:39:27 UTC
How to run some JS only once after Ajax rendering is done ?
hi
I've some components which require some client side javascript which
require one init call (for all) to be initialized. In fact, this init
call uses selectors to get at the components to work one.
My issues is with Ajax. It happens that, during it, some new components
required this init call are added.
As such, how could I trigger it only once per Ajax request ?
The pattern I'm targeting is for each component to initialize this way
to have a behavior in which something would be added only in Ajax
request cycle. For non ajax request cycle, I use jquery to do the init,
through:
$(document).ready(function(){
$.initEdit();
});
When trying to reach this goal, I tried to run the init call through an
header contributor, but the call is then done before my content is put
on the page, making it useless:
public abstract class AbstractEditBehavior extends AbstractBehavior
{
public AbstractEditBehavior(final AbstractTextComponent<?> component)
{
component.add(JQueryDependency.CORE);
component.add(new HeaderContributor(new IHeaderContributor()
{
public void renderHead(final IHeaderResponse response)
{
if ((AjaxRequestTarget.get() != null))
{
response.renderJavascript("jQuery.initEdit();", "ID"
+ response.hashCode());
}
}
}));
}
(...)
thanks in advance
best
--
Joseph Pachod
IT
THOMAS DAILY GmbH
Adlerstraße 19
79098 Freiburg
Deutschland
T + 49 761 3 85 59 506
F + 49 761 3 85 59 550
E joseph.pachod@thomas-daily.de
www.thomas-daily.de
Geschäftsführer/Managing Directors:
Wendy Thomas, Susanne Larbig
Handelsregister Freiburg i.Br., HRB 3947
Registrieren Sie sich unter https://www.thomas-daily.de/user/sign-in für die TD Morning News, eine kostenlose Auswahl aktueller Themen aus TD Premium, morgens ab 9:15 in Ihrer Mailbox.
Aktuelle Presseinformationen für die TD Morning News und TD Premium nimmt unsere Redaktion unter redaktion@thomas-daily.de entgegen.
Redaktionsschluss für die TD Morning News ist täglich um 8:45.
Register free of charge at https://www.thomas-daily.de/user/sign-in to have the TD Morning News, a selection of the latest topics from TD Premium, delivered to your mailbox from 9:15 every morning.
Our editorial department receives the latest press releases for the TD Morning News and TD Premium at redaktion@thomas-daily.de. The editorial deadline for the TD Morning News is 8.45am daily.
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: How to run some JS only once after Ajax rendering is done ?
Posted by Joseph Pachod <jp...@thomas-daily.de>.
Bernhard Schauer wrote:
> I think you could do it as follows. The js function 'bindYourEvent()'
> is called after the the components that are added to the
> AjaxRequestTarget are 're-painted'.
>
> form.add(new AjaxButton("set") {
> @Override
> protected void onSubmit(final AjaxRequestTarget target,
> final Form<?> form) {
> target.appendJavascript("bindYourEvent();");
> }
>
> });
>
> mfg Bernhard
hi Bernard
The issue with this approach is that I would then have to think of
adding the JS every time some re rendered components need some init call.
However, as BUQUET Fabrice said, it works with
IHeaderResponse.renderOnDomReadyJavascript.
thanks anyway
++
joseph
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: How to run some JS only once after Ajax rendering is done ?
Posted by Bernhard Schauer <be...@openforce.com>.
I think you could do it as follows. The js function 'bindYourEvent()' is
called after the the components that are added to the AjaxRequestTarget
are 're-painted'.
form.add(new AjaxButton("set") {
@Override
protected void onSubmit(final AjaxRequestTarget target,
final Form<?> form) {
target.appendJavascript("bindYourEvent();");
}
});
mfg Bernhard
Joseph Pachod schrieb:
> hi
>
> I've some components which require some client side javascript which
> require one init call (for all) to be initialized. In fact, this init
> call uses selectors to get at the components to work one.
>
> My issues is with Ajax. It happens that, during it, some new
> components required this init call are added.
>
> As such, how could I trigger it only once per Ajax request ?
>
> The pattern I'm targeting is for each component to initialize this way
> to have a behavior in which something would be added only in Ajax
> request cycle. For non ajax request cycle, I use jquery to do the
> init, through:
> $(document).ready(function(){
> $.initEdit();
> });
>
> When trying to reach this goal, I tried to run the init call through
> an header contributor, but the call is then done before my content is
> put on the page, making it useless:
> public abstract class AbstractEditBehavior extends AbstractBehavior
> {
> public AbstractEditBehavior(final AbstractTextComponent<?> component)
> {
> component.add(JQueryDependency.CORE);
> component.add(new HeaderContributor(new IHeaderContributor()
> {
> public void renderHead(final IHeaderResponse response)
> {
> if ((AjaxRequestTarget.get() != null))
> {
> response.renderJavascript("jQuery.initEdit();", "ID"
> + response.hashCode());
> }
> }
> }));
>
> }
> (...)
>
> thanks in advance
> best
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: How to run some JS only once after Ajax rendering is done ?
Posted by Joseph Pachod <jp...@thomas-daily.de>.
Fabrice BUQUET wrote:
> Maybe you can try IHeaderResponse.renderOnDomReadyJavascript
>
Thanks a lot, it did it :)
It wasn't too obvious that Wicket checks in this given method for not
rendering twice the same javascript.
Great anyway, thanks again :)
++
joseph
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: How to run some JS only once after Ajax rendering is done ?
Posted by Fabrice BUQUET <fa...@gmail.com>.
Maybe you can try IHeaderResponse.renderOnDomReadyJavascript
2010/9/7 Joseph Pachod <jp...@thomas-daily.de>
> hi
>
> I've some components which require some client side javascript which
> require one init call (for all) to be initialized. In fact, this init call
> uses selectors to get at the components to work one.
>
> My issues is with Ajax. It happens that, during it, some new components
> required this init call are added.
>
> As such, how could I trigger it only once per Ajax request ?
>
> The pattern I'm targeting is for each component to initialize this way to
> have a behavior in which something would be added only in Ajax request
> cycle. For non ajax request cycle, I use jquery to do the init, through:
> $(document).ready(function(){
> $.initEdit();
> });
>
> When trying to reach this goal, I tried to run the init call through an
> header contributor, but the call is then done before my content is put on
> the page, making it useless:
> public abstract class AbstractEditBehavior extends AbstractBehavior
> {
> public AbstractEditBehavior(final AbstractTextComponent<?> component)
> {
> component.add(JQueryDependency.CORE);
> component.add(new HeaderContributor(new IHeaderContributor()
> {
> public void renderHead(final IHeaderResponse response)
> {
> if ((AjaxRequestTarget.get() != null))
> {
> response.renderJavascript("jQuery.initEdit();", "ID"
> + response.hashCode());
> }
> }
> }));
>
> }
> (...)
>
> thanks in advance
> best
> --
>
> Joseph Pachod
> IT
>
> THOMAS DAILY GmbH
> Adlerstraße 19
> 79098 Freiburg
> Deutschland
> T + 49 761 3 85 59 506
> F + 49 761 3 85 59 550
> E joseph.pachod@thomas-daily.de
> www.thomas-daily.de
>
> Geschäftsführer/Managing Directors:
> Wendy Thomas, Susanne Larbig
> Handelsregister Freiburg i.Br., HRB 3947
>
> Registrieren Sie sich unter https://www.thomas-daily.de/user/sign-in für
> die TD Morning News, eine kostenlose Auswahl aktueller Themen aus TD
> Premium, morgens ab 9:15 in Ihrer Mailbox.
>
> Aktuelle Presseinformationen für die TD Morning News und TD Premium nimmt
> unsere Redaktion unter redaktion@thomas-daily.de entgegen.
> Redaktionsschluss für die TD Morning News ist täglich um 8:45.
>
> Register free of charge at https://www.thomas-daily.de/user/sign-in to
> have the TD Morning News, a selection of the latest topics from TD Premium,
> delivered to your mailbox from 9:15 every morning.
>
> Our editorial department receives the latest press releases for the TD
> Morning News and TD Premium at redaktion@thomas-daily.de. The editorial
> deadline for the TD Morning News is 8.45am daily.
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>
--
BUQUET Fabrice
Re: How to run some JS only once after Ajax rendering is done ?
Posted by Joseph Pachod <jp...@thomas-daily.de>.
Hi
> have you tried invoking AjaxRequestTarget's method appendJavascript? Inside if
> statement try to write
> AjaxRequestTarget.get().appendJavascript("jQuery.initEdit();");
>
> I had a similar problem some weeks ago and it worked.
>
It won't be run only once even if added multiple time (for example from
different instances of the same behavior attached to different components).
thx still :)
++
joseph
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: How to run some JS only once after Ajax rendering is done ?
Posted by Andrea Del Bene <an...@libero.it>.
Joseph Pachod <jp <at> thomas-daily.de> writes:
> When trying to reach this goal, I tried to run the init call through an
> header contributor, but the call is then done before my content is put
> on the page, making it useless:
> public abstract class AbstractEditBehavior extends AbstractBehavior
> {
> public AbstractEditBehavior(final AbstractTextComponent<?> component)
> {
> component.add(JQueryDependency.CORE);
> component.add(new HeaderContributor(new IHeaderContributor()
> {
> public void renderHead(final IHeaderResponse response)
> {
> if ((AjaxRequestTarget.get() != null))
> {
> response.renderJavascript("jQuery.initEdit();", "ID"
> + response.hashCode());
> }
> }
> }));
>
> }
> (...)
Hi Joseph,
have you tried invoking AjaxRequestTarget's method appendJavascript? Inside if
statement try to write
AjaxRequestTarget.get().appendJavascript("jQuery.initEdit();");
I had a similar problem some weeks ago and it worked.
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org