You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by Timo Rantalaiho <Ti...@ri.fi> on 2008/11/10 22:38:00 UTC
Re: combining target.addComponent and javascript
On Mon, 10 Nov 2008, Steve Swinsburg wrote:
> I am wanting to combine an AjaxRequestTarget addComponent call with a
> javascript call as well so that the component is added to the page by
> wicket, but displayed using a jQuery effect. The component adds to the
> page fine, but the jQuery effect doesn't seem to be working, the
> component just appears. Is it something to do with the order of when
> its set to be visible/prepend/append javascript?
Do you have the "normal" markup of changePicture in the
HTML?
You can check with the Ajax debug console (visible when
running Wicket in development mode, -Dwicket.configuration=DEVELOPMENT)
but I think that probably when you do this
> public void onClick(AjaxRequestTarget target) {
>
> //add the full changePicture component to the page
> dynamically
> target.addComponent(changePicture);
> changePicture.setVisible(true);
> String js = "$('#" + changePicture.getMarkupId() +
> "').fadeIn('slow')";
> target.appendJavascript(js);
>
> }
making changePicture visible with normal Wicket ajax will
just write it normally in the DOM tree. Remember that the
Wicket invisibility is "stronger" than the Javascript
visibility in the sense that non-visible Wicket components
are not rendered at all (just a placeholder tag is outputted
if you set setOutputMarkupPlaceHolderTag(true)).
I think that in order to be able to make changePicture
visible via Javascript (that manipulates DOM objects), you
have to make it invisible but available on the DOM level,
i.e. set display: none either in the markup or via
Javascript before the fadeIn javascript.
It would be interesting to hear a working solution.
Best wishes,
Timo
--
Timo Rantalaiho
Reaktor Innovations Oy <URL: http://www.ri.fi/ >
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: combining target.addComponent and javascript
Posted by Timo Rantalaiho <Ti...@ri.fi>.
On Tue, 11 Nov 2008, Steve Swinsburg wrote:
> No I don't have the normal markup of the panel in the HTML as I didn't
> really want to create it then hide it. So I just have the placeholder
> tag. Then clicking the button is meant to replace the contents of the
> placeholder tag with the actual content. And that works. I just can't
> seem to get this to fire in the right order.
OK, how about you put style="display: none" either in the
panel markup or in an AttributeModifier? So that when it's
visible in the Wicket sense (in the markup) it's not visible
to the browser.
This might have some problems still, it seems like it's been
tried before
http://www.google.fi/search?q=wicket+attributemodifier+style+display%3A+none&ie=utf-8&oe=utf-8&aq=t&rls=com.ubuntu:en-US:unofficial&client=firefox-a
Best wishes,
Timo
--
Timo Rantalaiho
Reaktor Innovations Oy <URL: http://www.ri.fi/ >
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: combining target.addComponent and javascript
Posted by Steve Swinsburg <s....@lancaster.ac.uk>.
Hi Timo,
No I don't have the normal markup of the panel in the HTML as I didn't
really want to create it then hide it. So I just have the placeholder
tag. Then clicking the button is meant to replace the contents of the
placeholder tag with the actual content. And that works. I just can't
seem to get this to fire in the right order.
Setting the component to be visible, then immediately hiding it makes
it flash briefly, but then it fades in, so thats no good. Removing
setVisible just makes it never appear. So thats no good either.
target.addComponent(changePicture);
changePicture.setVisible(true);
String js1 = "$('#" + changePicture.getMarkupId() + "').hide();";
target.appendJavascript(js1);
String js2 = "$('#" + changePicture.getMarkupId() + "').fadeIn();";
target.appendJavascript(js2);
I have also tried initializing the component inside the onClick and
using a normal AJAX replacePanel method, but the javascript doesn't
fire appropriately either.
Component newPanel = new ChangeProfilePicture("changePicture",
userProfile);
newPanel.setOutputMarkupId(true);
thisPanel.replaceWith(newPanel);
if(target != null) {
target.addComponent(newPanel);
String js2 = "$('#" + newPanel.getMarkupId() + "').fadeIn('5000');";
target.appendJavascript(js2);
}
It just appears. Still no good.
Hmmm
On 10 Nov 2008, at 21:38, Timo Rantalaiho wrote:
> On Mon, 10 Nov 2008, Steve Swinsburg wrote:
>> I am wanting to combine an AjaxRequestTarget addComponent call with a
>> javascript call as well so that the component is added to the page by
>> wicket, but displayed using a jQuery effect. The component adds to
>> the
>> page fine, but the jQuery effect doesn't seem to be working, the
>> component just appears. Is it something to do with the order of when
>> its set to be visible/prepend/append javascript?
>
> Do you have the "normal" markup of changePicture in the
> HTML?
>
> You can check with the Ajax debug console (visible when
> running Wicket in development mode, -
> Dwicket.configuration=DEVELOPMENT)
> but I think that probably when you do this
>
>> public void onClick(AjaxRequestTarget target) {
>>
>> //add the full changePicture component to the page
>> dynamically
>> target.addComponent(changePicture);
>> changePicture.setVisible(true);
>> String js = "$('#" + changePicture.getMarkupId() +
>> "').fadeIn('slow')";
>> target.appendJavascript(js);
>>
>> }
>
> making changePicture visible with normal Wicket ajax will
> just write it normally in the DOM tree. Remember that the
> Wicket invisibility is "stronger" than the Javascript
> visibility in the sense that non-visible Wicket components
> are not rendered at all (just a placeholder tag is outputted
> if you set setOutputMarkupPlaceHolderTag(true)).
>
> I think that in order to be able to make changePicture
> visible via Javascript (that manipulates DOM objects), you
> have to make it invisible but available on the DOM level,
> i.e. set display: none either in the markup or via
> Javascript before the fadeIn javascript.
>
> It would be interesting to hear a working solution.
>
> Best wishes,
> Timo
>
> --
> Timo Rantalaiho
> Reaktor Innovations Oy <URL: http://www.ri.fi/ >
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>