You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by Filippo De Luca <dl...@filosganga.it> on 2009/03/18 13:33:19 UTC

OnChangeAjaxBehavior only first time

Hi,
I have a panel MatchingPanel with a form and a result div:

        <wicket:panel>

            <form wicket:id="form" action="#">
                <div class="widget">
                    <label><wicket:message
key="form.userAgent">[form.userAgent]</wicket:message></label>
                    <input wicket:id="userAgent" class="userAgent"
type="text" maxlength="255" />
                </div>
                <div class="buttons">
                    <input type="submit" value="Match"
wicket:message="value:form.match" />
                </div>
            </form>
            <div wicket:id="result" >
                <div>
                    <label><wicket:message
key="result.matchedUserAgent">[result.matchedUserAgent]</wicket:message></label>
                    <span
wicket:id="matchedUserAgent">[sourceUserAgent]</span>
                </div>
            </div>
        </wicket:panel>

while my java code is:

    class MatchingForm extends Form<Object> {

...

        private void registerBehaviors() {
            userAgentField.add(new OnChangeAjaxBehavior() {

                @Override
                protected void onUpdate(AjaxRequestTarget target) {

                    logger.debug("AJAX matching user agent");

                    matchUserAgent();
                    target.addComponent(resultPanel);
                }
            });
        }

...

        private void matchUserAgent() {

            String userAgent = userAgentModel.getObject();
            WURFLManager wurflManager = getWurflManager();

            MatchingResult result = null;

            if (StringUtils.isNotBlank(userAgent)) {

                Instant start = new Instant();
                Device device = wurflManager.getDeviceForRequest(userAgent);
                Instant end = new Instant();

                Period duration = new Period(start, end);
                result = new MatchingResult(userAgent, device, (long)
duration
                        .getMillis());

            }
            resultPanel.setResult(result);

        }

    }

The OnChangeBehaviour is called only the first time the userAgent field take
the focus. To call other time, i have to lost focus and give focus to
userAgent input text. Why? The target component is outside the frm, it is an
issue?

Thank you

-- 
Filippo De Luca
--------------------------
Email: dl.filippo@filosganga.it
Web:   http://www.filosganga.it
LinkedIn: http://www.linkedin.com/in/filippodeluca
mobile: +393395822588

Re: OnChangeAjaxBehavior only first time

Posted by Antoine van Wel <an...@gmail.com>.
Hi Jeremy,

No, the focus stays on the textfield, that's not the problem. Let me rephrase:


Initially the problem is the same as described by Filippo: I have a
form which triggers an update of another component which is outside
the form. When starting to type in the textfield, the AJAX update is
only triggered the first time.

Following Filippo's solution, I fixed that by updating the form itself
as well. And indeed, now the AJAX behavior is triggered as it should,
every time when the textfield is changed. (Adjusting throttle delay
improves the situation, but does not fix it.)

Now what happens if I try to type "test" in the textfield, is that the
AJAX update is triggered on "t". I continue typing "est" while the
AJAX response did not arrive. When it does arrive, it will refresh the
form - setting its value back to "t".

So my question is, is there any other way to fix the original problem,
without refreshing the form?


Antoine


