1

无法读取由 jQuery 在 node.js 中传入的表单数据

ejs中的jQuery代码：

  var data1 = $('#form-horizontal1').serialize();
    $.ajax({
      url: "/users/home/dashboard",
      data: data1,
      dataType:'json',
      ContentType:'application/json',
      type: 'POST',
      success: function (result) {
          console.log(result);
          if(result.status == 200){
            console.log(result);
              //self.isEditMode(!self.isEditMode());
          }
      },
      error: function(result){
          console.log(result);
      }
  });

我在 ejs 中的表单：

 <!-- Modal -->
<div class="modal fade" id="myModal" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Enter Pincode</h4>
      </div>
      <div class="modal-body" id="result">
        <p>Please request for the pincode from the customer.</p>
        <form class="form-horizontal" id="form-horizontal1" action="/users/home/dashboard" role="form">
          <div class="form-group">
            <label  class="col-sm-2 control-label">Pincode:</label>
            <div class="col-sm-10">
                <input type="number" class="form-control" 
                name="pinCode" placeholder="Pincode from customer"/>
            </div>
          </div>
          <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
              <button type="submit" class="btn btn-default">Confirm</button>
            </div>
          </div>
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>

节点.js

router.post('/home/dashboard',function(req,res,next){
  if(req.method === 'POST' && req.session.userId != null){
    var pinCode= req.body.data;
    pinCode = pinCode.slice(8);
    TransactionDetails.findOne({
      where: {
          //transaction_pincode:randomNumber,
          transaction_pincode:pinCode,
          transaction_verified:0
      }

req.body返回空。

我正在尝试将表单中的数据用户输入传递给 jquery，以在 node.js 中执行 POST 并将成功消息返回给 jquery。

但是，当我运行代码时，req.body在 node.js 中返回空对象。请问我该如何解决？

4

1 回答 1

1

由于您正在使用serialize()您实际上只是在表单上传递一个 URL 编码的字符串pinCode=value（&如果您有多个输入，则用分隔符分隔）。

您必须确保将某些内容传递给可以解析为 JSON 的 express 端点。您可以使用serializeArray()which 创建一个{ name:pinCode, value:value }字典并从中构建一个可解析的 JSON 字符串：

var serialized = $('#form-horizontal1').serializeArray();
var params = {};
for (var param in serialized) {
   params[serialized[param].name] = serialized[param].value
}
params = JSON.stringify(params);

现在您在表单上有一个字符串

'{ "pincode": "value" }'

发送为

$.ajax({
  url: "/users/home/dashboard",
  data: params,
  contentType: 'application/json',
  type: 'POST',
  ...
})

如果其他一切都是正确的（我们必须假设它是正确的），您现在将能够访问

var pinCode = req.body.pinCode; //not 'data'

在您的端点函数中

显然，上述内容是自动化表单元素-> 有效 JSON 的通用答案。如果您没有复杂的表格，您可以使用

$.ajax({
  url: "/users/home/dashboard",
  data: JSON.stringify({ pinCode: $('input[name=pinCode]').val() } ),
  contentType: 'application/json',
  type: 'POST',
  ...
})
于 2018-06-02T12:17:39.570 回答