使用Jquery向REST API发送POST请求

Question

我正在编写一个函数，将表单中的数据发布到REST API。这是我拥有的内容，但它没有起作用，我无法弄清原因。

<script>
    console.log(document);
    var form = document.getElementById("myform");

    form.onsubmit = function (e) {
      // stop the regular form submission
      e.preventDefault();

      // collect the form data while iterating over the inputs
      var data = {};
      for (var i = 0, ii = form.length; i < ii; ++i) {
        var input = form[i];
        if (input.name) {
          data[input.name] = input.value;
        }
      }

    function addData(){
     $.ajax({
             type: "POST",
             url: "http://example.com",
             data: JSON.stringify(data),
             contentType: "application/json; charset=utf-8",
             crossDomain: true,
             dataType: "json",
             success: function (data, status, jqXHR) {

                 alert(success);
             },

             error: function (jqXHR, status) {
                 // error handler
                 console.log(jqXHR);
                 alert('fail' + status.code);
             }
          });
    }
</script>

有人能指点我正确的方向吗？

- bookthief

---

你遇到了什么错误？ - naveen

我没有遇到任何错误。当我在浏览器中运行页面时，我会点击"检查元素"并查看"网络"下发生了什么 - 然后我点击我的“添加”按钮，希望此操作能够正常执行，但是却没有任何反应！ - bookthief

Answer 1

如下所示的调用

addData(data);

function addData(data){// pass your data in method
     $.ajax({
             type: "POST",
             url: "http://example.com",
             data: JSON.stringify(data),// now data come in this function
             contentType: "application/json; charset=utf-8",
             crossDomain: true,
             dataType: "json",
             success: function (data, status, jqXHR) {

                 alert("success");// write success in " "
             },

             error: function (jqXHR, status) {
                 // error handler
                 console.log(jqXHR);
                 alert('fail' + status.code);
             }
          });
    }

- Rituraj ratan

---

谢谢，但服务器仍未响应？ - bookthief

Answer 2

您没有在form.onsubmit事件中调用addData()函数。

form.onsubmit = function (e) {
  // stop the regular form submission
  e.preventDefault();

  // collect the form data while iterating over the inputs
  var data = {};
  for (var i = 0, ii = form.length; i < ii; ++i) {
    var input = form[i];
    if (input.name) {
      data[input.name] = input.value;
    }
  }
  addData();
}

- Murali Murugesan