checkValidity on a div

[Namotco]

I have a large form I break up into divs that I show/hide. I want to
check each section before moving to the next. How can I check
validity (I'm only using required right now) on a particular div
instead of a form object? I tried div.checkValidity(); but that
doesn't work:

var div=document.getElementById('some_div');
var valid=div.checkValidity();

Gives:

Value undefined (result of expression div.checkValidity) is not
object.
https://womenshealth.com/healthhistory/test.html

[Weston Ruter]

What you can do is iterate over all of the form elements in that DIV and call checkValidity() on each of them. For example, using Prototype:

var invalidElements = [];
$('mydiv').select('input,textarea').each(function(el){
    if(!el.checkValidity())
        invalidElements.push(el);
});
if(invalidElements.length){
    alert('Invalid element(s)!');
}

(I haven't tested this code.)

[Namotco]

Thanks for the response. My question now is why can't (or why should
I not be able to) to div.checkValidity()? Why only on a form
element? Would this make sense to change in a future version?

On Feb 25, 7:50 pm, "Weston Ruter" <westonru...@gmail.com> wrote:
> What you can do is iterate over all of the form elements in that DIV and
> call checkValidity() on each of them. For example, using Prototype:
>
> var invalidElements = [];
>
> > $('mydiv').select('input,textarea').each(function(el){
> >     if(!el.checkValidity())
> >         invalidElements.push(el);
> > });
> > if(invalidElements.length){
> >     alert('Invalid element(s)!');
> > }
>
> (I haven't tested this code.)
>

[Weston Ruter]

The reason is that it's not part of the Web Forms 2.0 specification: http://www.whatwg.org/specs/web-forms/current-work/#form.checkvalidity