Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

164
Views
How do you POST html form data with javascript

Im trying to POST data from a html form using javascript however on submission I believe no data is actually being sent because my alert is showing no data.

when i added an alert box

var jsonStr = JSON.stringify(FD);
      alert(jsonStr);

the output came up as "{}"

here is my full code below if anyone can spot my errora

<form class="emailentry" " method="post" name="myForm" id="myForm">
<label  for ="name">Name: </label><br>
<input type ="text"id="name" name="name: " ><br>
<label for ="emailad">Email: </label><br>
<input type ="email"id="emailad" name="emailad" ><br>
<input type= "submit" id="btn" name="submit" class="submitstyle">
</form>
<script>
    window.addEventListener( "load", function () {
  function sendData() {
    const XHR = new XMLHttpRequest();

    // Bind the FormData object and the form element
    const FD = new FormData( form );

    // Define what happens on successful data submission
    XHR.addEventListener( "load", function(event) {
        var jsonStr = JSON.stringify(FD);
      alert(jsonStr); // should present me the data i entered but it isnt
      alert("hi");
    } );

    // Define what happens in case of error
    XHR.addEventListener( "error", function( event ) {
      alert( 'Oops! Something went wrong.' );
    } );

    // Set up our request
    XHR.open( "POST", "ExampleUrl.ForStackOveerflow/post" );

    // The data sent is what the user provided in the form
    XHR.send( FD );
    

  }

  // Access the form element...
  const form = document.getElementById( "myForm" );

  // ...and take over its submit event.
  form.addEventListener( "submit", function ( event ) {
    event.preventDefault();

    sendData();
  } );
} );




</script>
about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!