You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by Luther Baker <lu...@gmail.com> on 2009/06/05 06:58:08 UTC

Dynamic green or red UL background for FeedbackPanel

I have a minor question regarding the FeedbackPanel.

I'd like to have the panel display a subtle red background on ERROR and a
subtle green background on INFO. Obviously there can be more than one LI -
but assuming its all errors or info ... using css on the LI isn't enough.
For instance, the LI bullet shows up outside of the LI background. The css
background color therefore needs to be on the UL of the resulting:

  <ul wicket:id="feedbackul" class="feedbackPanel">
    <li wicket:id="messages" class="feedbackPanelINFO">
      <span wicket:id="message" class="feedbackPanelINFO">Login
failed. Please try again.</span>
    </li>
  </ul>


Unfortunately, error or info, I the FeedbackPanel only uses "feedbackPanel"
as the style and can't really make the background consistent with the
general notice being displayed.

Is there an easy way around this? I guess I want to make the UL green or
red, depending on the type of message being displayed (understanding that
more than one type can be displayed).

-Luther

Re: Dynamic green or red UL background for FeedbackPanel

Posted by Luther Baker <lu...@gmail.com>.
This worked out for me:

*html*
        <div wicket:id="feedbackPanel">[feedback]</div>

*Java*
        final Panel panel = new FeedbackPanel("feedbackPanel");
        ...
and then as necessary

        panel.add(new SimpleAttributeModifier("class", "info"));
    or
        panel.add(new SimpleAttributeModifier("class", "error"));
    etc ...


*css*

ul.feedbackPanel {                          /* default color scheme */
    border: 1px solid #099;
    background-color: #eff;
    color: #099;
}

div.error ul.feedbackPanel {           /* color scheme on explicit error */
    background-color: #fee;
    border: 1px solid #900;
    color: #900;
}

div.info ul.feedbackPanel {             /* color scheme on explicit info */
    border: 1px solid #090;
    background-color: #efe;
    color: #090;
}

On Fri, Jun 5, 2009 at 1:14 AM, Luther Baker <lu...@gmail.com> wrote:

> Thanks ... I will try to apply a behavior ...
>
> -Luther
>
>
>
> On Fri, Jun 5, 2009 at 1:02 AM, Jeremy Thomerson <
> jeremy@wickettraining.com> wrote:
>
>> You actually could - write a behavior that runs through the messages
>> that the FP will be displaying and set the class based on it.  Or
>> subclass FP and do the same.
>>
>> --
>> Jeremy Thomerson
>> http://www.wickettraining.com
>>
>>
>>
>>
>> On Fri, Jun 5, 2009 at 12:53 AM, Luther Baker <lu...@gmail.com>
>> wrote:
>> > Yep - that is what I'm asking - and Javascript would be fine.
>> >
>> > I guess it'd also be nice if, say, I could do something directly in
>> Java.
>> > Explicitly apply a behavior or something specific to the FeedbackPanel
>> to
>> > set or override the CSS class attribute.
>> >
>> > Thanks Jeremy,
>> >
>> > -Luther
>> >
>> >
>> >
>> > On Fri, Jun 5, 2009 at 12:02 AM, Jeremy Thomerson <
>> jeremy@wickettraining.com
>> >> wrote:
>> >
>> >> Use javascript.  First, style your LI elements to the appropriate
>> >> color.  That gives the default.  Then when the page loads, you can
>> >> check to see if they are all error (in which case they'd all already
>> >> be red).  I guess what you're saying is that if ANY of them are an
>> >> error message, that you want the whole UL to be red?  If so, you could
>> >> do that in JS.
>> >>
>> >> --
>> >> Jeremy Thomerson
>> >> http://www.wickettraining.com
>> >>
>> >>
>> >>
>> >>
>> >> On Thu, Jun 4, 2009 at 11:58 PM, Luther Baker <lu...@gmail.com>
>> >> wrote:
>> >> > I have a minor question regarding the FeedbackPanel.
>> >> >
>> >> > I'd like to have the panel display a subtle red background on ERROR
>> and a
>> >> > subtle green background on INFO. Obviously there can be more than one
>> LI
>> >> -
>> >> > but assuming its all errors or info ... using css on the LI isn't
>> enough.
>> >> > For instance, the LI bullet shows up outside of the LI background.
>> The
>> >> css
>> >> > background color therefore needs to be on the UL of the resulting:
>> >> >
>> >> >  <ul wicket:id="feedbackul" class="feedbackPanel">
>> >> >    <li wicket:id="messages" class="feedbackPanelINFO">
>> >> >      <span wicket:id="message" class="feedbackPanelINFO">Login
>> >> > failed. Please try again.</span>
>> >> >    </li>
>> >> >  </ul>
>> >> >
>> >> >
>> >> > Unfortunately, error or info, I the FeedbackPanel only uses
>> >> "feedbackPanel"
>> >> > as the style and can't really make the background consistent with the
>> >> > general notice being displayed.
>> >> >
>> >> > Is there an easy way around this? I guess I want to make the UL green
>> or
>> >> > red, depending on the type of message being displayed (understanding
>> that
>> >> > more than one type can be displayed).
>> >> >
>> >> > -Luther
>> >> >
>> >>
>> >> ---------------------------------------------------------------------
>> >> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
>> >> For additional commands, e-mail: users-help@wicket.apache.org
>> >>
>> >>
>> >
>>
>> ---------------------------------------------------------------------
>> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
>> For additional commands, e-mail: users-help@wicket.apache.org
>>
>>
>

