0

Suppose I am trying to fetch page which throws a 404 not found response yet shows an html page. I want to get html elements of that page using jQuery.

    $.ajax({
    url: 'http://example.com/page/2/',
    type: 'GET',
    success: function(data){ 
        console.log($(data).find('#reviews .card').text());
    },
    error: function(data) {
        console.log($(data).find('.not-found').text());
    }
});

I get this message in console window

GET http://example.com/page/2/ 404 ()

Suppose I wanna grab the title from the page which says "Page does not exist." and the JSON object data returned between the <script> </script> of the html of the page, how should I do it?

dexbyte
  • 65
  • 11
  • I believe you can use fetch, it doesn't reject the promise on 400 class errors – Luca Kiebel Jul 19 '18 at 14:44
  • I dont know how true this is anymore but historically some browsers have consumed 404 pages so you wouldnt be able to see the contents regardless. – Marie Jul 19 '18 at 14:47
  • Assuming you aren't blocked by CORS, you can get the HTML from the `responseText` property of the jqXHR object in the `error` handler: `data.responseText`. Here's a working example: http://jsfiddle.net/RoryMcCrossan/xnfj0asr/. You can then retrieve the `title` from this. Retrieving the JSON will be much harder though, to the point where I'd suggest finding another, much better way. – Rory McCrossan Jul 19 '18 at 14:55
  • @Luca would it return an html page so I can grab an element? – dexbyte Jul 19 '18 at 14:57
  • @RoryMcCrossan Thanks! That worked. Can you suggest me a better way to retrieve the JSON data? – dexbyte Jul 19 '18 at 15:00
  • If it's possible make another AJAX call to retrieve it. Otherwise you'll have to somehow hack the responseText string to retrieve the JS from within the page then probably have to `eval()` it to turn it in to executable logic. Ugly. – Rory McCrossan Jul 19 '18 at 15:01

3 Answers3

0

do you mean this?

jQuery Ajax error handling, show custom exception messages

    success: function(){
       ...
    },
    error: function (xhr, ajaxOptions, thrownError) {
        console.log(xhr); // I believe this returns an object
        console.log(xhr.statusText); //"Not Found" 
        console.log(xhr.status); //404
    },
});
audrynyonata
  • 38
  • 5
0

I too had this problem:

error: function (err) {
    console.log(err); // This will throw the whole error.
    console.log(err.response); // This will throw the object you want to modify
    console.log(error.response.status); // This will throw the status code you want!
},

Hope this works!

HectorTinajero
  • 1
  • 1
  • 1
  • `console.log(err.response);` gives undefined, maybe you mean err.responseText. `console.log(error.response.status)` that didn't work so I tried this `console.log(error.status)` and it worked. – dexbyte Jul 20 '18 at 09:36
0

As stated by @RoryMcCrossan I used responseText and rewrote the code again to something like this. 

$.ajax({
    url: 'http://example.com/page/2/',
    type: 'GET',
    success: function(data){ 
        var html = $(data);
        console.log(html.find('#reviews .card').text());
    },
    error: function(data) {
        var html = $(data.responseText)
        console.log(html.find('.not-found').text());
    }
});
dexbyte
  • 65
  • 11