On Mon, Jan 18, 2010 at 10:41 PM, Jeremy Thomerson
<je...@wickettraining.com> wrote:
> Do you mean the issue is that the onchange behavior is not called without
> taking the focus off of the textfield?  If you want something that is going
> to work without taking focus off the textfield, hook into the onkeyup (or
> down) event instead.
>
>
> --
> Jeremy Thomerson
> http://www.wickettraining.com
>
>
>
> On Mon, Jan 18, 2010 at 3:03 PM, Antoine van Wel
> <an...@gmail.com>wrote:
>
>> Hi,
>>
>> Does anybody have ideas how to solve this by *not* updating the form?
>>
>> I'm running into the same issue when putting an OnChangeAjaxBehavior
>> on a TextField inside a form (triggered only once). The component to
>> be updated is outside the form.
>>
>> Updating the form like suggested "solves" the issue; however, when the
>> user types in text in this textfield and the form is constantly
>> updated, this means text will get lost. Adjusting the throttle delay
>> helps, but not enough. I just cannot update the form part via AJAX. So
>> are there any other ways to fix this problem?
>>
>>
>> Antoine.
>>
>>
>> On Wed, Mar 18, 2009 at 3:22 PM, Filippo De Luca
>> <dl...@filosganga.it> wrote:
>> > Hi wicketers,
>> > I have fixed this issue by including form in target component:
>> >
>> >        private void registerBehaviors() {
>> >            userAgentField.add(new OnChangeAjaxBehavior() {
>> >
>> >                @Override
>> >                protected void onUpdate(AjaxRequestTarget target) {
>> >
>> >                    logger.debug("AJAX matching user agent");
>> >
>> >                    matchUserAgent();
>> >                    target.addComponent(resultPanel);
>> >                    target.addComponent(matchingForm);
>> >                }
>> >            });
>> >        }
>> >
>> > I've found this mail:
>> >
>> http://www.nabble.com/OnChangeAjaxBehavior-receives-only-first-input-character-td20207317.html
>> ,
>> > it is the same issue.
>> >
>> > It is this behavior default? or it is an issue?
>> >
>> > 2009/3/18 Filippo De Luca <dl...@filosganga.it>
>> >
>> >> Hi,
>> >> I have a panel MatchingPanel with a form and a result div:
>> >>
>> >>         <wicket:panel>
>> >>
>> >>             <form wicket:id="form" action="#">
>> >>                 <div class="widget">
>> >>                     <label><wicket:message
>> >> key="form.userAgent">[form.userAgent]</wicket:message></label>
>> >>                     <input wicket:id="userAgent" class="userAgent"
>> >> type="text" maxlength="255" />
>> >>                 </div>
>> >>                 <div class="buttons">
>> >>                     <input type="submit" value="Match"
>> >> wicket:message="value:form.match" />
>> >>                 </div>
>> >>             </form>
>> >>             <div wicket:id="result" >
>> >>                 <div>
>> >>                     <label><wicket:message
>> >>
>> key="result.matchedUserAgent">[result.matchedUserAgent]</wicket:message></label>
>> >>                     <span
>> >> wicket:id="matchedUserAgent">[sourceUserAgent]</span>
>> >>                 </div>
>> >>             </div>
>> >>         </wicket:panel>
>> >>
>> >> while my java code is:
>> >>
>> >>     class MatchingForm extends Form<Object> {
>> >>
>> >> ...
>> >>
>> >>         private void registerBehaviors() {
>> >>             userAgentField.add(new OnChangeAjaxBehavior() {
>> >>
>> >>                 @Override
>> >>                 protected void onUpdate(AjaxRequestTarget target) {
>> >>
>> >>                     logger.debug("AJAX matching user agent");
>> >>
>> >>                     matchUserAgent();
>> >>                     target.addComponent(resultPanel);
>> >>                 }
>> >>             });
>> >>         }
>> >>
>> >> ...
>> >>
>> >>         private void matchUserAgent() {
>> >>
>> >>             String userAgent = userAgentModel.getObject();
>> >>             WURFLManager wurflManager = getWurflManager();
>> >>
>> >>             MatchingResult result = null;
>> >>
>> >>             if (StringUtils.isNotBlank(userAgent)) {
>> >>
>> >>                 Instant start = new Instant();
>> >>                 Device device =
>> >> wurflManager.getDeviceForRequest(userAgent);
>> >>                 Instant end = new Instant();
>> >>
>> >>                 Period duration = new Period(start, end);
>> >>                 result = new MatchingResult(userAgent, device, (long)
>> >> duration
>> >>                         .getMillis());
>> >>
>> >>             }
>> >>             resultPanel.setResult(result);
>> >>
>> >>         }
>> >>
>> >>     }
>> >>
>> >> The OnChangeBehaviour is called only the first time the userAgent field
>> >> take the focus. To call other time, i have to lost focus and give focus
>> to
>> >> userAgent input text. Why? The target component is outside the frm, it
>> is an
>> >> issue?
>> >>
>> >> Thank you
>> >>
>> >> --
>> >> Filippo De Luca
>> >> --------------------------
>> >> Email: dl.filippo@filosganga.it
>> >> Web:   http://www.filosganga.it
>> >> LinkedIn: http://www.linkedin.com/in/filippodeluca
>> >> mobile: +393395822588
>> >>
>> >
>> >
>> >
>> > --
>> > Filippo De Luca
>> > --------------------------
>> > Email: dl.filippo@filosganga.it
>> > Web:   http://www.filosganga.it
>> > LinkedIn: http://www.linkedin.com/in/filippodeluca
>> > mobile: +393395822588
>> >
>>
>> ---------------------------------------------------------------------
>> 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: OnChangeAjaxBehavior only first time