Re: Dynamic green or red UL background for FeedbackPanel

Posted by Luther Baker <lu...@gmail.com>.
Thanks ... I will try to apply a behavior ...

-Luther


On Fri, Jun 5, 2009 at 1:02 AM, Jeremy Thomerson
<je...@wickettraining.com>wrote:

> You actually could - write a behavior that runs through the messages
> that the FP will be displaying and set the class based on it.  Or
> subclass FP and do the same.
>
> --
> Jeremy Thomerson
> http://www.wickettraining.com
>
>
>
>
> On Fri, Jun 5, 2009 at 12:53 AM, Luther Baker <lu...@gmail.com>
> wrote:
> > Yep - that is what I'm asking - and Javascript would be fine.
> >
> > I guess it'd also be nice if, say, I could do something directly in Java.
> > Explicitly apply a behavior or something specific to the FeedbackPanel to
> > set or override the CSS class attribute.
> >
> > Thanks Jeremy,
> >
> > -Luther
> >
> >
> >
> > On Fri, Jun 5, 2009 at 12:02 AM, Jeremy Thomerson <
> jeremy@wickettraining.com
> >> wrote:
> >
> >> Use javascript.  First, style your LI elements to the appropriate
> >> color.  That gives the default.  Then when the page loads, you can
> >> check to see if they are all error (in which case they'd all already
> >> be red).  I guess what you're saying is that if ANY of them are an
> >> error message, that you want the whole UL to be red?  If so, you could
> >> do that in JS.
> >>
> >> --
> >> Jeremy Thomerson
> >> http://www.wickettraining.com
> >>
> >>
> >>
> >>
> >> On Thu, Jun 4, 2009 at 11:58 PM, Luther Baker <lu...@gmail.com>
> >> wrote:
> >> > I have a minor question regarding the FeedbackPanel.
> >> >
> >> > I'd like to have the panel display a subtle red background on ERROR
> and a
> >> > subtle green background on INFO. Obviously there can be more than one
> LI
> >> -
> >> > but assuming its all errors or info ... using css on the LI isn't
> enough.
> >> > For instance, the LI bullet shows up outside of the LI background. The
> >> css
> >> > background color therefore needs to be on the UL of the resulting:
> >> >
> >> >  <ul wicket:id="feedbackul" class="feedbackPanel">
> >> >    <li wicket:id="messages" class="feedbackPanelINFO">
> >> >      <span wicket:id="message" class="feedbackPanelINFO">Login
> >> > failed. Please try again.</span>
> >> >    </li>
> >> >  </ul>
> >> >
> >> >
> >> > Unfortunately, error or info, I the FeedbackPanel only uses
> >> "feedbackPanel"
> >> > as the style and can't really make the background consistent with the
> >> > general notice being displayed.
> >> >
> >> > Is there an easy way around this? I guess I want to make the UL green
> or
> >> > red, depending on the type of message being displayed (understanding
> that
> >> > more than one type can be displayed).
> >> >
> >> > -Luther
> >> >
> >>
> >> ---------------------------------------------------------------------
> >> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> >> For additional commands, e-mail: users-help@wicket.apache.org
> >>
> >>
> >
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>

Re: Dynamic green or red UL background for FeedbackPanel

Posted by Jeremy Thomerson <je...@wickettraining.com>.
You actually could - write a behavior that runs through the messages
that the FP will be displaying and set the class based on it.  Or
subclass FP and do the same.

--
Jeremy Thomerson
http://www.wickettraining.com




