[whatwg] WF2: Non-validating submit buttons

[Thomas Broyer]

2007/3/21, Christian Schmidt:
> Martin Atkins skrev:
> > It would be useful to be able to mark certain submit buttons as
> > non-validating.
> >
> > [...]
> >
> >     <input type="submit" validate="no" />
> >
> > I'm not fussed about the exact name/usage of the attribute, but it seems
> > like a common enough case to warrant a declarative solution rather than
> > a script one.
>
> How would this be achieved using script?
>
>
> One way is to use a button with the following onclick handler:
>
> for (var i = 0; i < form.elements.length; i++) {
>      var element = form.elements[i];
>      if (!element.validity.valid) {
>          element.type = 'text';
>          element.required = false;
>          element.maxLength = -1;
>          element.setCustomValidity(null);
>      }
> }
> form.submit();
>
> Is there a more elegant solution?

Attach a handler for the 'invalid' event on the form to cancel them
all and call setCustomValidity(null) on the event.target? (eventually
using a second form, specific to the non-validating submit buttons so
that you don't have to attach/detach the handler depending on the
clicked button; or maybe you could just, in the 'click' event of the
submit button, attach the 'invalid' event handler, call form.submit()
and then detach the handler?)

<form action="..." id="validating"></form>
<form action="..." id="non-validating"></form>
...
<input type="submit" form="non-validating">
...
<script type="text/javascript">
document.getElementById("non-validating").addEventListener('invalid',
    function(e) {
        e.preventDefault();
        e.stopPropagation();
        e.target.setCustomValidity('');
    }, false);
</script>

— or —
<form action="...">
...
<input type="submit" id="non-validating">
...
<script type="text/javascript">
function cancel_invalid(e) {
    e.preventDefault();
    e.stopPropagation();
    e.target.setCustomValidity('');
}
document.getElementById("non-validating").addEventListener('click',
    function(e) {
        e.form.addEventListener('invalid', cancel_invalid, false);
        e.form.submit();
        e.form.removeEventListener('invalid', cancel_invalid, false);
        e.preventDefault();
    }, false);
</script>


Just ideas, I don't know if this would work at all...

-- 
Thomas Broyer