Question

I’m really new to JavaScript and jQuery. My question is this.

I have two forms with id id1 and id2 in my Doc. The forms have a validate method (from jQuery validate module).

When I do:

$(#id1).validate()

…it works. But when I do:

$('form[id^="id"]')[0].validate()

…it says TypeError: Object #<HTMLFormElement> has no method 'validate'. This looks strange to me because I’m invoking validate on the same object.

Answer 1

They’re different objects because in the second example you’re extracting the DOM element at index 0…

 //  v------returns jQuery object
$('#id1').validate()

 //     v------returns jQuery object
$('form[id^="id"]')[0].validate()
 //                 ^----------extracts the DOM element

The correct equivalent would be…

$('form[id^="id"]').validate()

…or if you only wanted the first element…

$('form[id^="id"]').eq(0).validate()