如何在Ajax中调用Express route?

时间:2019-04-27 23:28:55

标签: javascript node.js ajax express

提交表单时,我在从Ajax的Node.js应用程序中调用Express路由时遇到问题。

我的路线如下:

role

我的Ajax呼叫看起来像这样:

router.post("/user", function(req, res) {
    console.log("FORM DATA: " + JSON.stringify(req.body));
    res.send('done!');
});

我的app.js $("#add-report-form").submit(function(e) { e.preventDefault(); $.ajax({ type: "POST", uri: "/user", contentType: "application/json", data: JSON.parse(JSON.stringify($("#add-report-form").serializeArray())), }).done(function(data) { alert("ajax call done!"); }); }); 中包含以下内容。

提交表单时,路由中的console.log无法运行,我也不知道为什么,似乎根本没有调用该路由。任何帮助都会很棒!

我的表单如下:

app.use(bodyParser.json());

编辑:

我还尝试在按钮的click事件上执行Ajax,但还是没有运气,警报弹出,但仍然没有调用路由。

<div class="modal-body">
   <form id="add-report-form">
      <div class="row">
        <div class="col">
           <label for="report-select">Report</label>
           <select class="form-control" id="report-select" name="report">
             <option>Select Report</option>
           </select>
        </div>
       </div>

       <div class="row modal-row">
         <div class="col">
           <label for="interval-select">Report Interval</label>
             <select class="form-control" id="interval-select" name="interval">
               <option>Select Interval</option>
             </select>
          </div>

          <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            <button type="submit" id="add-submit" class="btn btn-primary save-changes">Save changes</button>
          </div>
      </form>
   </div>

1 个答案:

答案 0 :(得分:1)

问题可能是拼写错误。尝试使用“ url”而不是“ uri”:

$.ajax({
    type: "POST",
    url: "/user",
    contentType: "application/json",
    // data: JSON.parse(JSON.stringify($("#add-report-form").serializeArray())),
    data: JSON.stringify({data: "test"}),
}).done(function(data) {
    alert("ajax call done!");
});