Re: Clicking a button should fire a 'CSS event'

[Chris]

Hi Martin, dear all.

thanks for the hint, I tried it the following way (see below).
However, when #isTemporary returns true and the page is loaded afterwards, the 
attribute is not appended to the marker component. This only happens when 
setting it to false which has the disadvantage that this is then done 
permanently. 

A) What could be the error?
B) What is the best practice to get a handler for the „marker“ component in a 
specific subpanel when the marker component is added as directly to the page? I 
currently put a reference in each constructor of the subpanels hierarchy to 
have a reference in the specific subpanel where it is needed which is a bit 
inconvenient. I know that there are the Wicket events but isn’t there something 
as #getComponent() so that you can use it like 
target.add(getComponent()) or WebMarkupContainer c = getComponent….? 
final WebMarkupContainer icon = new WebMarkupContainer("icon");
icon.setOutputMarkupId(true);
icon.add(new AjaxEventBehavior("onclick") {
protected void onEvent(AjaxRequestTarget target) {
marker.add(new AttributeAppender("class", "marker") {
@Override
public boolean isTemporary(Component component) {
return true;
}
});

target.add(getPage());

}
});
best regards,
Chris





> Am 03.02.2015 um 23:01 schrieb Martin Grigorov :
> 
> On Tue, Feb 3, 2015 at 11:53 PM, Chris  wrote:
> 
>> Hi Martin,
>> 
>> thanks for your reply, I understand. Here are some more details:
>> 
>>  is a WebmarkupContainer in a page that represents a rectangle.
>> 
>> When the user clicks a specific icon (see below), the CSS class „marker“
>> is added to the marker and the page is reloaded so that the marker-CSS is
>> executed one time (highlighting effect).
>> However, after that event, the CSS class should be removed so that the
>> effect is not shown anymore, e.g., when the user simply loads the page.
>> Any ideas how to implement this feature?
>> 
>> final WebMarkupContainer icon = new WebMarkupContainer(„icon");
>> icon.setOutputMarkupId(true);
>> icon.add(new AjaxEventBehavior("onclick") {
>>protected void onEvent(AjaxRequestTarget target) {
>>marker.add(AttributeModifier.append("class", "marker"));
>> 
> 
> replace with:
> 
> marker.add(new AttributeAppender("class", "marker") {
>  @Override boolean isTemporary(Component c) {return true;}
> })
> 
> 
>>target.add(getPage());
>> 
>>}
>> });
>> Thanks!
>> 
>> 
>>> Am 03.02.2015 um 22:41 schrieb Martin Grigorov :
>>> 
>>> Hi,
>>> 
>>> Please try to explain the idea again.
>>> There is no such thing like CSS event. There is JS event.
>>> Does the button submit a form ? Because you say it reloads the page ...
>>> Why do you think the event is fired more than once ?
>>> 
>>> Martin Grigorov
>>> Wicket Training and Consulting
>>> https://twitter.com/mtgrigorov
>>> 
>>> On Tue, Feb 3, 2015 at 11:30 PM, Chris  wrote:
>>> 
 Hi guys,
 
 I would like to control a DIV element when clicking on a button, so that
 it sort of reacts to this event by „blinking“ for a short time.
 Currently, when clicking the button, a CSS attribute is added to the
>> DIV’s
 class and the page is reloaded so that this event is triggered.
 However, the event should fire only once so I would therefore need to
 delete the attribute after that.
 
 Is there a more elegant solution so that the „CSS event“ is fired once
 when clicking the button?
 
 Thanks,
 Chris
 
 
 
 -
 To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
 For additional commands, e-mail: users-h...@wicket.apache.org
 
 
>> 
>> 

Re: Clicking a button should fire a 'CSS event'

[Chris]

I solved it via Javascript following the approach of 
http://blogs.sitepointstatic.com/examples/tech/animation-api/index.html 
.

thanks, Chris


> Am 03.02.2015 um 22:52 schrieb Warren Bell :
> 
> Chris,
> 
> Seems like a lot of work just to get a div to blink. Write a behavior with 
> some javascript for the blinking and do that on the client only separate from 
> your form submission or whatever else your button is doing.
> 
> Warren
> 
>> On Feb 3, 2015, at 1:30 PM, Chris  wrote:
>> 
>> Hi guys,
>> 
>> I would like to control a DIV element when clicking on a button, so that it 
>> sort of reacts to this event by „blinking“ for a short time.
>> Currently, when clicking the button, a CSS attribute is added to the DIV’s 
>> class and the page is reloaded so that this event is triggered.
>> However, the event should fire only once so I would therefore need to delete 
>> the attribute after that.
>> 
>> Is there a more elegant solution so that the „CSS event“ is fired once when 
>> clicking the button?
>> 
>> Thanks,
>> Chris
>> 
>> 
>> 
>> -
>> To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
>> For additional commands, e-mail: users-h...@wicket.apache.org
>> 
> 
> 
> -
> To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
> For additional commands, e-mail: users-h...@wicket.apache.org
> 

Re: Clicking a button should fire a 'CSS event'

[Martin Grigorov]

On Tue, Feb 3, 2015 at 11:53 PM, Chris  wrote:

> Hi Martin,
>
> thanks for your reply, I understand. Here are some more details:
>
>  is a WebmarkupContainer in a page that represents a rectangle.
>
> When the user clicks a specific icon (see below), the CSS class „marker“
> is added to the marker and the page is reloaded so that the marker-CSS is
> executed one time (highlighting effect).
> However, after that event, the CSS class should be removed so that the
> effect is not shown anymore, e.g., when the user simply loads the page.
> Any ideas how to implement this feature?
>
> final WebMarkupContainer icon = new WebMarkupContainer(„icon");
> icon.setOutputMarkupId(true);
> icon.add(new AjaxEventBehavior("onclick") {
> protected void onEvent(AjaxRequestTarget target) {
> marker.add(AttributeModifier.append("class", "marker"));
>

replace with:

marker.add(new AttributeAppender("class", "marker") {
  @Override boolean isTemporary(Component c) {return true;}
})


> target.add(getPage());
>
> }
> });
> Thanks!
>
>
> > Am 03.02.2015 um 22:41 schrieb Martin Grigorov :
> >
> > Hi,
> >
> > Please try to explain the idea again.
> > There is no such thing like CSS event. There is JS event.
> > Does the button submit a form ? Because you say it reloads the page ...
> > Why do you think the event is fired more than once ?
> >
> > Martin Grigorov
> > Wicket Training and Consulting
> > https://twitter.com/mtgrigorov
> >
> > On Tue, Feb 3, 2015 at 11:30 PM, Chris  wrote:
> >
> >> Hi guys,
> >>
> >> I would like to control a DIV element when clicking on a button, so that
> >> it sort of reacts to this event by „blinking“ for a short time.
> >> Currently, when clicking the button, a CSS attribute is added to the
> DIV’s
> >> class and the page is reloaded so that this event is triggered.
> >> However, the event should fire only once so I would therefore need to
> >> delete the attribute after that.
> >>
> >> Is there a more elegant solution so that the „CSS event“ is fired once
> >> when clicking the button?
> >>
> >> Thanks,
> >> Chris
> >>
> >>
> >>
> >> -
> >> To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
> >> For additional commands, e-mail: users-h...@wicket.apache.org
> >>
> >>
>
>

Re: Clicking a button should fire a 'CSS event'

[Chris]

Hi Martin,

thanks for your reply, I understand. Here are some more details:

 is a WebmarkupContainer in a page that represents a rectangle.

When the user clicks a specific icon (see below), the CSS class „marker“ is 
added to the marker and the page is reloaded so that the marker-CSS is executed 
one time (highlighting effect).
However, after that event, the CSS class should be removed so that the effect 
is not shown anymore, e.g., when the user simply loads the page.
Any ideas how to implement this feature?

final WebMarkupContainer icon = new WebMarkupContainer(„icon");
icon.setOutputMarkupId(true);
icon.add(new AjaxEventBehavior("onclick") {
protected void onEvent(AjaxRequestTarget target) {
marker.add(AttributeModifier.append("class", "marker"));
target.add(getPage());

}
});
Thanks!


> Am 03.02.2015 um 22:41 schrieb Martin Grigorov :
> 
> Hi,
> 
> Please try to explain the idea again.
> There is no such thing like CSS event. There is JS event.
> Does the button submit a form ? Because you say it reloads the page ...
> Why do you think the event is fired more than once ?
> 
> Martin Grigorov
> Wicket Training and Consulting
> https://twitter.com/mtgrigorov
> 
> On Tue, Feb 3, 2015 at 11:30 PM, Chris  wrote:
> 
>> Hi guys,
>> 
>> I would like to control a DIV element when clicking on a button, so that
>> it sort of reacts to this event by „blinking“ for a short time.
>> Currently, when clicking the button, a CSS attribute is added to the DIV’s
>> class and the page is reloaded so that this event is triggered.
>> However, the event should fire only once so I would therefore need to
>> delete the attribute after that.
>> 
>> Is there a more elegant solution so that the „CSS event“ is fired once
>> when clicking the button?
>> 
>> Thanks,
>> Chris
>> 
>> 
>> 
>> -
>> To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
>> For additional commands, e-mail: users-h...@wicket.apache.org
>> 
>> 

Re: Clicking a button should fire a 'CSS event'

[Warren Bell]

Chris,

Seems like a lot of work just to get a div to blink. Write a behavior with some 
javascript for the blinking and do that on the client only separate from your 
form submission or whatever else your button is doing.

Warren

> On Feb 3, 2015, at 1:30 PM, Chris  wrote:
> 
> Hi guys,
> 
> I would like to control a DIV element when clicking on a button, so that it 
> sort of reacts to this event by „blinking“ for a short time.
> Currently, when clicking the button, a CSS attribute is added to the DIV’s 
> class and the page is reloaded so that this event is triggered.
> However, the event should fire only once so I would therefore need to delete 
> the attribute after that.
> 
> Is there a more elegant solution so that the „CSS event“ is fired once when 
> clicking the button?
> 
> Thanks,
> Chris
> 
> 
> 
> -
> To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
> For additional commands, e-mail: users-h...@wicket.apache.org
> 


-
To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
For additional commands, e-mail: users-h...@wicket.apache.org

Re: Clicking a button should fire a 'CSS event'

[Martin Grigorov]

Hi,

Please try to explain the idea again.
There is no such thing like CSS event. There is JS event.
Does the button submit a form ? Because you say it reloads the page ...
Why do you think the event is fired more than once ?

Martin Grigorov
Wicket Training and Consulting
https://twitter.com/mtgrigorov

On Tue, Feb 3, 2015 at 11:30 PM, Chris  wrote:

> Hi guys,
>
> I would like to control a DIV element when clicking on a button, so that
> it sort of reacts to this event by „blinking“ for a short time.
> Currently, when clicking the button, a CSS attribute is added to the DIV’s
> class and the page is reloaded so that this event is triggered.
> However, the event should fire only once so I would therefore need to
> delete the attribute after that.
>
> Is there a more elegant solution so that the „CSS event“ is fired once
> when clicking the button?
>
> Thanks,
> Chris
>
>
>
> -
> To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
> For additional commands, e-mail: users-h...@wicket.apache.org
>
>

Clicking a button should fire a 'CSS event'

[Chris]

Hi guys,

I would like to control a DIV element when clicking on a button, so that it 
sort of reacts to this event by „blinking“ for a short time.
Currently, when clicking the button, a CSS attribute is added to the DIV’s 
class and the page is reloaded so that this event is triggered.
However, the event should fire only once so I would therefore need to delete 
the attribute after that.

Is there a more elegant solution so that the „CSS event“ is fired once when 
clicking the button?

Thanks,
Chris



-
To unsubscribe, e-mail: users-unsubscr...@wicket.apache.org
For additional commands, e-mail: users-h...@wicket.apache.org