Senden von Formulardaten an Serverseite (Nodejs) nicht möglich mit Ajax

Question

Ich versuche, Formulardaten über Ajax an einen Nodejs-Server zu senden. Zuvor gefragt zu diesem post.

Hier ist, was mein Code wie folgt aussieht:

<div id="inputid" style="width: 400px; height:400px"> 
    <p> Please enter a value between -90 and 90 for lat, and -180 and 180 before hitting 
     submit.</p> 
    <form id="sendCoordinates" action="http://localhost:8080/geodata" method="post"> 
    MinLat: <input type="text" name="MinLat" value="15" id="minlat"><br> 
    MaxLat: <input type="text" name="MaxLat" value="25" id="maxlat"><br> 
    MinLong: <input type="text" name="MinLong" value="-10" id="minlong"><br> 
    MinLong: <input type="text" name="MaxLong" value="120" id="maxlong"><br> 
    <input type="submit" value="submit" id="s1"> 
    </form> 

<script> 
$(document).ready(function() { 
    console.log("hi hi"); 
    $("#sendCoordinates") 
     .on('submit', function(e) { 
      e.preventDefault(); 
      var $form = $(e.target), 
       formData = new FormData(), 
       params = $form.serializeArray(); 

      $.each(params, function(i, val) { 
       // console.log(val); 
       formData.append(val.name, val.value); 
      }); 

      $.ajax({ 
       url: $form.attr('action'), 
       data: formData, 
       cache: false, 
       contentType: false, 
       processData: false, 
       type: 'POST', 
       success: function(result) { 
        console.log("hi helo"); 
       } 
      }); 
     }); 
}); 
</script> 

</div> 

Mein Server-Side-Code wie folgt aussieht:

var express = require("express"); 
var path = require("path"); 
var bodyParser = require("body-parser"); 

var app = express(); 
app.use(express.static(__dirname + "/public")); 
app.use(bodyParser.json()); 

// Initialize the app. 
var server = app.listen(process.env.PORT || 8080, function() { 
    var port = server.address().port; 
    console.log("App now running on port", port); 
    }); 

// for debugging purposes, just logging the request to check 
// if request received 

app.post("/geodata", function(req, res) { 
    console.log("hey"); 
    console.log(req.body); 
    res.send("hi back!"); 
}); 

ich dies versucht, aber ich bin nicht in der Lage das Formular erfolgreich zu senden, und auf Wenn ich "submit" drücke, bekomme ich "hey" und eine leere {} als geloggte Ausgabe. Ich bin nicht in der Lage, die formData auf der Clientseite unabhängig zu protokollieren.

Kann jemand darauf hinweisen, was ich falsch machen könnte?

Answer 1

Sie haben formformData() nicht zugeordnet, deshalb senden Sie keine Daten an den Server.

var myForm = $('#sendCoordinates')[0]; 
var formData = new FormData(myForm);