Posted by Jeremy Thomerson <je...@wickettraining.com>.
Do you mean the issue is that the onchange behavior is not called without
taking the focus off of the textfield?  If you want something that is going
to work without taking focus off the textfield, hook into the onkeyup (or
down) event instead.


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



On Mon, Jan 18, 2010 at 3:03 PM, Antoine van Wel
<an...@gmail.com>wrote:

> Hi,
>
> Does anybody have ideas how to solve this by *not* updating the form?
>
> I'm running into the same issue when putting an OnChangeAjaxBehavior
> on a TextField inside a form (triggered only once). The component to
> be updated is outside the form.
>
> Updating the form like suggested "solves" the issue; however, when the
> user types in text in this textfield and the form is constantly
> updated, this means text will get lost. Adjusting the throttle delay
> helps, but not enough. I just cannot update the form part via AJAX. So
> are there any other ways to fix this problem?
>
>
> Antoine.
>
>
> On Wed, Mar 18, 2009 at 3:22 PM, Filippo De Luca
> <dl...@filosganga.it> wrote:
> > Hi wicketers,
> > I have fixed this issue by including form in target component:
> >
> >        private void registerBehaviors() {
> >            userAgentField.add(new OnChangeAjaxBehavior() {
> >
> >                @Override
> >                protected void onUpdate(AjaxRequestTarget target) {
> >
> >                    logger.debug("AJAX matching user agent");
> >
> >                    matchUserAgent();
> >                    target.addComponent(resultPanel);
> >                    target.addComponent(matchingForm);
> >                }
> >            });
> >        }
> >
> > I've found this mail:
> >
> http://www.nabble.com/OnChangeAjaxBehavior-receives-only-first-input-character-td20207317.html
> ,
> > it is the same issue.
> >
> > It is this behavior default? or it is an issue?
> >
> > 2009/3/18 Filippo De Luca <dl...@filosganga.it>
> >
> >> Hi,
> >> I have a panel MatchingPanel with a form and a result div:
> >>
> >>         <wicket:panel>
> >>
> >>             <form wicket:id="form" action="#">
> >>                 <div class="widget">
> >>                     <label><wicket:message
> >> key="form.userAgent">[form.userAgent]</wicket:message></label>
> >>                     <input wicket:id="userAgent" class="userAgent"
> >> type="text" maxlength="255" />
> >>                 </div>
> >>                 <div class="buttons">
> >>                     <input type="submit" value="Match"
> >> wicket:message="value:form.match" />
> >>                 </div>
> >>             </form>
> >>             <div wicket:id="result" >
> >>                 <div>
> >>                     <label><wicket:message
> >>
> key="result.matchedUserAgent">[result.matchedUserAgent]</wicket:message></label>
> >>                     <span
> >> wicket:id="matchedUserAgent">[sourceUserAgent]</span>
> >>                 </div>
> >>             </div>
> >>         </wicket:panel>
> >>
> >> while my java code is:
> >>
> >>     class MatchingForm extends Form<Object> {
> >>
> >> ...
> >>
> >>         private void registerBehaviors() {
> >>             userAgentField.add(new OnChangeAjaxBehavior() {
> >>
> >>                 @Override
> >>                 protected void onUpdate(AjaxRequestTarget target) {
> >>
> >>                     logger.debug("AJAX matching user agent");
> >>
> >>                     matchUserAgent();
> >>                     target.addComponent(resultPanel);
> >>                 }
> >>             });
> >>         }
> >>
> >> ...
> >>
> >>         private void matchUserAgent() {
> >>
> >>             String userAgent = userAgentModel.getObject();
> >>             WURFLManager wurflManager = getWurflManager();
> >>
> >>             MatchingResult result = null;
> >>
> >>             if (StringUtils.isNotBlank(userAgent)) {
> >>
> >>                 Instant start = new Instant();
> >>                 Device device =
> >> wurflManager.getDeviceForRequest(userAgent);
> >>                 Instant end = new Instant();
> >>
> >>                 Period duration = new Period(start, end);
> >>                 result = new MatchingResult(userAgent, device, (long)
> >> duration
> >>                         .getMillis());
> >>
> >>             }
> >>             resultPanel.setResult(result);
> >>
> >>         }
> >>
> >>     }
> >>
> >> The OnChangeBehaviour is called only the first time the userAgent field
> >> take the focus. To call other time, i have to lost focus and give focus
> to
> >> userAgent input text. Why? The target component is outside the frm, it
> is an
> >> issue?
> >>
> >> Thank you
> >>
> >> --
> >> Filippo De Luca
> >> --------------------------
> >> Email: dl.filippo@filosganga.it
> >> Web:   http://www.filosganga.it
> >> LinkedIn: http://www.linkedin.com/in/filippodeluca
> >> mobile: +393395822588
> >>
> >
> >
> >
> > --
> > Filippo De Luca
> > --------------------------
> > Email: dl.filippo@filosganga.it
> > Web:   http://www.filosganga.it
> > LinkedIn: http://www.linkedin.com/in/filippodeluca
> > mobile: +393395822588
> >
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>

