Sumeet Kumar Yadav
Sumeet Kumar Yadav

Reputation: 12985

Ajax success callback not getting called on 200 network response

I have a simple HTML page which loads jquery 3.3.1 and external script file script.js. I am running a simple node http-server which serves the static page. data.json in also in at same folder of HTML file. But when below ajax call is done, I can see request is successful in network call but, success call back of ajax call is never getting called. why?enter image description here

$( document ).ready(function() { 

    // Get data from json file        
   $.ajax({
    url: 'data.json',
    dataType: 'json',
    success: function (data) {
        console.log(data);        
    },
   error: function (xhr) { 
    alert('Error: ' + xhr.statusText); 
   }
});
    
    
    
    
});
    <html>
<head>
    <title>BW Chart</title>
    <script src="jquery-3.3.1.min.js"></script>
    <script src="script.js"></script>
</head>

<body>
    
</body>
</html>

I can see it's calling error function but why even on status 200 its calling error function

enter image description here

data.json

[{name:"Object 1",
  hot:12,
  warm:5,
  cold:56,
  pHot:85,
  pWarm:52,
  pCold:25
 },{name:"Object 2",
  hot:14,
  warm:55,
  cold:23,
  pHot:89,
  pWarm:14,
  pCold:56
 },{name:"Object 3",
  hot:56,
  warm:45,
  cold:26,
  pHot:85,
  pWarm:41,
  pCold:36
 },{name:"Object 4",
  hot:15,
  warm:56,
  cold:47,
  pHot:25,
  pWarm:28,
  pCold:19
 },{name:"Object 5",
  hot:18,
  warm:52,
  cold:12,
  pHot:46,
  pWarm:52,
  pCold:73
 }]

Upvotes: 2

Views: 2746

Answers (1)

Alex Jones
Alex Jones

Reputation: 808

Your script.js looks fine, no errors there. But your success method, of jQuery Ajax call, will fail to execute if browser fails to parse JSON. Make sure your data.json is a valid JSON and does not contain any syntax errors...
For example in JSON file, all property names should be double quoted.

Upvotes: 4

Related Questions