You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by Eyal Golan <eg...@gmail.com> on 2008/04/01 12:45:57 UTC

Dynamic Creation of a button using style

Hi,
After many tries and questions (also in this user group) I manged to create
a nice button that I want to share.

First, I used the example from:
http://www.hedgerwow.com/360/dhtml/css-round-button/demo.php?foo=we%2C
As you can see in this link, the <button> markup is surrounded with <span> .
That was my problem.
I wanted that when a user puts in the html <button> ... </button> , it will
be changed to be inside <span> .
I used Behavior for this purpose.
Another problem I encountered was changing enable / disable dynamically.
According to the example, disabled button should be inside <del> tag.

I am attaching the files (classes and CSSs) that I created.

Here's the usage:
StyledButton result = new StyledButton("okBtn", new Model(LocalizationHelper
                .getMessage("text.buttons.next"))) {
            private static final long serialVersionUID = 1L;

            @Override
            public void onSubmit() {
                ...
            }
        };

And in the markup:
<button wicket:id="okBtn" type="submit"></button>

It was tested on IE7 and FF.

Hope this will be helpful for someone.


-- 
Eyal Golan
egolan74@gmail.com

Visit: http://jvdrums.sourceforge.net/

Re: Dynamic Creation of a button using style

Posted by Eyal Golan <eg...@gmail.com>.
I have a better solution.
I am attaching the filed with the new solution.

I now use three images - left, right and middle.
I force the user to use <button...>  in the markup.
I create an inner table inside the button.

Note: I could use a behavior but just for easier presentation, I did not :)

Eyal Golan

On Wed, Apr 2, 2008 at 12:40 PM, Meindert Deen <ga...@gmail.com> wrote:

> Perfect! Thank you very much!
>
>
> On Wed, Apr 2, 2008 at 11:30 AM, Eyal Golan <eg...@gmail.com> wrote:
>
> > Hi Deen,
> > Thanks for your feedback. It's important for me to see that I contribute
> > :)
> > As for the code, I checked in my original mail and noticed all 4 files.
> > Anyway, I resend them and also in one zip file.
> >
> > Please let me know that you got all of them.
> >
> > And again, thanks
> >
> >
> > Eyal
> >
> >
> > On Wed, Apr 2, 2008 at 12:18 PM, Meindert Deen <ga...@gmail.com> wrote:
> >
> > > Hello Eyal,
> > >
> > > Thank you for finding this out. I'm very interested in your solution.
> > > Your email (the one I reply to now) only has a css file and not the java
> > > code. I would really like to see it. Could you please provide me (and if
> > > possible the rest of the users on the list) with the code?
> > >
> > > Thank you very much,
> > >
> > > Meindert Deen
> > >
> > > On Tue, Apr 1, 2008 at 12:45 PM, Eyal Golan <eg...@gmail.com>
> > > wrote:
> > >
> > > > Hi,
> > > > After many tries and questions (also in this user group) I manged to
> > > > create a nice button that I want to share.
> > > >
> > > > First, I used the example from:
> > > > http://www.hedgerwow.com/360/dhtml/css-round-button/demo.php?foo=we%2C
> > > > As you can see in this link, the <button> markup is surrounded with
> > > > <span> .
> > > > That was my problem.
> > > > I wanted that when a user puts in the html <button> ... </button> ,
> > > > it will be changed to be inside <span> .
> > > > I used Behavior for this purpose.
> > > > Another problem I encountered was changing enable / disable
> > > > dynamically.
> > > > According to the example, disabled button should be inside <del>
> > > > tag.
> > > >
> > > > I am attaching the files (classes and CSSs) that I created.
> > > >
> > > > Here's the usage:
> > > > StyledButton result = new StyledButton("okBtn", new
> > > > Model(LocalizationHelper
> > > >                 .getMessage("text.buttons.next"))) {
> > > >             private static final long serialVersionUID = 1L;
> > > >
> > > >             @Override
> > > >             public void onSubmit() {
> > > >                 ...
> > > >             }
> > > >         };
> > > >
> > > > And in the markup:
> > > > <button wicket:id="okBtn" type="submit"></button>
> > > >
> > > > It was tested on IE7 and FF.
> > > >
> > > > Hope this will be helpful for someone.
> > > >
> > > >
> > > > --
> > > > Eyal Golan
> > > > egolan74@gmail.com
> > > >
> > > > Visit: http://jvdrums.sourceforge.net/
> > > >
> > > > ---------------------------------------------------------------------
> > > > To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> > > > For additional commands, e-mail: users-help@wicket.apache.org
> > > >
> > >
> > >
> >
> >
> > --
> > Eyal Golan
> > egolan74@gmail.com
> >
> > Visit: http://jvdrums.sourceforge.net/
> >
>
>


-- 
Eyal Golan
egolan74@gmail.com

Visit: http://jvdrums.sourceforge.net/

Re: Dynamic Creation of a button using style

Posted by Eyal Golan <eg...@gmail.com>.
Hi Deen,
Thanks for your feedback. It's important for me to see that I contribute :)
As for the code, I checked in my original mail and noticed all 4 files.
Anyway, I resend them and also in one zip file.

Please let me know that you got all of them.

And again, thanks


Eyal

On Wed, Apr 2, 2008 at 12:18 PM, Meindert Deen <ga...@gmail.com> wrote:

> Hello Eyal,
>
> Thank you for finding this out. I'm very interested in your solution. Your
> email (the one I reply to now) only has a css file and not the java code. I
> would really like to see it. Could you please provide me (and if possible
> the rest of the users on the list) with the code?
>
> Thank you very much,
>
> Meindert Deen
>
> On Tue, Apr 1, 2008 at 12:45 PM, Eyal Golan <eg...@gmail.com> wrote:
>
> > Hi,
> > After many tries and questions (also in this user group) I manged to
> > create a nice button that I want to share.
> >
> > First, I used the example from:
> > http://www.hedgerwow.com/360/dhtml/css-round-button/demo.php?foo=we%2C
> > As you can see in this link, the <button> markup is surrounded with
> > <span> .
> > That was my problem.
> > I wanted that when a user puts in the html <button> ... </button> , it
> > will be changed to be inside <span> .
> > I used Behavior for this purpose.
> > Another problem I encountered was changing enable / disable dynamically.
> > According to the example, disabled button should be inside <del> tag.
> >
> > I am attaching the files (classes and CSSs) that I created.
> >
> > Here's the usage:
> > StyledButton result = new StyledButton("okBtn", new
> > Model(LocalizationHelper
> >                 .getMessage("text.buttons.next"))) {
> >             private static final long serialVersionUID = 1L;
> >
> >             @Override
> >             public void onSubmit() {
> >                 ...
> >             }
> >         };
> >
> > And in the markup:
> > <button wicket:id="okBtn" type="submit"></button>
> >
> > It was tested on IE7 and FF.
> >
> > Hope this will be helpful for someone.
> >
> >
> > --
> > Eyal Golan
> > egolan74@gmail.com
> >
> > Visit: http://jvdrums.sourceforge.net/
> > ---------------------------------------------------------------------
> > To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> > For additional commands, e-mail: users-help@wicket.apache.org
> >
>
>


-- 
Eyal Golan
egolan74@gmail.com

Visit: http://jvdrums.sourceforge.net/