POST to rest api using Jquery

Question

I'm writing a function to post data from a form to a rest api. This is what I have but it's not working and I cant figure out why.

<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>

Can anyone point me in the right direction?

I'm not getting an error. When I run the page in the browser, I click on inspect element and look at whats happening under 'network'- I then click on my "add" button behind which this is supposed to run and nothing happens! — bookthief
– bookthief, Commented Nov 22, 2013 at 11:15

Rituraj ratan · Accepted Answer · 2013-11-22 11:03:42Z

10

calllike below

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);
             }
          });
    }

answered Nov 22, 2013 at 11:03

Rituraj ratan

10.4k8 gold badges38 silver badges55 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

bookthief Over a year ago

Thanks, but there is still no response from server?

Matthew Rankin · Accepted Answer · 2016-02-24 04:41:52Z

2

You are not calling addData() in form.onsubmit event.

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();
}

edited Feb 24, 2016 at 4:41

Matthew Rankin

461k39 gold badges130 silver badges166 bronze badges

answered Nov 22, 2013 at 11:14

Murali Murugesan

22.6k18 gold badges76 silver badges123 bronze badges

Collectives™ on Stack Overflow

POST to rest api using Jquery

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related