You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by Josh Kamau <jo...@gmail.com> on 2010/04/26 09:19:42 UTC
Shadow text on input fields
Hi guys;
I would like to put some shadow text on the form input fields that
disappears when one starts editing the field. The kind that appears on
facebook fields. How do i do it. Most likely its not a wicket issue but i
really need assistance in this. Am not very good in javascript.
Kind regards
Josh
Re: Shadow text on input fields
Posted by Josh Kamau <jo...@gmail.com>.
>>Should Wicket test for HTML 5 support, and fall back to a Javascript
"hack"?
I would really be glad if it did this. Am working on a public facing web
application and i cant be guaranteed that users' browsers will have HTML5
support.
Kind regards.
Josh
On Mon, Apr 26, 2010 at 2:31 PM, Wilhelmsen Tor Iver <To...@arrive.no>wrote:
> The problem is not the Wicket side of things, but the browser side. Should
> Wicket test for HTML 5 support, and fall back to a Javascript "hack"?
>
> - Tor Iver
>
> > -----Opprinnelig melding-----
> > Fra: Josh Kamau [mailto:joshnet2030@gmail.com]
> > Sendt: 26. april 2010 13:29
> > Til: users@wicket.apache.org
> > Emne: Re: Shadow text on input fields
> >
> > I wish we could have something like myTextField.setDefaultText("Type
> > text
> > here");
> >
> > On Mon, Apr 26, 2010 at 11:55 AM, Josh Kamau <jo...@gmail.com>
> > wrote:
> >
> > > Thanks Marjtin
> > >
> > >
> > > On Mon, Apr 26, 2010 at 11:27 AM, Martijn Dashorst <
> > > martijn.dashorst@gmail.com> wrote:
> > >
> > >> If you can get away with it, you can use HTML5's placeholder text:
> > >>
> > >> http://diveintohtml5.org/forms.html
> > >>
> > >> Martijn
> > >>
> > >> On Mon, Apr 26, 2010 at 9:19 AM, Josh Kamau <jo...@gmail.com>
> > >> wrote:
> > >> > Hi guys;
> > >> >
> > >> > I would like to put some shadow text on the form input fields that
> > >> > disappears when one starts editing the field. The kind that
> > appears on
> > >> > facebook fields. How do i do it. Most likely its not a wicket
> > issue but
> > >> i
> > >> > really need assistance in this. Am not very good in javascript.
> > >> >
> > >> > Kind regards
> > >> >
> > >> > Josh
> > >> >
> > >>
> > >>
> > >>
> > >> --
> > >> Become a Wicket expert, learn from the best:
> > http://wicketinaction.com
> > >> Apache Wicket 1.4 increases type safety for web applications
> > >> Get it now: http://www.apache.org/dyn/closer.cgi/wicket/1.4.7
> > >>
> > >> --------------------------------------------------------------------
> > -
> > >> 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
>
>
SV: Shadow text on input fields
Posted by Wilhelmsen Tor Iver <To...@arrive.no>.
The problem is not the Wicket side of things, but the browser side. Should Wicket test for HTML 5 support, and fall back to a Javascript "hack"?
- Tor Iver
> -----Opprinnelig melding-----
> Fra: Josh Kamau [mailto:joshnet2030@gmail.com]
> Sendt: 26. april 2010 13:29
> Til: users@wicket.apache.org
> Emne: Re: Shadow text on input fields
>
> I wish we could have something like myTextField.setDefaultText("Type
> text
> here");
>
> On Mon, Apr 26, 2010 at 11:55 AM, Josh Kamau <jo...@gmail.com>
> wrote:
>
> > Thanks Marjtin
> >
> >
> > On Mon, Apr 26, 2010 at 11:27 AM, Martijn Dashorst <
> > martijn.dashorst@gmail.com> wrote:
> >
> >> If you can get away with it, you can use HTML5's placeholder text:
> >>
> >> http://diveintohtml5.org/forms.html
> >>
> >> Martijn
> >>
> >> On Mon, Apr 26, 2010 at 9:19 AM, Josh Kamau <jo...@gmail.com>
> >> wrote:
> >> > Hi guys;
> >> >
> >> > I would like to put some shadow text on the form input fields that
> >> > disappears when one starts editing the field. The kind that
> appears on
> >> > facebook fields. How do i do it. Most likely its not a wicket
> issue but
> >> i
> >> > really need assistance in this. Am not very good in javascript.
> >> >
> >> > Kind regards
> >> >
> >> > Josh
> >> >
> >>
> >>
> >>
> >> --
> >> Become a Wicket expert, learn from the best:
> http://wicketinaction.com
> >> Apache Wicket 1.4 increases type safety for web applications
> >> Get it now: http://www.apache.org/dyn/closer.cgi/wicket/1.4.7
> >>
> >> --------------------------------------------------------------------
> -
> >> 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: Shadow text on input fields
Posted by Witold Czaplewski <wi...@cts-media.eu>.
If you don't want to use JavaScript, you can still try it with CSS and images,
like
HTML:
<input class="name" />
CSS:
input.name {background:url(name.png)}
input.name:focus {background:none}
But the problem is, if you leave the field the image returns. :)
Witold
Am Mon, 26 Apr 2010 14:28:57 +0300
schrieb Josh Kamau <jo...@gmail.com>:
> I wish we could have something like myTextField.setDefaultText("Type text
> here");
>
> On Mon, Apr 26, 2010 at 11:55 AM, Josh Kamau <jo...@gmail.com> wrote:
>
> > Thanks Marjtin
> >
> >
> > On Mon, Apr 26, 2010 at 11:27 AM, Martijn Dashorst <
> > martijn.dashorst@gmail.com> wrote:
> >
> >> If you can get away with it, you can use HTML5's placeholder text:
> >>
> >> http://diveintohtml5.org/forms.html
> >>
> >> Martijn
> >>
> >> On Mon, Apr 26, 2010 at 9:19 AM, Josh Kamau <jo...@gmail.com>
> >> wrote:
> >> > Hi guys;
> >> >
> >> > I would like to put some shadow text on the form input fields that
> >> > disappears when one starts editing the field. The kind that appears on
> >> > facebook fields. How do i do it. Most likely its not a wicket issue but
> >> i
> >> > really need assistance in this. Am not very good in javascript.
> >> >
> >> > Kind regards
> >> >
> >> > Josh
> >> >
> >>
> >>
> >>
> >> --
> >> Become a Wicket expert, learn from the best: http://wicketinaction.com
> >> Apache Wicket 1.4 increases type safety for web applications
> >> Get it now: http://www.apache.org/dyn/closer.cgi/wicket/1.4.7
> >>
> >> ---------------------------------------------------------------------
> >> 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: Shadow text on input fields
Posted by Josh Kamau <jo...@gmail.com>.
I wish we could have something like myTextField.setDefaultText("Type text
here");
On Mon, Apr 26, 2010 at 11:55 AM, Josh Kamau <jo...@gmail.com> wrote:
> Thanks Marjtin
>
>
> On Mon, Apr 26, 2010 at 11:27 AM, Martijn Dashorst <
> martijn.dashorst@gmail.com> wrote:
>
>> If you can get away with it, you can use HTML5's placeholder text:
>>
>> http://diveintohtml5.org/forms.html
>>
>> Martijn
>>
>> On Mon, Apr 26, 2010 at 9:19 AM, Josh Kamau <jo...@gmail.com>
>> wrote:
>> > Hi guys;
>> >
>> > I would like to put some shadow text on the form input fields that
>> > disappears when one starts editing the field. The kind that appears on
>> > facebook fields. How do i do it. Most likely its not a wicket issue but
>> i
>> > really need assistance in this. Am not very good in javascript.
>> >
>> > Kind regards
>> >
>> > Josh
>> >
>>
>>
>>
>> --
>> Become a Wicket expert, learn from the best: http://wicketinaction.com
>> Apache Wicket 1.4 increases type safety for web applications
>> Get it now: http://www.apache.org/dyn/closer.cgi/wicket/1.4.7
>>
>> ---------------------------------------------------------------------
>> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
>> For additional commands, e-mail: users-help@wicket.apache.org
>>
>>
>
Re: Shadow text on input fields
Posted by Josh Kamau <jo...@gmail.com>.
Thanks Marjtin
On Mon, Apr 26, 2010 at 11:27 AM, Martijn Dashorst <
martijn.dashorst@gmail.com> wrote:
> If you can get away with it, you can use HTML5's placeholder text:
>
> http://diveintohtml5.org/forms.html
>
> Martijn
>
> On Mon, Apr 26, 2010 at 9:19 AM, Josh Kamau <jo...@gmail.com> wrote:
> > Hi guys;
> >
> > I would like to put some shadow text on the form input fields that
> > disappears when one starts editing the field. The kind that appears on
> > facebook fields. How do i do it. Most likely its not a wicket issue but i
> > really need assistance in this. Am not very good in javascript.
> >
> > Kind regards
> >
> > Josh
> >
>
>
>
> --
> Become a Wicket expert, learn from the best: http://wicketinaction.com
> Apache Wicket 1.4 increases type safety for web applications
> Get it now: http://www.apache.org/dyn/closer.cgi/wicket/1.4.7
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>
Re: Shadow text on input fields
Posted by Martijn Dashorst <ma...@gmail.com>.
If you can get away with it, you can use HTML5's placeholder text:
http://diveintohtml5.org/forms.html
Martijn
On Mon, Apr 26, 2010 at 9:19 AM, Josh Kamau <jo...@gmail.com> wrote:
> Hi guys;
>
> I would like to put some shadow text on the form input fields that
> disappears when one starts editing the field. The kind that appears on
> facebook fields. How do i do it. Most likely its not a wicket issue but i
> really need assistance in this. Am not very good in javascript.
>
> Kind regards
>
> Josh
>
--
Become a Wicket expert, learn from the best: http://wicketinaction.com
Apache Wicket 1.4 increases type safety for web applications
Get it now: http://www.apache.org/dyn/closer.cgi/wicket/1.4.7
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: how to build two-state (edit/view) form and form components?
Posted by Jeremy Thomerson <je...@wickettraining.com>.
There's been some posts on the lists before about this. You may find them
helpful. The most basic form is that each field is a panel that shows
either one or the other (input or label typically).
--
Jeremy Thomerson
http://www.wickettraining.com
On Tue, Apr 27, 2010 at 7:43 AM, David Chang <da...@yahoo.com>wrote:
> I would like to have a form in which each component (such as input,
> textarea) has two states. Clicking on a form component's label or something
> else switches the component between edit (shown as usual input, textarea,
> etc) or view (normal html display) modes. Finally when a user is okay with
> everything, he/she can clicks the submit button to send the whole form to
> the server for further actions.
>
> Can anyone give me some pointers or tips for doing it in Wicket?
>
> Thanks and all the best!
>
>
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>
Re: Shadow text on input fields
Posted by Stefan Jozsa <st...@yahoo.com>.
I'm using Wicket to develop
flexible, i18n-ed webapps where
HTML and JS are second class citizens.
At first your JS looks more compact,
but on long term is a dead end.
Stefan
--- On Tue, 4/27/10, Robert Kimotho <ki...@gmail.com> wrote:
> From: Robert Kimotho <ki...@gmail.com>
> Subject: Re: Shadow text on input fields
> To: users@wicket.apache.org
> Date: Tuesday, April 27, 2010, 11:19 AM
> have you tried:-
>
> <input type="text" name="" size="" value=" your
> text..."
> onFocus="this.value=''" onMouseOver="window.status=' your
> txt...';return true" onMouseOut="window.status='';return
> true">
>
> Kimotho,
>
> On 4/26/10, Stefan Jozsa <st...@yahoo.com>
> wrote:
> > CSS:
> > .inputHint {
> > color: #888866;
> > }
> >
> > Java:
> > add(new AttributeModifier("value", true, new
> AbstractReadOnlyModel<String>()
> > {
> > @Override
> > public String getObject() {
> > return
> "yourHintText";
> > }
> > }));
> > add(new AttributeModifier("class", true, new
> AbstractReadOnlyModel<String>()
> > {
> > @Override
> > public String getObject() {
> > return
> "inputHint";
> > }
> > }));
> > add(new AttributeModifier("onfocus", true, new
> > AbstractReadOnlyModel<String>() {
> > @Override
> > public String getObject() {
> > return
> "removeInputHint(this,'inputHint');";
> > }
> > }));
> >
> > JS:
> > removeInputHint = function(x, c) {
> > x.setAttribute('value', '');
> > jQuery(x).removeClass(c);
> > }
> >
> > Stefan
> >
> >
> >
> >
> >
> >
> >
> ---------------------------------------------------------------------
> > 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
>
>
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
how to build two-state (edit/view) form and form components?
Posted by David Chang <da...@yahoo.com>.
I would like to have a form in which each component (such as input, textarea) has two states. Clicking on a form component's label or something else switches the component between edit (shown as usual input, textarea, etc) or view (normal html display) modes. Finally when a user is okay with everything, he/she can clicks the submit button to send the whole form to the server for further actions.
Can anyone give me some pointers or tips for doing it in Wicket?
Thanks and all the best!
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: Shadow text on input fields
Posted by Robert Kimotho <ki...@gmail.com>.
have you tried:-
<input type="text" name="" size="" value=" your text..."
onFocus="this.value=''" onMouseOver="window.status=' your
txt...';return true" onMouseOut="window.status='';return true">
Kimotho,
On 4/26/10, Stefan Jozsa <st...@yahoo.com> wrote:
> CSS:
> .inputHint {
> color: #888866;
> }
>
> Java:
> add(new AttributeModifier("value", true, new AbstractReadOnlyModel<String>()
> {
> @Override
> public String getObject() {
> return "yourHintText";
> }
> }));
> add(new AttributeModifier("class", true, new AbstractReadOnlyModel<String>()
> {
> @Override
> public String getObject() {
> return "inputHint";
> }
> }));
> add(new AttributeModifier("onfocus", true, new
> AbstractReadOnlyModel<String>() {
> @Override
> public String getObject() {
> return "removeInputHint(this,'inputHint');";
> }
> }));
>
> JS:
> removeInputHint = function(x, c) {
> x.setAttribute('value', '');
> jQuery(x).removeClass(c);
> }
>
> Stefan
>
>
>
>
>
>
> ---------------------------------------------------------------------
> 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: Shadow text on input fields
Posted by Stefan Jozsa <st...@yahoo.com>.
CSS:
.inputHint {
color: #888866;
}
Java:
add(new AttributeModifier("value", true, new AbstractReadOnlyModel<String>() {
@Override
public String getObject() {
return "yourHintText";
}
}));
add(new AttributeModifier("class", true, new AbstractReadOnlyModel<String>() {
@Override
public String getObject() {
return "inputHint";
}
}));
add(new AttributeModifier("onfocus", true, new AbstractReadOnlyModel<String>() {
@Override
public String getObject() {
return "removeInputHint(this,'inputHint');";
}
}));
JS:
removeInputHint = function(x, c) {
x.setAttribute('value', '');
jQuery(x).removeClass(c);
}
Stefan
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org