Converting native JS Ajax snippet to JQuery alternative?

Question

I am updating historic JS code from another author but having problems converting the below to the JQuery alternative:

var xhr = new XMLHttpRequest();
xhr.open('GET', songurl, true);
xhr.responseType = 'blob';
xhr.onload = function(e) {
if (this.status == 200) {
    document.getElementById('songdiv').innerHTML = '';
    song.src = (window.webkitURL ? webkitURL : URL).createObjectURL(this.response);
}
}
xhr.send();

This is more so to aide consistency, Chrome - developer tools is also suggesting the code to be re-factored.

Here is what I have started with (appreciate it's not much!), the issue I'm having is checking the status code and returning the response if the status code is 200.

$.ajax({
    url: songurl,
    method: 'GET'
);

Donnie D'Amato · Accepted Answer · 2015-11-22 02:38:58Z

2

You want to attach a function for success.

$.ajax({
    url: songurl,
    method: 'GET',
    success: function(response){
        //do stuff with response
    }
})

edited Nov 22, 2015 at 2:38

answered Nov 21, 2015 at 17:48

Donnie D'Amato

3,9701 gold badge20 silver badges42 bronze badges

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

2 Comments

Stone Over a year ago

Thanks for this, was torn between which to accept but accepted the other due to extra commentary.

Donnie D'Amato Over a year ago

I'm surprised you accepted the other one since it uses a different function than what you originally went with.

Paul Roub · Accepted Answer · 2015-11-21 17:52:57Z

1

ajax(), or the shorthand get(), will do all that for you. There's a success() function that's only called on a successfull, 200-status request:

$.get( songurl, 
  function(data) {
    document.getElementById('songdiv').innerHTML = '';
    song.src = (window.webkitURL ? webkitURL : URL).createObjectURL(data);
  },
  'blob'
);

edited Nov 21, 2015 at 17:52

answered Nov 21, 2015 at 17:48

Paul Roub

36.5k27 gold badges88 silver badges95 bronze badges

3 Comments

Paul Roub Over a year ago

@A.Wolff Just being explicit about the unused data parameter. Unnecessary, though... I'll remove it.

A. Wolff Over a year ago

Oh but usually better is to be explicit... :) I was wondering it because i'm not familiar with blob and it could have a specific reason

Stone Over a year ago

Appreciate the response, learnt something new...although sadly JQuery does not support blob by default!

Collectives™ on Stack Overflow

Converting native JS Ajax snippet to JQuery alternative?

2 Answers 2

2 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related