Re: RequiredBorder being applied multiple times in ajax calls
Awesome, that works! I forgot that you can always get the request
from that ThreadLocal. Thanks a ton Gerolf, this doesn't seem too
hacky.
--
Sam Barnum
360 Works
On May 15, 2008, at 10:58 AM, Gerolf Seitz wrote:
On Thu, May 15, 2008 at 6:25 PM, Sam Barnum [EMAIL PROTECTED] wrote:
* Somehow disable the border only for ajax calls
Sam,
I think you can do something like this in RequiredBorder#renderAfter:
AjaxRequestTarget target = AjaxRequestTarget.get();
if (target == null) {
// we're in a normal request
// put logic of the original renderAfter here
}
not sure if that works, but you might wanna give that a try.
cheers,
Gerolf
-
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]
Re: RequiredBorder being applied multiple times in ajax calls
Sorry I can't help you with your question. But may I ask where you get the
PhoneFormatter?
On Wed, May 14, 2008 at 5:58 PM, Sam Barnum [EMAIL PROTECTED] wrote:
Using the tips in this PDF
http://londonwicket.org/content/LondonWicket-FormsWithFlair.pdf
I created the simple RequiredBorder class as follows:
public class RequiredBorder extends MarkupComponentBorder {
public void renderAfter(Component component) {
FormComponent fc = (FormComponent) component;
if (fc.isRequired()) {
super.renderAfter(component);
}
}
}
This basically adds a * after any required fields. It seemed to work
great until I used it with an ajax phone formatter behavior:
new AjaxFormComponentUpdatingBehavior(onchange) {
protected void onUpdate(AjaxRequestTarget target) {
Object oldValue = component.getValue();
String formatted = new PhoneFormatter().format(oldValue);
component.setModelObject(formatted);
target.addComponent(component);
}
}
This caused duplicate * indicators to appear after my phone field when
the phone number changed, one per onchange request. I tried adding a
boolean field to the RequiredBorder so it only gets processed once. This
fixed the phone formatter duplicates, but if the form submits and stays on
the same page, all the * marks disappear from the required fields.
This is definitely some sort of lifecycle problem, but how do you fix it?
On a related note, is it generally a bad idea to mix AJAX and non-ajax
actions? It seems like this is one of many issues I've run into when doing
this.
Thanks,
-Sam Barnum
Re: RequiredBorder being applied multiple times in ajax calls
Sam,
a similar issue happened to the WicketAjaxIndicatorAppender.
take a look at WicketAjaxIndicatorAppender#renderHead to see
how this is solved there.
maybe you can do something similar with your RequiredBorder.
regards,
Gerolf
On Thu, May 15, 2008 at 2:58 AM, Sam Barnum [EMAIL PROTECTED] wrote:
Using the tips in this PDF
http://londonwicket.org/content/LondonWicket-FormsWithFlair.pdf
I created the simple RequiredBorder class as follows:
public class RequiredBorder extends MarkupComponentBorder {
public void renderAfter(Component component) {
FormComponent fc = (FormComponent) component;
if (fc.isRequired()) {
super.renderAfter(component);
}
}
}
This basically adds a * after any required fields. It seemed to work
great until I used it with an ajax phone formatter behavior:
new AjaxFormComponentUpdatingBehavior(onchange) {
protected void onUpdate(AjaxRequestTarget target) {
Object oldValue = component.getValue();
String formatted = new PhoneFormatter().format(oldValue);
component.setModelObject(formatted);
target.addComponent(component);
}
}
This caused duplicate * indicators to appear after my phone field when
the phone number changed, one per onchange request. I tried adding a
boolean field to the RequiredBorder so it only gets processed once. This
fixed the phone formatter duplicates, but if the form submits and stays on
the same page, all the * marks disappear from the required fields.
This is definitely some sort of lifecycle problem, but how do you fix it?
On a related note, is it generally a bad idea to mix AJAX and non-ajax
actions? It seems like this is one of many issues I've run into when doing
this.
Thanks,
-Sam Barnum
Re: RequiredBorder being applied multiple times in ajax calls
Gerolf,
Thanks for the reply. WicketAjaxIndicatorAppender is a behavior, but
my RequiredBorder is a border. It seems like there's got to be an
easy answer to this that doesn't require a javascript hack.
Here's what I think is happening:
* The phone format is rendered on the first pass, and the
RequiredBorder draws an asterisk after the field.
* The AjaxFormComponentUpdatingBehavior fires, to format the phone
number. The phone input (TextField) is added to the ajax request target
* The ajaxReqestTarget replaces the components of the phone input.
However, the HTML generated by the border is not replaced. The phone
input border draws around the phone input, and you end up with two
nested borders around the phone input. Repeating the process nests
the borders further.
Possible solutions:
* Remove / disable the border after it renders the first time. This
solves the ajax issue, but when the entire page is redrawn, the
borders all disappear
* Somehow tell the ajaxRequestTarget to replace the input along with
its component border, not just the input. Not sure how to do this.
* Somehow disable the border only for ajax calls
* Don't use the border, manually add a required indicator next to
every required field in my application. Not looking forward to this
one...
Option #2 sounds the most promising, but I don't know where to begin.
-Sam
On May 14, 2008, at 11:38 PM, Gerolf Seitz wrote:
Sam,
a similar issue happened to the WicketAjaxIndicatorAppender.
take a look at WicketAjaxIndicatorAppender#renderHead to see
how this is solved there.
maybe you can do something similar with your RequiredBorder.
regards,
Gerolf
On Thu, May 15, 2008 at 2:58 AM, Sam Barnum [EMAIL PROTECTED] wrote:
Using the tips in this PDF
http://londonwicket.org/content/LondonWicket-FormsWithFlair.pdf
I created the simple RequiredBorder class as follows:
public class RequiredBorder extends MarkupComponentBorder {
public void renderAfter(Component component) {
FormComponent fc = (FormComponent) component;
if (fc.isRequired()) {
super.renderAfter(component);
}
}
}
This basically adds a * after any required fields. It seemed to
work
great until I used it with an ajax phone formatter behavior:
new AjaxFormComponentUpdatingBehavior(onchange) {
protected void onUpdate(AjaxRequestTarget target) {
Object oldValue = component.getValue();
String formatted = new PhoneFormatter().format
(oldValue);
component.setModelObject(formatted);
target.addComponent(component);
}
}
This caused duplicate * indicators to appear after my phone
field when
the phone number changed, one per onchange request. I tried adding a
boolean field to the RequiredBorder so it only gets processed
once. This
fixed the phone formatter duplicates, but if the form submits and
stays on
the same page, all the * marks disappear from the required fields.
This is definitely some sort of lifecycle problem, but how do you
fix it?
On a related note, is it generally a bad idea to mix AJAX and non-
ajax
actions? It seems like this is one of many issues I've run into
when doing
this.
Thanks,
-Sam Barnum
-
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]
Re: RequiredBorder being applied multiple times in ajax calls
Matthew, we wrote the phone formatter in house. It's way too messy
to share on here. If I were going to rewrite it, I'd use regex to:
* Strip everything except [0-9x#] from the input
* Everthing before the 'x' or '#' is the phone number, everything
after is the extension
* Count the number of digits in the phone number part. Make sure
there are 10, then format it as (###) ###- ext. ###
--
Sam Barnum
360 Works
http://www.360works.com
415.865.0952
On May 14, 2008, at 11:06 PM, Matthew Young wrote:
Sorry I can't help you with your question. But may I ask where you
get the
PhoneFormatter?
On Wed, May 14, 2008 at 5:58 PM, Sam Barnum [EMAIL PROTECTED] wrote:
Using the tips in this PDF
http://londonwicket.org/content/LondonWicket-FormsWithFlair.pdf
I created the simple RequiredBorder class as follows:
public class RequiredBorder extends MarkupComponentBorder {
public void renderAfter(Component component) {
FormComponent fc = (FormComponent) component;
if (fc.isRequired()) {
super.renderAfter(component);
}
}
}
This basically adds a * after any required fields. It seemed to
work
great until I used it with an ajax phone formatter behavior:
new AjaxFormComponentUpdatingBehavior(onchange) {
protected void onUpdate(AjaxRequestTarget target) {
Object oldValue = component.getValue();
String formatted = new PhoneFormatter().format
(oldValue);
component.setModelObject(formatted);
target.addComponent(component);
}
}
This caused duplicate * indicators to appear after my phone
field when
the phone number changed, one per onchange request. I tried adding a
boolean field to the RequiredBorder so it only gets processed
once. This
fixed the phone formatter duplicates, but if the form submits and
stays on
the same page, all the * marks disappear from the required fields.
This is definitely some sort of lifecycle problem, but how do you
fix it?
On a related note, is it generally a bad idea to mix AJAX and non-
ajax
actions? It seems like this is one of many issues I've run into
when doing
this.
Thanks,
-Sam Barnum
Re: RequiredBorder being applied multiple times in ajax calls
On Thu, May 15, 2008 at 6:25 PM, Sam Barnum [EMAIL PROTECTED] wrote:
* Somehow disable the border only for ajax calls
Sam,
I think you can do something like this in RequiredBorder#renderAfter:
AjaxRequestTarget target = AjaxRequestTarget.get();
if (target == null) {
// we're in a normal request
// put logic of the original renderAfter here
}
not sure if that works, but you might wanna give that a try.
cheers,
Gerolf
RequiredBorder being applied multiple times in ajax calls
Using the tips in this PDF
http://londonwicket.org/content/LondonWicket-FormsWithFlair.pdf
I created the simple RequiredBorder class as follows:
public class RequiredBorder extends MarkupComponentBorder {
public void renderAfter(Component component) {
FormComponent fc = (FormComponent) component;
if (fc.isRequired()) {
super.renderAfter(component);
}
}
}
This basically adds a * after any required fields. It seemed to
work great until I used it with an ajax phone formatter behavior:
new AjaxFormComponentUpdatingBehavior(onchange) {
protected void onUpdate(AjaxRequestTarget target) {
Object oldValue = component.getValue();
String formatted = new PhoneFormatter().format(oldValue);
component.setModelObject(formatted);
target.addComponent(component);
}
}
This caused duplicate * indicators to appear after my phone field
when the phone number changed, one per onchange request. I tried
adding a boolean field to the RequiredBorder so it only gets
processed once. This fixed the phone formatter duplicates, but if
the form submits and stays on the same page, all the * marks
disappear from the required fields.
This is definitely some sort of lifecycle problem, but how do you fix
it?
On a related note, is it generally a bad idea to mix AJAX and non-
ajax actions? It seems like this is one of many issues I've run into
when doing this.
Thanks,
-Sam Barnum
