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?
$( 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
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
}]
javascript jquery html
asked Nov 24 '18 at 10:46
SumeetSumeet
4,63022546
|
show 2 more comments
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?
$( 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
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
}]
javascript jquery html
asked Nov 24 '18 at 10:46
SumeetSumeet
4,63022546
1
Add an error call back as well to make sure there are no errors
– LearningPhase
Nov 24 '18 at 10:50
2
Check browser console for any errors
– LearningPhase
Nov 24 '18 at 10:51
If you're using Chrome, try to pressCtrl+Shift+Delto clearCaches images and files. Then, refresing the page and try again. Chrome loves to troll dev like that 😂😂 Also, your configuration missed atype: 'GET'property.
– Foo
Nov 24 '18 at 10:54
please paste yourdata.json. yourscript.jsis correct.
– Edward Torvalds
Nov 24 '18 at 10:56
1
Your JSON is not valid, You can fix it
– Tico
Nov 24 '18 at 11:03
|
show 2 more comments
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?
$( 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
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
}]
javascript jquery html
asked Nov 24 '18 at 10:46
SumeetSumeet
4,63022546
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?
$( 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
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
}]
$( 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>$( 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>javascript jquery html
javascript jquery html
asked Nov 24 '18 at 10:46
SumeetSumeet
4,63022546
asked Nov 24 '18 at 10:46
SumeetSumeet
4,63022546
edited Nov 24 '18 at 10:59
Sumeet
asked Nov 24 '18 at 10:46
SumeetSumeet
4,63022546
asked Nov 24 '18 at 10:46
SumeetSumeet
4,63022546
asked Nov 24 '18 at 10:46
SumeetSumeet
4,63022546
4,63022546
1
Add an error call back as well to make sure there are no errors
– LearningPhase
Nov 24 '18 at 10:50
2
Check browser console for any errors
– LearningPhase
Nov 24 '18 at 10:51
If you're using Chrome, try to pressCtrl+Shift+Delto clearCaches images and files. Then, refresing the page and try again. Chrome loves to troll dev like that 😂😂 Also, your configuration missed atype: 'GET'property.
– Foo
Nov 24 '18 at 10:54
please paste yourdata.json. yourscript.jsis correct.
– Edward Torvalds
Nov 24 '18 at 10:56
1
Your JSON is not valid, You can fix it
– Tico
Nov 24 '18 at 11:03
|
show 2 more comments
1
Add an error call back as well to make sure there are no errors
– LearningPhase
Nov 24 '18 at 10:50
2
Check browser console for any errors
– LearningPhase
Nov 24 '18 at 10:51
If you're using Chrome, try to pressCtrl+Shift+Delto clearCaches images and files. Then, refresing the page and try again. Chrome loves to troll dev like that 😂😂 Also, your configuration missed atype: 'GET'property.
– Foo
Nov 24 '18 at 10:54
please paste yourdata.json. yourscript.jsis correct.
– Edward Torvalds
Nov 24 '18 at 10:56
1
Your JSON is not valid, You can fix it
– Tico
Nov 24 '18 at 11:03
1
1
Add an error call back as well to make sure there are no errors
– LearningPhase
Nov 24 '18 at 10:50
Add an error call back as well to make sure there are no errors
– LearningPhase
Nov 24 '18 at 10:50
2
2
Check browser console for any errors
– LearningPhase
Nov 24 '18 at 10:51
Check browser console for any errors
– LearningPhase
Nov 24 '18 at 10:51
If you're using Chrome, try to press
Ctrl + Shift + Del to clear Caches images and files. Then, refresing the page and try again. Chrome loves to troll dev like that 😂😂 Also, your configuration missed a type: 'GET' property.– Foo
Nov 24 '18 at 10:54
If you're using Chrome, try to press
Ctrl + Shift + Del to clear Caches images and files. Then, refresing the page and try again. Chrome loves to troll dev like that 😂😂 Also, your configuration missed a type: 'GET' property.– Foo
Nov 24 '18 at 10:54
please paste your
data.json. your script.js is correct.– Edward Torvalds
Nov 24 '18 at 10:56
please paste your
data.json. your script.js is correct.– Edward Torvalds
Nov 24 '18 at 10:56
1
1
Your JSON is not valid, You can fix it
– Tico
Nov 24 '18 at 11:03
Your JSON is not valid, You can fix it
– Tico
Nov 24 '18 at 11:03
|
show 2 more comments
1 Answer
1
active
oldest
votes
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.
answered Nov 24 '18 at 11:01
Edward TorvaldsEdward Torvalds
450621
all property names should be double quoted , that was the issue
– Sumeet
Nov 24 '18 at 11:05
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53457343%2fajax-success-callback-not-getting-called-on-200-network-response%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
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.
answered Nov 24 '18 at 11:01
Edward TorvaldsEdward Torvalds
450621
all property names should be double quoted , that was the issue
– Sumeet
Nov 24 '18 at 11:05
add a comment |
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.
answered Nov 24 '18 at 11:01
Edward TorvaldsEdward Torvalds
450621
all property names should be double quoted , that was the issue
– Sumeet
Nov 24 '18 at 11:05
add a comment |
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.
answered Nov 24 '18 at 11:01
Edward TorvaldsEdward Torvalds
450621
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.
answered Nov 24 '18 at 11:01
Edward TorvaldsEdward Torvalds
450621
answered Nov 24 '18 at 11:01
Edward TorvaldsEdward Torvalds
450621
answered Nov 24 '18 at 11:01
Edward TorvaldsEdward Torvalds
450621
answered Nov 24 '18 at 11:01
Edward TorvaldsEdward Torvalds
450621
450621
all property names should be double quoted , that was the issue
– Sumeet
Nov 24 '18 at 11:05
add a comment |
all property names should be double quoted , that was the issue
– Sumeet
Nov 24 '18 at 11:05
all property names should be double quoted , that was the issue
– Sumeet
Nov 24 '18 at 11:05
all property names should be double quoted , that was the issue
– Sumeet
Nov 24 '18 at 11:05
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53457343%2fajax-success-callback-not-getting-called-on-200-network-response%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
1
Add an error call back as well to make sure there are no errors
– LearningPhase
Nov 24 '18 at 10:50
2
Check browser console for any errors
– LearningPhase
Nov 24 '18 at 10:51
If you're using Chrome, try to press
Ctrl+Shift+Delto clearCaches images and files. Then, refresing the page and try again. Chrome loves to troll dev like that 😂😂 Also, your configuration missed atype: 'GET'property.– Foo
Nov 24 '18 at 10:54
please paste your
data.json. yourscript.jsis correct.– Edward Torvalds
Nov 24 '18 at 10:56
1
Your JSON is not valid, You can fix it
– Tico
Nov 24 '18 at 11:03