CODEWITHSUNDEEP
ajaxjsonjquery
USK
USK

Reputation: 123

How do I know if a JSON string has loaded?

Forgive me, I am a complete JSON newbie here. I'm trying to load a file of json information from an external file, and I'm not sure how I can tell if the information has loaded or not. Here's what I have so far: 

$(document).ready(function(){
    $.ajax({
        dataType: 'json',
        success: function(string) {
            data = $.parseJSON(string);
            console.log(data);
            alert(data);
            document.write(data);
        },
        url: 'http://www.site.com/mystuff.php'
    });  
});

I've tried putting all kinds of stuff to see if the info has loaded, as you can see, and nothing has. How do I know if I've even gotten anything? I would really appreciate any help!

Upvotes: 1

Views: 2151

Answers (2)

Daff
Daff

Reputation: 44215

As already pointed out, two things:

  • You don't need to parse the string when setting the datatype as JSON
  • Check if the request returned successfully at all

Which could look like this:

$(document).ready(function(){
    $.ajax({
        dataType: 'json',
        success: function(json) {
            console.log(data);
        },
        error : function(xhr, text) {
            console.log('An error occurred', xhr, text);
        },
        url: 'http://www.site.com/mystuff.php'
    });  
});

When setting the datatype to JSON you also have to make sure that mystuff.php sets the Content-Type header to application/json:

<?php
    header('Content-Type: application/json');
?>

Upvotes: 1

Sushanth --
Sushanth --

Reputation: 55750

No need to parse to json again.. you can directly use the object Also add the error Function to keep a check if you are getting any error..

$(document).ready(function(){
    $.ajax({
        dataType: 'json',
        beforeSend : function() {
           console.log('Before Ajax Request Starts !!');
        },
        success: function(data) {
            console.log(data);
            alert(data);
            document.write(data);
        },
        error : function(jqXHR, textStatus, errorThrown) {
             alert("Error occurred: " + errorThrown);
        },
         beforeSend : function() {
           console.log('Ajax Request Complete  !!');
        },
        url: 'http://www.site.com/mystuff.php'
    });  
});

This makes sure you have feedback at every step..

Upvotes: 0

Related Questions