JQuery Ajax 使用表单数据提交表单 returns 什么都没有提交

Question

下面的例子下面returns没什么。如果我遗漏了什么，你能澄清一下吗？

Javascript:

$('#add-modal').submit(function(e) {        
  e.preventDefault();
  var formData = new FormData( document.getElementById("add-modal"));
  $.ajax({
    type: "POST",
    url: "/add-form",
    data: formData,
    processData: false,
    contentType: false,
    success: function (data) { console.log("SUCCESS : ", data); },
    error: function (e) {console.log("ERROR : ", e); }
  });
});

HTML（提交表格）：

<form id="add-modal" method="POST" enctype="multipart/form-data">
    <div class="modal-body">                    
        <div class="form-group">
            <label>Name</label>
            <input type="text" class="form-control"  name="name" required>
        </div>
        <div class="form-group">
        <label>Classes</label>
         <select class="form-control" name="classes">
         <option value="Direct">Direct</option>
         <option value="Merketing">Merketing</option>
         <option value="Partnets">Partnets</option>
         </select>
        </div>  
        <div class="form-group">
        <label>File</label>
         <input type="file"  class="form-control" name="file">
        </div>                  
    </div>
    <div class="modal-footer">
        <input type="submit" class="btn btn-success" value="Add">
    </div>
</form>

服务器端（节点js）：

app.post('/add-form', function(req, res, next){
    
    console.log(req.body);
    
});

谨致问候，叶夫根

Answer 1

表单正在使用 express 处理后端。该表单是多部分的，正在处理文件上传。

需要多部分处理器来解析表单数据。 @ChrisG 的评论建议使用 multer。预期 bodyParser 正在执行此解析。根据 multer 文档将其替换为需要在 express 应用程序中导入的 multer

const express = require('express')
const multer  = require('multer')
const upload = multer({ dest: 'uploads/' })

app.post('/add-form', function(req, res, next){  
  console.log(req.body);   
});

JQuery Ajax 使用表单数据提交表单 returns 什么都没有提交

JQuery Ajax Form Submit with Form Data returns nothing on submit

javascript

forms

ajax

jquery