title: How to get a key/value data set from a HTML form
body: <p>I'm simply looking for a way to <strong>get all the values</strong> from a <code>&lt;form&gt;</code>.</p>
  
  <p>I searched the Web for a while, stumbling across <a href="https://developer.mozilla.org/en/docs/Web/API/FormData"><code>FormData</code></a>, which seems quite what I'm looking for.</p>
  
  <p>However its API is <a href="https://developer.mozilla.org/en/docs/Web/API/FormData#Browser_compatibility">not available</a> on any browser, so I need an alternative.</p>
  
  <hr>
  
  <p>What I need in my specific case is an object of key/value pairs. For example:</p>
  
  <pre><code>&lt;form&gt;
    &lt;input type="text" name="firstname" value="John" /&gt;
    &lt;input type="text" name="surname" value="doe" /&gt;
    &lt;input type="email" name="email" value="" /&gt;
    &lt;input type="radio" name="gender" value="male" /&gt;
    &lt;input type="radio" name="gender" value="female" /&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>The object should be:</p>
  
  <pre><code>{
    firstname: "John",
    surname: "doe",
    email: "",
    gender: ""
  }
  </code></pre>
  
  <p><strong>Edit:</strong> The above is just an example, it should work not only with <code>&lt;input&gt;</code> but also with the other tags (e.g. <code>&lt;select&gt;</code>, <code>&lt;textarea&gt;</code> and so on... even <code>&lt;input type="file"&gt;</code> should be supported). </p>