Files
30-seconds-of-code/snippets/serializeForm.md
Isabelle Viktoria Maciohsek 5cb69e3c5c Update snippet descriptions
2020-10-22 20:24:30 +03:00

711 B

title, tags
title tags
serializeForm browser,string,intermediate

Encodes a set of form elements as a query string.

  • Use the FormData constructor to convert the HTML form to FormData.
  • Use Array.from() to convert to an array, passing a map function as the second argument.
  • Use Array.prototype.map() and encodeURIComponent() to encode each field's value.
  • Use Array.prototype.join() with appropriate arguments to produce an appropriate query string.
const serializeForm = form =>
  Array.from(new FormData(form), field =>
    field.map(encodeURIComponent).join('=')
  ).join('&');
serializeForm(document.querySelector('#form'));
// email=test%40email.com&name=Test%20Name