JavaScript Post and wait for Response JSON

Question

Right now i have the following code below, this code posts some data to my page and waits for a response of status = SUCCESS or Failure. I am trying to understand if this is async or sync. How can I make this JavaScript query wait for the response and then run what is inside success? It doesn't seem to wait for the response of what it is posting to.

Thanks!

my.submit = function() {
   var form = $('#lines');
   console.log(form)
   var data = form.serialize();
   console.log(data)

   $.post('', form.serialize(), function(json) {
         console.log(json)
         if(json.status === 'SUCCESS') {
               console.log('success');
               window.open(json.imgid, '_self');
        } else {
              console.log('failure');


        }
  }, 'json');

  $('#progress_bar').show();
}

I then tried to work on making it work the way i wanted by editing the code below but now its just returning the HTML contents of the entire page rather than the JSON response. Any idea why its not getting the JSON response?

 my.submit = function() {
   var form = $('#lines');
   console.log(form)
   var data = form.serialize();
   console.log(data)

     $.ajax({
       url: '',
       type: 'POST',
       data: data,
       success: function(json) {
        console.log(json)
        if (json.status === 'SUCCESS') {
         console.log('Success!');
        } else {
         console.log('An error occurred.');
         console.log(data);
        }
       }
      }, 'json');


    $('#progress_bar').show();
}

https://stackoverflow.com/questions/8517071/send-json-data-via-post-ajax-and-receive-json-response-from-controller-mvc — gkrthk, Nov 29 '19 at 07:05

score 1 · Accepted Answer · answered Nov 29 '19 at 07:15

Add dataType: 'json', below data: data,

my.submit = function() {
    var form = $('#lines');
    //console.log(form)
    var data = form.serialize();
    //console.log(data)

    $.ajax({
        async: false,
        url: '',
        type: 'POST',
        data: data,
        dataType: 'json',
        success: function(json) {
          console.log(json)
          if (json.status === 'SUCCESS') {
            console.log('Success!');
        window.open(json.imgid, '_self');
          } else {
            console.log('An error occurred.');
            console.log(data);
          }
        }
     }, 'json');


    $('#progress_bar').show();
}

JavaScript Post and wait for Response JSON

1 Answers1