HTML JS

GET HTML FORM DATA IN JAVASCRIPT

(quick guide & examples)

THE "USUAL" HTML FORM

01

<form id="demo" onsubmit="return doForm()">

  <input type="text" name="name"   required value="Jon">

  <input type="email" name="email"   required value="Jon">

  <input type="submit" value="Go!">

</form>

function doForm() {

JAVASCRIPT GET FORM DATA

02

  FORM DATA   var form = document.getElementById                      ("demo");   var data = new FormData(form);

  SUBMIT FORM   fetch("SERVER-SCRIPT",   { method:"post", body:data })   .then(res => res.text())   .then(txt => console.log(txt));   return false;

}

MORE FORM DATA

03

APPEND, REMOVE, GET, CHECK data.append("key", "value"); data.delete("key"); var name = data.get("name"); var hasEmail = data.has("email");

GET ALL KEYS/VALUES for (let k of data.keys())   { console.log(k); } for (let v of data.values())   { console.log(v); } for (let [k, v] of data.entries())   { console.log(k, v); }