jQuery Form Events, Selectors, Helper Functions, etc.

In general, working with Forms can easily become tedious and boring. But not anymore with jQuery. jQuery forms are relatively simple & easy to work with, provided you know the right events to call and to attach the right event handlers to the correct elements. So in this article, I am going to compile a list of jQuery Form events, Selectors Helper functions, etc. that will serve as handy reference. Read on to review the list.

How to use Form events, Selectors, Helper Functions, etc. in jQuery

Let’s start with Form events.

jQuery Form Events

.blur()
You can trigger this event on an element or bind an event handler to the “blur” JavaScript event.

.change()
You can trigger this event on an element or bind an event handler to the “change” JavaScript event.

.focus()
You can trigger this event on an element or bind an event handler to the “focus” JavaScript event.

.select()
You can trigger this event on an element or bind an event handler to the “select” JavaScript event.

.submit()
You can trigger this event on an element or bind an event handler to the “submit” JavaScript event.

jQuery Form Selectors

:checked
This Selector matches all elements that are checked.

:disabled
This Selector selects all elements that are disabled.

:enabled
This Selector selects all elements that are enabled.

:focus
This Selector selects element if it is currently focused.

:selected
This Selector selects all elements that are selected.

jQuery Helper Functions

jQuery.param()
This creates a serialized representation of an array or object that can be used in an Ajax request or in a URL query string.

.serialize()
This encodes a set of form elements as a string for submission.

.serializeArray()
This encodes a set of form elements as an array of names and values.

jQuery Form Attributes

.attr()
It is used to get the value of an attribute for the first element in the set of matched elements.

.hasClass()
Used to check whether any of the matched elements are assigned the given class.

.html()
Used to get the HTML contents of the first element in the set of matched elements.

.prop()
Used to get the value of a property for the first element in the set of matched elements.

.removeAttr()
Used to remove an attribute from each element in the set of matched elements.

.removeClass()
Used to remove a single class, multiple classes, or all classes from each element in the set of matched elements.

.removeProp()
Used to remove a property for the set of matched elements.

.toggleClass()
Used to add or remove one or more classes from each element in the set of matched elements, depending on either the class’s presence or the value of the switch argument.

.val()
Used to get the current value of the first element in the set of matched elements.

That’s it for now!

Do you know of any other jQuery Form Selectors, Helper Functions, Events, Attributes, etc.? Feel free to share by commenting below.