6

I am using form reset method as below in my web pages

$("#form")[0].reset();

But when I use it like the below

$("#form").reset();

It is giving me error.

Why the first method is working and the later is not?

My page is working perfectly. But I would like the reason behind it. The solution is everywhere. But none of them describing the reason behind it.

Note: I checked here and it shows so much answers. Nothing clearly defines the reason.

Community
  • 1
  • 1
Arun
  • 3,640
  • 7
  • 44
  • 87

3 Answers3

6

The jQuery selector method can return more than one element, so the behaviour is to return an array for consistency's sake. This array is a wrapper for other jQuery methods that can operate on that selection, but manipulating the classic DOM functions requires working on a specific element.

You can do that like you have, with [0] to pull out the first, or you can iterate over them:

$('#form').each(function() { this.reset() });
tadman
  • 208,517
  • 23
  • 234
  • 262
4

Because the reset() method is a member of the HTML form element:

https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/reset

And not a method offered by a jQuery object, which is a collection of 0 or more matching elements for your selector (#form)

daf
  • 1,289
  • 11
  • 16
1

I think the simple reason is it is for forcefully working a javascript function using Jquery

.reset() is not a Jquery native function. It is a Javascript function and we are forcefully using it inside Jquery

Arun
  • 3,640
  • 7
  • 44
  • 87