Come posso serializzare un form con JavaScript?

JavaScript non dispone del metodo .serialize() di jQuery per creare una query string dai valori inseriti in un form. Tuttavia una soluzione esiste.

Si tratta di selezionare gli elementi che ci interessano ed assemblare la query string quando il form viene inviato:

(function() {
	function serialize( form ) {
		var data = [];
		var elements = form.querySelectorAll( "input, select, textarea" );
		for( var i = 0; i < elements.length; ++i ) {
			var element = elements[i];
			var name = element.name;
			var value = element.value;
			var str = name + "=" + value;
			data.push( str );
			
		}

		return data.join( "&" );
	}

	document.addEventListener( "DOMContentLoaded", function() {
		var form = document.getElementById( "test" );
		
		form.addEventListener( "submit", function( e ) {
			e.preventDefault();
			var queryString = serialize( this );

		}, false);

	});

})();

Questa tecnica si rivela fondamentale con AJAX.