Re: OnChangeAjaxBehavior only first time

Posted by Antoine van Wel <an...@gmail.com>.
Hi,

Does anybody have ideas how to solve this by *not* updating the form?

I'm running into the same issue when putting an OnChangeAjaxBehavior
on a TextField inside a form (triggered only once). The component to
be updated is outside the form.

Updating the form like suggested "solves" the issue; however, when the
user types in text in this textfield and the form is constantly
updated, this means text will get lost. Adjusting the throttle delay
helps, but not enough. I just cannot update the form part via AJAX. So
are there any other ways to fix this problem?


Antoine.


On Wed, Mar 18, 2009 at 3:22 PM, Filippo De Luca
<dl...@filosganga.it> wrote:
> Hi wicketers,
> I have fixed this issue by including form in target component:
>
>        private void registerBehaviors() {
>            userAgentField.add(new OnChangeAjaxBehavior() {
>
>                @Override
>                protected void onUpdate(AjaxRequestTarget target) {
>
>                    logger.debug("AJAX matching user agent");
>
>                    matchUserAgent();
>                    target.addComponent(resultPanel);
>                    target.addComponent(matchingForm);
>                }
>            });
>        }
>
> I've found this mail:
> http://www.nabble.com/OnChangeAjaxBehavior-receives-only-first-input-character-td20207317.html,
> it is the same issue.
>
> It is this behavior default? or it is an issue?
>
> 2009/3/18 Filippo De Luca <dl...@filosganga.it>
>
>> Hi,
>> I have a panel MatchingPanel with a form and a result div:
>>
>>         <wicket:panel>
>>
>>             <form wicket:id="form" action="#">
>>                 <div class="widget">
>>                     <label><wicket:message
>> key="form.userAgent">[form.userAgent]</wicket:message></label>
>>                     <input wicket:id="userAgent" class="userAgent"
>> type="text" maxlength="255" />
>>                 </div>
>>                 <div class="buttons">
>>                     <input type="submit" value="Match"
>> wicket:message="value:form.match" />
>>                 </div>
>>             </form>
>>             <div wicket:id="result" >
>>                 <div>
>>                     <label><wicket:message
>> key="result.matchedUserAgent">[result.matchedUserAgent]</wicket:message></label>
>>                     <span
>> wicket:id="matchedUserAgent">[sourceUserAgent]</span>
>>                 </div>
>>             </div>
>>         </wicket:panel>
>>
>> while my java code is:
>>
>>     class MatchingForm extends Form<Object> {
>>
>> ...
>>
>>         private void registerBehaviors() {
>>             userAgentField.add(new OnChangeAjaxBehavior() {
>>
>>                 @Override
>>                 protected void onUpdate(AjaxRequestTarget target) {
>>
>>                     logger.debug("AJAX matching user agent");
>>
>>                     matchUserAgent();
>>                     target.addComponent(resultPanel);
>>                 }
>>             });
>>         }
>>
>> ...
>>
>>         private void matchUserAgent() {
>>
>>             String userAgent = userAgentModel.getObject();
>>             WURFLManager wurflManager = getWurflManager();
>>
>>             MatchingResult result = null;
>>
>>             if (StringUtils.isNotBlank(userAgent)) {
>>
>>                 Instant start = new Instant();
>>                 Device device =
>> wurflManager.getDeviceForRequest(userAgent);
>>                 Instant end = new Instant();
>>
>>                 Period duration = new Period(start, end);
>>                 result = new MatchingResult(userAgent, device, (long)
>> duration
>>                         .getMillis());
>>
>>             }
>>             resultPanel.setResult(result);
>>
>>         }
>>
>>     }
>>
>> The OnChangeBehaviour is called only the first time the userAgent field
>> take the focus. To call other time, i have to lost focus and give focus to
>> userAgent input text. Why? The target component is outside the frm, it is an
>> issue?
>>
>> Thank you
>>
>> --
>> Filippo De Luca
>> --------------------------
>> Email: dl.filippo@filosganga.it
>> Web:   http://www.filosganga.it
>> LinkedIn: http://www.linkedin.com/in/filippodeluca
>> mobile: +393395822588
>>
>
>
>
> --
> Filippo De Luca
> --------------------------
> Email: dl.filippo@filosganga.it
> Web:   http://www.filosganga.it
> LinkedIn: http://www.linkedin.com/in/filippodeluca
> mobile: +393395822588
>

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


