You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by Dmitriy Neretin <dm...@googlemail.com> on 2012/11/27 17:09:35 UTC
Strange behavior of TextField and AjaxFormComponentUpdatingBehavior
Hi wicket-users,
I have a question about a combination of the TextField and
AjaxFormComponentUpdatingBehavior.
I have a text field with content. Just to indicate what user should enter.
For example a day text filed, which already contains following "DD".
I do it by following:
dayField.setModel(Model.of("DD"));
My idea now is to delete this text automatically. For example with
"oncklick" event. What I did is:
dayField.add(new AjaxFormComponentUpdatingBehavior("oncklick"){
onUpdate(){
doSomeStuff
}
});
So, the problem now is it doesn't work at first time! For example I click
in the field, delete the text, insert another text, leave the field. Click
in the filed again and only then onUpdate method performs. But it doesn't
perform at first time and I don't understand why...
Can somebody help me?
Regards,
Dmitriy
Re: Strange behavior of TextField and AjaxFormComponentUpdatingBehavior
Posted by Dmitriy Neretin <dm...@googlemail.com>.
"onclick" :) Nice idea! Thank you
Am 27.11.2012 17:16 schrieb "Sven Meier" <sv...@meiers.net>:
> "oncklick"
>>
>
> ... or "onclick" ?
>
> I'd recommend a javascript only solution without round-trip to the server.
>
> http://stackoverflow.com/**questions/2851794/clear-text-**
> onclick-textfield<http://stackoverflow.com/questions/2851794/clear-text-onclick-textfield>
>
> Sven
>
> On 11/27/2012 05:09 PM, Dmitriy Neretin wrote:
>
>> Hi wicket-users,
>>
>> I have a question about a combination of the TextField and
>> AjaxFormComponentUpdatingBehav**ior.
>>
>> I have a text field with content. Just to indicate what user should enter.
>> For example a day text filed, which already contains following "DD".
>> I do it by following:
>> dayField.setModel(Model.of("**DD"));
>>
>> My idea now is to delete this text automatically. For example with
>> "oncklick" event. What I did is:
>>
>> dayField.add(new AjaxFormComponentUpdatingBehav**ior("oncklick"){
>>
>> onUpdate(){
>> doSomeStuff
>> }
>> });
>>
>> So, the problem now is it doesn't work at first time! For example I click
>> in the field, delete the text, insert another text, leave the field. Click
>> in the filed again and only then onUpdate method performs. But it doesn't
>> perform at first time and I don't understand why...
>>
>> Can somebody help me?
>>
>> Regards,
>> Dmitriy
>>
>>
>
> ------------------------------**------------------------------**---------
> To unsubscribe, e-mail: users-unsubscribe@wicket.**apache.org<us...@wicket.apache.org>
> For additional commands, e-mail: users-help@wicket.apache.org
>
>
Re: Strange behavior of TextField and AjaxFormComponentUpdatingBehavior
Posted by Sébastien Gautrin <se...@gmail.com>.
Well with the library linked by Cédric which let's you have "html5
placeholder" for older browsers, you actually don't have to touch
anything in the layout to use that. All you need to do is have your
wicket component (TextField most likely) contribute to the header the js
dependencies (with renderHead(Response)), as well as attach to it an
AttributeModifier which will define the "placeholder" attribute. (and if
you don't need support for older browsers, all you need it then the
AttributeModifier).
Dmitriy Neretin wrote:
> Thank you guys, but unfortunately I have some constraints related to the
> layout etc. and I can't avoid them...
>
> Dmitriy
>
> 2012/11/28 Cedric Gatay <ga...@gmail.com>
>
>> For the placeholder thing you can use the standard HTML5 way with a
>> polyfill such as the following (with Modernizr it will only be loaded if
>> the client need it) :
>> https://github.com/ginader/HTML5-placeholder-polyfill
>> __
>> Cedric Gatay
>> http://www.bloggure.info | http://cedric.gatay.fr |
>> @Cedric_Gatay<http://twitter.com/Cedric_Gatay>
>>
>>
>>
>> On Wed, Nov 28, 2012 at 10:32 AM, Sébastien Gautrin <
>> sebastien.gautrin@gmail.com> wrote:
>>
>>> Actually I'd recommend not puting the placeholder in the input itself,
>>> assuming you don't have to support old browsers that most other now have
>>> stopped supporting a few years back. Depending on the browser of your
>>> users, you can:
>>> - use the html5 placeholder attribute (best way to do that, but you won't
>>> support ie < 10)
>>> - have the placeholder appear in the input while it's not; one nice
>>> technique is to use a label/span that you will move above the input with
>>> css (using position attribute and z-index); then you have a little
>>> javascript that will simply change the opacity of that placeholder
>>> depending on conditions: with an initial opacity of 1, you can put it at
>>> 0.5 when the user focus the field, and at 0 once he entered anything.
>>> Advantages of that compared to putting the placeholder in the input is
>> you
>>> don't have to worry about the placeholder value being actually submitted
>> by
>>> the client, and that you won't have any bloat to have the placeholder
>> back
>>> if the user empty the field.
>>>
>>> Note that for the second option, you need opacity, and thus either IE8+
>> or
>>> have the proprietary ms syntax for that (IE5-7 using filter:
>>> alpha(opacity=50);, IE8 using -ms-filter:"progid:**
>>> DXImageTransform.Microsoft.**Alpha(Opacity=50)";)
>>>
>>>
>>> Sven Meier wrote:
>>>
>>>> "oncklick"
>>>> ... or "onclick" ?
>>>>
>>>> I'd recommend a javascript only solution without round-trip to the
>> server.
>>>> http://stackoverflow.com/**questions/2851794/clear-text-**
>>>> onclick-textfield<
>> http://stackoverflow.com/questions/2851794/clear-text-onclick-textfield>
>>>> Sven
>>>>
>>>> On 11/27/2012 05:09 PM, Dmitriy Neretin wrote:
>>>>
>>>>> Hi wicket-users,
>>>>>
>>>>> I have a question about a combination of the TextField and
>>>>> AjaxFormComponentUpdatingBehav**ior.
>>>>>
>>>>> I have a text field with content. Just to indicate what user should
>>>>> enter.
>>>>> For example a day text filed, which already contains following "DD".
>>>>> I do it by following:
>>>>> dayField.setModel(Model.of("**DD"));
>>>>>
>>>>> My idea now is to delete this text automatically. For example with
>>>>> "oncklick" event. What I did is:
>>>>>
>>>>> dayField.add(new AjaxFormComponentUpdatingBehav**ior("oncklick"){
>>>>>
>>>>> onUpdate(){
>>>>> doSomeStuff
>>>>> }
>>>>> });
>>>>>
>>>>> So, the problem now is it doesn't work at first time! For example I
>> click
>>>>> in the field, delete the text, insert another text, leave the field.
>>>>> Click
>>>>> in the filed again and only then onUpdate method performs. But it
>> doesn't
>>>>> perform at first time and I don't understand why...
>>>>>
>>>>> Can somebody help me?
>>>>>
>>>>> Regards,
>>>>> Dmitriy
>>>>>
>>>>>
>>>>
>> ------------------------------**------------------------------**---------
>>>> To unsubscribe, e-mail: users-unsubscribe@wicket.**apache.org<
>> users-unsubscribe@wicket.apache.org>
>>>> For additional commands, e-mail: users-help@wicket.apache.org
>>>>
>>>>
>>> ------------------------------**------------------------------**---------
>>> To unsubscribe, e-mail: users-unsubscribe@wicket.**apache.org<
>> 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: Strange behavior of TextField and AjaxFormComponentUpdatingBehavior
Posted by Dmitriy Neretin <dm...@googlemail.com>.
Thank you guys, but unfortunately I have some constraints related to the
layout etc. and I can't avoid them...
Dmitriy
2012/11/28 Cedric Gatay <ga...@gmail.com>
> For the placeholder thing you can use the standard HTML5 way with a
> polyfill such as the following (with Modernizr it will only be loaded if
> the client need it) :
> https://github.com/ginader/HTML5-placeholder-polyfill
> __
> Cedric Gatay
> http://www.bloggure.info | http://cedric.gatay.fr |
> @Cedric_Gatay<http://twitter.com/Cedric_Gatay>
>
>
>
> On Wed, Nov 28, 2012 at 10:32 AM, Sébastien Gautrin <
> sebastien.gautrin@gmail.com> wrote:
>
> > Actually I'd recommend not puting the placeholder in the input itself,
> > assuming you don't have to support old browsers that most other now have
> > stopped supporting a few years back. Depending on the browser of your
> > users, you can:
> > - use the html5 placeholder attribute (best way to do that, but you won't
> > support ie < 10)
> > - have the placeholder appear in the input while it's not; one nice
> > technique is to use a label/span that you will move above the input with
> > css (using position attribute and z-index); then you have a little
> > javascript that will simply change the opacity of that placeholder
> > depending on conditions: with an initial opacity of 1, you can put it at
> > 0.5 when the user focus the field, and at 0 once he entered anything.
> > Advantages of that compared to putting the placeholder in the input is
> you
> > don't have to worry about the placeholder value being actually submitted
> by
> > the client, and that you won't have any bloat to have the placeholder
> back
> > if the user empty the field.
> >
> > Note that for the second option, you need opacity, and thus either IE8+
> or
> > have the proprietary ms syntax for that (IE5-7 using filter:
> > alpha(opacity=50);, IE8 using -ms-filter:"progid:**
> > DXImageTransform.Microsoft.**Alpha(Opacity=50)";)
> >
> >
> > Sven Meier wrote:
> >
> >> "oncklick"
> >>>
> >>
> >> ... or "onclick" ?
> >>
> >> I'd recommend a javascript only solution without round-trip to the
> server.
> >>
> >> http://stackoverflow.com/**questions/2851794/clear-text-**
> >> onclick-textfield<
> http://stackoverflow.com/questions/2851794/clear-text-onclick-textfield>
> >>
> >> Sven
> >>
> >> On 11/27/2012 05:09 PM, Dmitriy Neretin wrote:
> >>
> >>> Hi wicket-users,
> >>>
> >>> I have a question about a combination of the TextField and
> >>> AjaxFormComponentUpdatingBehav**ior.
> >>>
> >>> I have a text field with content. Just to indicate what user should
> >>> enter.
> >>> For example a day text filed, which already contains following "DD".
> >>> I do it by following:
> >>> dayField.setModel(Model.of("**DD"));
> >>>
> >>> My idea now is to delete this text automatically. For example with
> >>> "oncklick" event. What I did is:
> >>>
> >>> dayField.add(new AjaxFormComponentUpdatingBehav**ior("oncklick"){
> >>>
> >>> onUpdate(){
> >>> doSomeStuff
> >>> }
> >>> });
> >>>
> >>> So, the problem now is it doesn't work at first time! For example I
> click
> >>> in the field, delete the text, insert another text, leave the field.
> >>> Click
> >>> in the filed again and only then onUpdate method performs. But it
> doesn't
> >>> perform at first time and I don't understand why...
> >>>
> >>> Can somebody help me?
> >>>
> >>> Regards,
> >>> Dmitriy
> >>>
> >>>
> >>
> >>
> ------------------------------**------------------------------**---------
> >> To unsubscribe, e-mail: users-unsubscribe@wicket.**apache.org<
> users-unsubscribe@wicket.apache.org>
> >> For additional commands, e-mail: users-help@wicket.apache.org
> >>
> >>
> >
> > ------------------------------**------------------------------**---------
> > To unsubscribe, e-mail: users-unsubscribe@wicket.**apache.org<
> users-unsubscribe@wicket.apache.org>
> > For additional commands, e-mail: users-help@wicket.apache.org
> >
> >
>
Re: Strange behavior of TextField and AjaxFormComponentUpdatingBehavior
Posted by Cedric Gatay <ga...@gmail.com>.
For the placeholder thing you can use the standard HTML5 way with a
polyfill such as the following (with Modernizr it will only be loaded if
the client need it) : https://github.com/ginader/HTML5-placeholder-polyfill
__
Cedric Gatay
http://www.bloggure.info | http://cedric.gatay.fr |
@Cedric_Gatay<http://twitter.com/Cedric_Gatay>
On Wed, Nov 28, 2012 at 10:32 AM, Sébastien Gautrin <
sebastien.gautrin@gmail.com> wrote:
> Actually I'd recommend not puting the placeholder in the input itself,
> assuming you don't have to support old browsers that most other now have
> stopped supporting a few years back. Depending on the browser of your
> users, you can:
> - use the html5 placeholder attribute (best way to do that, but you won't
> support ie < 10)
> - have the placeholder appear in the input while it's not; one nice
> technique is to use a label/span that you will move above the input with
> css (using position attribute and z-index); then you have a little
> javascript that will simply change the opacity of that placeholder
> depending on conditions: with an initial opacity of 1, you can put it at
> 0.5 when the user focus the field, and at 0 once he entered anything.
> Advantages of that compared to putting the placeholder in the input is you
> don't have to worry about the placeholder value being actually submitted by
> the client, and that you won't have any bloat to have the placeholder back
> if the user empty the field.
>
> Note that for the second option, you need opacity, and thus either IE8+ or
> have the proprietary ms syntax for that (IE5-7 using filter:
> alpha(opacity=50);, IE8 using -ms-filter:"progid:**
> DXImageTransform.Microsoft.**Alpha(Opacity=50)";)
>
>
> Sven Meier wrote:
>
>> "oncklick"
>>>
>>
>> ... or "onclick" ?
>>
>> I'd recommend a javascript only solution without round-trip to the server.
>>
>> http://stackoverflow.com/**questions/2851794/clear-text-**
>> onclick-textfield<http://stackoverflow.com/questions/2851794/clear-text-onclick-textfield>
>>
>> Sven
>>
>> On 11/27/2012 05:09 PM, Dmitriy Neretin wrote:
>>
>>> Hi wicket-users,
>>>
>>> I have a question about a combination of the TextField and
>>> AjaxFormComponentUpdatingBehav**ior.
>>>
>>> I have a text field with content. Just to indicate what user should
>>> enter.
>>> For example a day text filed, which already contains following "DD".
>>> I do it by following:
>>> dayField.setModel(Model.of("**DD"));
>>>
>>> My idea now is to delete this text automatically. For example with
>>> "oncklick" event. What I did is:
>>>
>>> dayField.add(new AjaxFormComponentUpdatingBehav**ior("oncklick"){
>>>
>>> onUpdate(){
>>> doSomeStuff
>>> }
>>> });
>>>
>>> So, the problem now is it doesn't work at first time! For example I click
>>> in the field, delete the text, insert another text, leave the field.
>>> Click
>>> in the filed again and only then onUpdate method performs. But it doesn't
>>> perform at first time and I don't understand why...
>>>
>>> Can somebody help me?
>>>
>>> Regards,
>>> Dmitriy
>>>
>>>
>>
>> ------------------------------**------------------------------**---------
>> To unsubscribe, e-mail: users-unsubscribe@wicket.**apache.org<us...@wicket.apache.org>
>> For additional commands, e-mail: users-help@wicket.apache.org
>>
>>
>
> ------------------------------**------------------------------**---------
> To unsubscribe, e-mail: users-unsubscribe@wicket.**apache.org<us...@wicket.apache.org>
> For additional commands, e-mail: users-help@wicket.apache.org
>
>
Re: Strange behavior of TextField and AjaxFormComponentUpdatingBehavior
Posted by Sébastien Gautrin <se...@gmail.com>.
Actually I'd recommend not puting the placeholder in the input itself,
assuming you don't have to support old browsers that most other now have
stopped supporting a few years back. Depending on the browser of your
users, you can:
- use the html5 placeholder attribute (best way to do that, but you
won't support ie < 10)
- have the placeholder appear in the input while it's not; one nice
technique is to use a label/span that you will move above the input with
css (using position attribute and z-index); then you have a little
javascript that will simply change the opacity of that placeholder
depending on conditions: with an initial opacity of 1, you can put it at
0.5 when the user focus the field, and at 0 once he entered anything.
Advantages of that compared to putting the placeholder in the input is
you don't have to worry about the placeholder value being actually
submitted by the client, and that you won't have any bloat to have the
placeholder back if the user empty the field.
Note that for the second option, you need opacity, and thus either IE8+
or have the proprietary ms syntax for that (IE5-7 using filter:
alpha(opacity=50);, IE8 using
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";)
Sven Meier wrote:
>> "oncklick"
>
> ... or "onclick" ?
>
> I'd recommend a javascript only solution without round-trip to the
> server.
>
> http://stackoverflow.com/questions/2851794/clear-text-onclick-textfield
>
> Sven
>
> On 11/27/2012 05:09 PM, Dmitriy Neretin wrote:
>> Hi wicket-users,
>>
>> I have a question about a combination of the TextField and
>> AjaxFormComponentUpdatingBehavior.
>>
>> I have a text field with content. Just to indicate what user should
>> enter.
>> For example a day text filed, which already contains following "DD".
>> I do it by following:
>> dayField.setModel(Model.of("DD"));
>>
>> My idea now is to delete this text automatically. For example with
>> "oncklick" event. What I did is:
>>
>> dayField.add(new AjaxFormComponentUpdatingBehavior("oncklick"){
>>
>> onUpdate(){
>> doSomeStuff
>> }
>> });
>>
>> So, the problem now is it doesn't work at first time! For example I
>> click
>> in the field, delete the text, insert another text, leave the field.
>> Click
>> in the filed again and only then onUpdate method performs. But it
>> doesn't
>> perform at first time and I don't understand why...
>>
>> Can somebody help me?
>>
>> Regards,
>> Dmitriy
>>
>
>
> ---------------------------------------------------------------------
> 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: Strange behavior of TextField and AjaxFormComponentUpdatingBehavior
Posted by Dmitriy Neretin <dm...@googlemail.com>.
Hi,
thank you for idea again :) But I have another question now. This textfield
belongs to wicket panel. And I don't really understand where should I place
<script></script> tags. Is it enough to place it in the panel.html or
should I define it in some other location?
Dmitriy
2012/11/27 Sven Meier <sv...@meiers.net>
> "oncklick"
>>
>
> ... or "onclick" ?
>
> I'd recommend a javascript only solution without round-trip to the server.
>
> http://stackoverflow.com/**questions/2851794/clear-text-**
> onclick-textfield<http://stackoverflow.com/questions/2851794/clear-text-onclick-textfield>
>
> Sven
>
>
> On 11/27/2012 05:09 PM, Dmitriy Neretin wrote:
>
>> Hi wicket-users,
>>
>> I have a question about a combination of the TextField and
>> AjaxFormComponentUpdatingBehav**ior.
>>
>> I have a text field with content. Just to indicate what user should enter.
>> For example a day text filed, which already contains following "DD".
>> I do it by following:
>> dayField.setModel(Model.of("**DD"));
>>
>> My idea now is to delete this text automatically. For example with
>> "oncklick" event. What I did is:
>>
>> dayField.add(new AjaxFormComponentUpdatingBehav**ior("oncklick"){
>>
>> onUpdate(){
>> doSomeStuff
>> }
>> });
>>
>> So, the problem now is it doesn't work at first time! For example I click
>> in the field, delete the text, insert another text, leave the field. Click
>> in the filed again and only then onUpdate method performs. But it doesn't
>> perform at first time and I don't understand why...
>>
>> Can somebody help me?
>>
>> Regards,
>> Dmitriy
>>
>>
>
> ------------------------------**------------------------------**---------
> To unsubscribe, e-mail: users-unsubscribe@wicket.**apache.org<us...@wicket.apache.org>
> For additional commands, e-mail: users-help@wicket.apache.org
>
>
Re: Strange behavior of TextField and AjaxFormComponentUpdatingBehavior
Posted by Sven Meier <sv...@meiers.net>.
>"oncklick"
... or "onclick" ?
I'd recommend a javascript only solution without round-trip to the server.
http://stackoverflow.com/questions/2851794/clear-text-onclick-textfield
Sven
On 11/27/2012 05:09 PM, Dmitriy Neretin wrote:
> Hi wicket-users,
>
> I have a question about a combination of the TextField and
> AjaxFormComponentUpdatingBehavior.
>
> I have a text field with content. Just to indicate what user should enter.
> For example a day text filed, which already contains following "DD".
> I do it by following:
> dayField.setModel(Model.of("DD"));
>
> My idea now is to delete this text automatically. For example with
> "oncklick" event. What I did is:
>
> dayField.add(new AjaxFormComponentUpdatingBehavior("oncklick"){
>
> onUpdate(){
> doSomeStuff
> }
> });
>
> So, the problem now is it doesn't work at first time! For example I click
> in the field, delete the text, insert another text, leave the field. Click
> in the filed again and only then onUpdate method performs. But it doesn't
> perform at first time and I don't understand why...
>
> Can somebody help me?
>
> Regards,
> Dmitriy
>
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org