CODEWITHSUNDEEP
javascriptjqueryjson
shadoweye14
shadoweye14

Reputation: 813

JSON Parse Error: unexpected end of data at line 1 column 1 of the JSON data

I have a database, analysis.php and index.php webpages. The analysis.php gets the data from the database, sorts it in a required pattern, and then echoes the json_encode($array); into a div with the id 'data'. I am trying to get that JSON Data and parse it in the index.php page.

However I am getting an error. SyntaxError: JSON.parse: unexpected end of data at line 1 column 1 of the JSON data

I am trying to get this data everytime the user selects an option from a select box.

My jQuery code is:

$(document.body).on('change', '.select' , function () {
    var identification = $(this).val();
    var JSONText = $(this).closest('div[id|="module"]').find('p[id="JSON"]');
    JSONText.load('analysis.php?data=' + identification + ' #data');
    console.log("JSON Imported: '" + identification + "'");
    var obj = jQuery.parseJSON(JSONText.text());
    console.log(JSONText.text());
});

EDIT: As you can see I have the snippet console.log(JSON.text());. The output of the JSON that I get is correct. The only issue I think might be is that the quotes are all " instead of the JSON quotes being different from the outer quotes.

Upvotes: 3

Views: 38120

Answers (2)

LJᛃ
LJᛃ

Reputation: 8123

jQuery.load is asynchronous, you're trying to parse the JSON before its actually loaded. Using jQuery.getJSON loads the content, does the parsing and provides a callback you can bind to.

jQuery.load loads the content as HTML and sets the innerHTML of the selected element, you could bind the complete handler here aswell, but you may encounter issues by loading the content as HTML and then using text to retrieve it from the DOM as some parts of your JSON may be interpreted as HTML elements.

Better use this:

$(document.body).on('change', '.select' , function () {
    var identification = $(this).val();
    $.getJSON(
        'analysis.php?data=' + identification + ' #data',
        function (data) {
           console.log(data);
        }
    );
});

Upvotes: 6

Alex
Alex

Reputation: 7833

In addition to LJ_1102's solution, here is a way to fix your current snippet:

JSONText.load('analysis.php?data=' + identification + ' #data', function() {

    console.log("JSON Imported: '" + identification + "'");
    var obj = jQuery.parseJSON(JSONText.text());
    console.log(JSONText.text());

});

Upvotes: 2

Related Questions