Re: OnChangeAjaxBehavior only first time

Posted by Filippo De Luca <dl...@filosganga.it>.
Hi wicketers,
I have fixed this issue by including form in target component:

        private void registerBehaviors() {
            userAgentField.add(new OnChangeAjaxBehavior() {

                @Override
                protected void onUpdate(AjaxRequestTarget target) {

                    logger.debug("AJAX matching user agent");

                    matchUserAgent();
                    target.addComponent(resultPanel);
                    target.addComponent(matchingForm);
                }
            });
        }

I've found this mail:
http://www.nabble.com/OnChangeAjaxBehavior-receives-only-first-input-character-td20207317.html,
it is the same issue.

It is this behavior default? or it is an issue?

2009/3/18 Filippo De Luca <dl...@filosganga.it>

> Hi,
> I have a panel MatchingPanel with a form and a result div:
>
>         <wicket:panel>
>
>             <form wicket:id="form" action="#">
>                 <div class="widget">
>                     <label><wicket:message
> key="form.userAgent">[form.userAgent]</wicket:message></label>
>                     <input wicket:id="userAgent" class="userAgent"
> type="text" maxlength="255" />
>                 </div>
>                 <div class="buttons">
>                     <input type="submit" value="Match"
> wicket:message="value:form.match" />
>                 </div>
>             </form>
>             <div wicket:id="result" >
>                 <div>
>                     <label><wicket:message
> key="result.matchedUserAgent">[result.matchedUserAgent]</wicket:message></label>
>                     <span
> wicket:id="matchedUserAgent">[sourceUserAgent]</span>
>                 </div>
>             </div>
>         </wicket:panel>
>
> while my java code is:
>
>     class MatchingForm extends Form<Object> {
>
> ...
>
>         private void registerBehaviors() {
>             userAgentField.add(new OnChangeAjaxBehavior() {
>
>                 @Override
>                 protected void onUpdate(AjaxRequestTarget target) {
>
>                     logger.debug("AJAX matching user agent");
>
>                     matchUserAgent();
>                     target.addComponent(resultPanel);
>                 }
>             });
>         }
>
> ...
>
>         private void matchUserAgent() {
>
>             String userAgent = userAgentModel.getObject();
>             WURFLManager wurflManager = getWurflManager();
>
>             MatchingResult result = null;
>
>             if (StringUtils.isNotBlank(userAgent)) {
>
>                 Instant start = new Instant();
>                 Device device =
> wurflManager.getDeviceForRequest(userAgent);
>                 Instant end = new Instant();
>
>                 Period duration = new Period(start, end);
>                 result = new MatchingResult(userAgent, device, (long)
> duration
>                         .getMillis());
>
>             }
>             resultPanel.setResult(result);
>
>         }
>
>     }
>
> The OnChangeBehaviour is called only the first time the userAgent field
> take the focus. To call other time, i have to lost focus and give focus to
> userAgent input text. Why? The target component is outside the frm, it is an
> issue?
>
> Thank you
>
> --
> Filippo De Luca
> --------------------------
> Email: dl.filippo@filosganga.it
> Web:   http://www.filosganga.it
> LinkedIn: http://www.linkedin.com/in/filippodeluca
> mobile: +393395822588
>



-- 
Filippo De Luca
--------------------------
Email: dl.filippo@filosganga.it
Web:   http://www.filosganga.it
LinkedIn: http://www.linkedin.com/in/filippodeluca
mobile: +393395822588