On Fri, Jun 5, 2009 at 12:53 AM, Luther Baker <lu...@gmail.com> wrote:
> Yep - that is what I'm asking - and Javascript would be fine.
>
> I guess it'd also be nice if, say, I could do something directly in Java.
> Explicitly apply a behavior or something specific to the FeedbackPanel to
> set or override the CSS class attribute.
>
> Thanks Jeremy,
>
> -Luther
>
>
>
> On Fri, Jun 5, 2009 at 12:02 AM, Jeremy Thomerson <jeremy@wickettraining.com
>> wrote:
>
>> Use javascript.  First, style your LI elements to the appropriate
>> color.  That gives the default.  Then when the page loads, you can
>> check to see if they are all error (in which case they'd all already
>> be red).  I guess what you're saying is that if ANY of them are an
>> error message, that you want the whole UL to be red?  If so, you could
>> do that in JS.
>>
>> --
>> Jeremy Thomerson
>> http://www.wickettraining.com
>>
>>
>>
>>
>> On Thu, Jun 4, 2009 at 11:58 PM, Luther Baker <lu...@gmail.com>
>> wrote:
>> > I have a minor question regarding the FeedbackPanel.
>> >
>> > I'd like to have the panel display a subtle red background on ERROR and a
>> > subtle green background on INFO. Obviously there can be more than one LI
>> -
>> > but assuming its all errors or info ... using css on the LI isn't enough.
>> > For instance, the LI bullet shows up outside of the LI background. The
>> css
>> > background color therefore needs to be on the UL of the resulting:
>> >
>> >  <ul wicket:id="feedbackul" class="feedbackPanel">
>> >    <li wicket:id="messages" class="feedbackPanelINFO">
>> >      <span wicket:id="message" class="feedbackPanelINFO">Login
>> > failed. Please try again.</span>
>> >    </li>
>> >  </ul>
>> >
>> >
>> > Unfortunately, error or info, I the FeedbackPanel only uses
>> "feedbackPanel"
>> > as the style and can't really make the background consistent with the
>> > general notice being displayed.
>> >
>> > Is there an easy way around this? I guess I want to make the UL green or
>> > red, depending on the type of message being displayed (understanding that
>> > more than one type can be displayed).
>> >
>> > -Luther
>> >
>>
>> ---------------------------------------------------------------------
>> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
>> For additional commands, e-mail: users-help@wicket.apache.org
>>
>>
>

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


Re: Dynamic green or red UL background for FeedbackPanel

Posted by Luther Baker <lu...@gmail.com>.
Yep - that is what I'm asking - and Javascript would be fine.

I guess it'd also be nice if, say, I could do something directly in Java.
Explicitly apply a behavior or something specific to the FeedbackPanel to
set or override the CSS class attribute.

Thanks Jeremy,

-Luther



On Fri, Jun 5, 2009 at 12:02 AM, Jeremy Thomerson <jeremy@wickettraining.com
> wrote:

> Use javascript.  First, style your LI elements to the appropriate
> color.  That gives the default.  Then when the page loads, you can
> check to see if they are all error (in which case they'd all already
> be red).  I guess what you're saying is that if ANY of them are an
> error message, that you want the whole UL to be red?  If so, you could
> do that in JS.
>
> --
> Jeremy Thomerson
> http://www.wickettraining.com
>
>
>
>
> On Thu, Jun 4, 2009 at 11:58 PM, Luther Baker <lu...@gmail.com>
> wrote:
> > I have a minor question regarding the FeedbackPanel.
> >
> > I'd like to have the panel display a subtle red background on ERROR and a
> > subtle green background on INFO. Obviously there can be more than one LI
> -
> > but assuming its all errors or info ... using css on the LI isn't enough.
> > For instance, the LI bullet shows up outside of the LI background. The
> css
> > background color therefore needs to be on the UL of the resulting:
> >
> >  <ul wicket:id="feedbackul" class="feedbackPanel">
> >    <li wicket:id="messages" class="feedbackPanelINFO">
> >      <span wicket:id="message" class="feedbackPanelINFO">Login
> > failed. Please try again.</span>
> >    </li>
> >  </ul>
> >
> >
> > Unfortunately, error or info, I the FeedbackPanel only uses
> "feedbackPanel"
> > as the style and can't really make the background consistent with the
> > general notice being displayed.
> >
> > Is there an easy way around this? I guess I want to make the UL green or
> > red, depending on the type of message being displayed (understanding that
> > more than one type can be displayed).
> >
> > -Luther
> >
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>

Re: Dynamic green or red UL background for FeedbackPanel

Posted by Jeremy Thomerson <je...@wickettraining.com>.
Use javascript.  First, style your LI elements to the appropriate
color.  That gives the default.  Then when the page loads, you can
check to see if they are all error (in which case they'd all already
be red).  I guess what you're saying is that if ANY of them are an
error message, that you want the whole UL to be red?  If so, you could
do that in JS.

--
Jeremy Thomerson
http://www.wickettraining.com




On Thu, Jun 4, 2009 at 11:58 PM, Luther Baker <lu...@gmail.com> wrote:
> I have a minor question regarding the FeedbackPanel.
>
> I'd like to have the panel display a subtle red background on ERROR and a
> subtle green background on INFO. Obviously there can be more than one LI -
> but assuming its all errors or info ... using css on the LI isn't enough.
> For instance, the LI bullet shows up outside of the LI background. The css
> background color therefore needs to be on the UL of the resulting:
>
>  <ul wicket:id="feedbackul" class="feedbackPanel">
>    <li wicket:id="messages" class="feedbackPanelINFO">
>      <span wicket:id="message" class="feedbackPanelINFO">Login
> failed. Please try again.</span>
>    </li>
>  </ul>
>
>
> Unfortunately, error or info, I the FeedbackPanel only uses "feedbackPanel"
> as the style and can't really make the background consistent with the
> general notice being displayed.
>
> Is there an easy way around this? I guess I want to make the UL green or
> red, depending on the type of message being displayed (understanding that
> more than one type can be displayed).
>
> -Luther
>

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