Tengo este formulario html:

 <form id="LoginForm" class="login-form"> <p> <label for="username">Gebruiker:</label><br /> <input type="text" name="username" autofocus /> </p> <p> <label for="password">Wachtwoord:</label><br /> <input type="password" name="password" /> </p> <p class="submit-wrapper"> <input type="submit" value="Verstuur" id="SubmitLogin" class="submit" /> </p> </form>

Y quiero enviar el acceso a los datos con FormData-api de esta manera:

 const submitLogin = document.querySelector("#SubmitLogin"); submitLogin.addEventListener("click", function (event) { event.preventDefault(); const form = document.querySelector("#LoginForm"); const data = new FormData(form); });

Entonces me sale este error en la consola:

 Uncaught DOMException: Failed to execute 'querySelector' on 'Document': '[object FormData]' is not a valid selector. at HTMLInputElement.<anonymous>

He estado buscando en Google y stackoverflowing durante un tiempo hoy. Todas las soluciones que encuentro involucran números o signos ilegales en la identificación. Pero el ID de formulario (LoginForm) no contiene ninguno de estos. Así que ahora estoy perdido y agradecería cualquier ayuda.