Elementals.js

Latest Version: 2.0 RC 3 14 March 2017

Method _.formSerialize

Summary:

Serialize a form Element's contents in a manner suitable for attaching to a URI or during a Ajax 'send' command.

Only form elements that have a name attribute will have their values serialized. Serialized values AND names are escaped using encodeURIComponent.

As of the time of thise writing, any <input type="file"> will throw an error. Support for file uploading may be added in a future version as JavaScript support for that has matured over the past few years.

Calling Convention:
_.formSerialize(form)
Parameters:
form
The form Element you wish to serialize the values contained in its input, select, or textarea. Note that button tags are processed even when they are not the element that was clicked!
Returns:
A string containing ampersand delimited name/value pairs.

Example:

HTML

<form action="login.php" method="post" id="userLogin">
	<fieldset>
		<label for="userLogin_email">E-Mail Address:</label>
		<input type="email" name="email" id="userLogin_email">
		<br>
		<label for="userLogin_password">Password:</label>
		<input type="password" name="password" id="userLogin_pasword">
		<br>
		<button>Login</button>
	</fieldset>
</form>

JavaScript

console.log(_.formSerialize(document.getElementById('userLogin')));

Let's say username is Jimbo and the password is 007. The console would log:

Output:

email=Jimbo&password=007

A live working demo can be found in our demonstration section.