Re: Disabling onBlur field validation
Ok, I created a JIRA improvement request for this - TAP5-538 -
http://issues.apache.org/jira/browse/TAP5-538
-Scott
On Thu, 26 Feb 2009 02:52:25 Peter Stavrinides wrote:
Thanks for this Russell, saves me some work! any Jira open for this?
- Original Message -
From: Scott Russell scott...@gmail.com
To: Tapestry users users@tapestry.apache.org
Sent: Tuesday, 24 February, 2009 12:33:49 GMT +02:00 Athens, Beirut,
Bucharest, Istanbul
Subject: Re: Disabling onBlur field validation
I have implemented a band-aid fix for this problem. Thus far it's a little
raw, and could do with some tidying up. It doesn't do anything clever - just
override the existing functionality where possible while trying to keep all
the rest relatively intact. It disables the validation on focus changes, but
leaves the validation on form submit. The only thing it doesn't do as yet is
remove the validation markers (ie. the red label and the x icon), if the user
inputs correct data into validatable fields after a failed form submit.
Just create a javascript file with the following contents, and include it
with any page you want to turn validation off (eg. attach it to a common base
page class to include it on all pages).
AbstractBasePage.java
@IncludeJavaScriptLibrary(validation-fix.js)
public abstract class AbstractBasePage {
validation-fix.js
Tapestry.FieldEventManager.addMethods({
initialize : function(field)
{
this.field = $(field);
var id = this.field.id;
this.label = $(id + ':label');
this.icon = $(id + ':icon');
document.observe(Tapestry.FOCUS_CHANGE_EVENT, function(event)
{
// If changing focus *within the same form* then
// perform validation. Note that Tapestry.currentFocusField does
not change
// until after the FOCUS_CHANGE_EVENT notification.
if (Tapestry.currentFocusField == this.field
this.field.form == event.memo.form)
;//this.validateInput(); // NB: disable validation on field
focus change
}.bindAsEventListener(this));
}
});
Tapestry.ErrorPopup.addMethods({
initialize : function(field)
{
this.field = $(field);
this.innerSpan = new Element(span);
this.outerDiv = $(new Element(div, {
'id' : this.field.id + :errorpopup,
'class' : 't-error-popup' })).update(this.innerSpan).hide();
var body = $$('BODY').first();
body.insert({ bottom: this.outerDiv });
this.outerDiv.absolutize();
this.outerDiv.observe(click, function(event)
{
this.ignoreNextFocus = true;
this.stopAnimation();
this.outerDiv.hide();
this.field.activate();
Event.stop(event); // Should be domevent.stop(), but that fails
under IE
}.bindAsEventListener(this));
this.queue = { position: 'end', scope: this.field.id };
Event.observe(window, resize, this.repositionBubble.bind(this));
document.observe(Tapestry.FOCUS_CHANGE_EVENT, function(event)
{
if (this.ignoreNextFocus)
{
this.ignoreNextFocus = false;
return;
}
if (event.memo == this.field)
{
//this.fadeIn(); // NB: prevent existing validations
reappearing on field focus change
return;
}
// If this field is not the focus field after a focus change,
then it's bubble,
// if visible, should fade out. This covers tabbing from one form
to another.
this.fadeOut();
}.bind(this));
}
});
Hope this helps.
cheers,
Scott
On Mon, 23 Feb 2009 23:37:54 Borut Bolčina wrote:
+1 for turning off the onBlur validation
We have done some UI testing on users trying to use a registration wizard
which collects some mandatory data on step 1 and have found it unacceptable
that validation bubbles are popping up whenever users jump between fields.
Do I have to ditch custom side validation altogether or is there a
workaround? I would like the custom side validation only happens when the
user submits the form(fragment).
Cheers,
Borut
-
To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org
For additional commands, e-mail: users-h...@tapestry.apache.org
-
To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org
For additional commands, e-mail: users-h...@tapestry.apache.org
-
To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org
For additional commands, e-mail: users-h
Re: Disabling onBlur field validation
Thanks for this Russell, saves me some work! any Jira open for this?
- Original Message -
From: Scott Russell scott...@gmail.com
To: Tapestry users users@tapestry.apache.org
Sent: Tuesday, 24 February, 2009 12:33:49 GMT +02:00 Athens, Beirut, Bucharest,
Istanbul
Subject: Re: Disabling onBlur field validation
I have implemented a band-aid fix for this problem. Thus far it's a little raw,
and could do with some tidying up. It doesn't do anything clever - just
override the existing functionality where possible while trying to keep all the
rest relatively intact. It disables the validation on focus changes, but leaves
the validation on form submit. The only thing it doesn't do as yet is remove
the validation markers (ie. the red label and the x icon), if the user inputs
correct data into validatable fields after a failed form submit.
Just create a javascript file with the following contents, and include it with
any page you want to turn validation off (eg. attach it to a common base page
class to include it on all pages).
AbstractBasePage.java
@IncludeJavaScriptLibrary(validation-fix.js)
public abstract class AbstractBasePage {
validation-fix.js
Tapestry.FieldEventManager.addMethods({
initialize : function(field)
{
this.field = $(field);
var id = this.field.id;
this.label = $(id + ':label');
this.icon = $(id + ':icon');
document.observe(Tapestry.FOCUS_CHANGE_EVENT, function(event)
{
// If changing focus *within the same form* then
// perform validation. Note that Tapestry.currentFocusField does
not change
// until after the FOCUS_CHANGE_EVENT notification.
if (Tapestry.currentFocusField == this.field
this.field.form == event.memo.form)
;//this.validateInput(); // NB: disable validation on field
focus change
}.bindAsEventListener(this));
}
});
Tapestry.ErrorPopup.addMethods({
initialize : function(field)
{
this.field = $(field);
this.innerSpan = new Element(span);
this.outerDiv = $(new Element(div, {
'id' : this.field.id + :errorpopup,
'class' : 't-error-popup' })).update(this.innerSpan).hide();
var body = $$('BODY').first();
body.insert({ bottom: this.outerDiv });
this.outerDiv.absolutize();
this.outerDiv.observe(click, function(event)
{
this.ignoreNextFocus = true;
this.stopAnimation();
this.outerDiv.hide();
this.field.activate();
Event.stop(event); // Should be domevent.stop(), but that fails
under IE
}.bindAsEventListener(this));
this.queue = { position: 'end', scope: this.field.id };
Event.observe(window, resize, this.repositionBubble.bind(this));
document.observe(Tapestry.FOCUS_CHANGE_EVENT, function(event)
{
if (this.ignoreNextFocus)
{
this.ignoreNextFocus = false;
return;
}
if (event.memo == this.field)
{
//this.fadeIn(); // NB: prevent existing validations
reappearing on field focus change
return;
}
// If this field is not the focus field after a focus change, then
it's bubble,
// if visible, should fade out. This covers tabbing from one form
to another.
this.fadeOut();
}.bind(this));
}
});
Hope this helps.
cheers,
Scott
On Mon, 23 Feb 2009 23:37:54 Borut Bolčina wrote:
+1 for turning off the onBlur validation
We have done some UI testing on users trying to use a registration wizard
which collects some mandatory data on step 1 and have found it unacceptable
that validation bubbles are popping up whenever users jump between fields.
Do I have to ditch custom side validation altogether or is there a
workaround? I would like the custom side validation only happens when the
user submits the form(fragment).
Cheers,
Borut
-
To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org
For additional commands, e-mail: users-h...@tapestry.apache.org
-
To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org
For additional commands, e-mail: users-h...@tapestry.apache.org
Re: Disabling onBlur field validation
I have implemented a band-aid fix for this problem. Thus far it's a little raw,
and could do with some tidying up. It doesn't do anything clever - just
override the existing functionality where possible while trying to keep all the
rest relatively intact. It disables the validation on focus changes, but leaves
the validation on form submit. The only thing it doesn't do as yet is remove
the validation markers (ie. the red label and the x icon), if the user inputs
correct data into validatable fields after a failed form submit.
Just create a javascript file with the following contents, and include it with
any page you want to turn validation off (eg. attach it to a common base page
class to include it on all pages).
AbstractBasePage.java
@IncludeJavaScriptLibrary(validation-fix.js)
public abstract class AbstractBasePage {
validation-fix.js
Tapestry.FieldEventManager.addMethods({
initialize : function(field)
{
this.field = $(field);
var id = this.field.id;
this.label = $(id + ':label');
this.icon = $(id + ':icon');
document.observe(Tapestry.FOCUS_CHANGE_EVENT, function(event)
{
// If changing focus *within the same form* then
// perform validation. Note that Tapestry.currentFocusField does
not change
// until after the FOCUS_CHANGE_EVENT notification.
if (Tapestry.currentFocusField == this.field
this.field.form == event.memo.form)
;//this.validateInput(); // NB: disable validation on field
focus change
}.bindAsEventListener(this));
}
});
Tapestry.ErrorPopup.addMethods({
initialize : function(field)
{
this.field = $(field);
this.innerSpan = new Element(span);
this.outerDiv = $(new Element(div, {
'id' : this.field.id + :errorpopup,
'class' : 't-error-popup' })).update(this.innerSpan).hide();
var body = $$('BODY').first();
body.insert({ bottom: this.outerDiv });
this.outerDiv.absolutize();
this.outerDiv.observe(click, function(event)
{
this.ignoreNextFocus = true;
this.stopAnimation();
this.outerDiv.hide();
this.field.activate();
Event.stop(event); // Should be domevent.stop(), but that fails
under IE
}.bindAsEventListener(this));
this.queue = { position: 'end', scope: this.field.id };
Event.observe(window, resize, this.repositionBubble.bind(this));
document.observe(Tapestry.FOCUS_CHANGE_EVENT, function(event)
{
if (this.ignoreNextFocus)
{
this.ignoreNextFocus = false;
return;
}
if (event.memo == this.field)
{
//this.fadeIn(); // NB: prevent existing validations
reappearing on field focus change
return;
}
// If this field is not the focus field after a focus change, then
it's bubble,
// if visible, should fade out. This covers tabbing from one form
to another.
this.fadeOut();
}.bind(this));
}
});
Hope this helps.
cheers,
Scott
On Mon, 23 Feb 2009 23:37:54 Borut Bolčina wrote:
+1 for turning off the onBlur validation
We have done some UI testing on users trying to use a registration wizard
which collects some mandatory data on step 1 and have found it unacceptable
that validation bubbles are popping up whenever users jump between fields.
Do I have to ditch custom side validation altogether or is there a
workaround? I would like the custom side validation only happens when the
user submits the form(fragment).
Cheers,
Borut
-
To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org
For additional commands, e-mail: users-h...@tapestry.apache.org
Re: Disabling onBlur field validation
2009/1/22 scott russell scottam...@hotmail.com Hi all, I have just started with Tapestry 5 (having previously used versions 3 and 4), and have found that while I like the new client-side validation bubbles, they are very distracting and annoying when they appear for every focus change between form fields. So my question is - does anyone know a way to turn them off for onBlur events only, but retain them for form submit events? It's quite unlikely customers will tolerate these error messages appearing every time they click between fields, but I would prefer to not turn off client-side validation completely, which looks like the only alternative at the moment. cheers, Scott Russell +1 for turning off the onBlur validation We have done some UI testing on users trying to use a registration wizard which collects some mandatory data on step 1 and have found it unacceptable that validation bubbles are popping up whenever users jump between fields. Do I have to ditch custom side validation altogether or is there a workaround? I would like the custom side validation only happens when the user submits the form(fragment). Cheers, Borut
Re: Disabling onBlur field validation
Hi Russell
Exactly, its a bit intrusive... one option (although not ideal in some cases)
is to use your own validate handler:
//My custom validator
void onValidateFromMyFormField(String value) throws ValidationException {
if (value == null)
throw new ValidationException(Please provide a value for X.);
}
Which gets invoked on just before the submit, instead of blur. If you have the
energy create some component wrappers / mixins to handle Validation, (and share
please)... someday I plan to get around to that.
Cheers,
Peter
- Original Message -
From: scott russell scottam...@hotmail.com
To: users@tapestry.apache.org
Sent: Thursday, 22 January, 2009 02:44:21 GMT +02:00 Athens, Beirut, Bucharest,
Istanbul
Subject: Disabling onBlur field validation
Hi all,
I have just started with Tapestry 5 (having previously used versions 3 and 4),
and have found that while I like the new client-side validation bubbles, they
are very distracting and annoying when they appear for every focus change
between form fields.
So my question is - does anyone know a way to turn them off for onBlur events
only, but retain them for form submit events? It's quite unlikely customers
will tolerate these error messages appearing every time they click between
fields, but I would prefer to not turn off client-side validation completely,
which looks like the only alternative at the moment.
cheers,
Scott Russell
_
Messenger's gift to you! Download free emoticons today!
http://livelife.ninemsn.com.au/article.aspx?id=669758
-
To unsubscribe, e-mail: users-unsubscr...@tapestry.apache.org
For additional commands, e-mail: users-h...@tapestry.apache.org
