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
