Why Join
Become a member
Login
No unread comment.
View All Comments
No unread message.
View All Messages
No unread notification.
View All Notifications
Answers
Post
An Article
A Blog
A News
A Video
An EBook
An Interview Question
Ask Question
C# Corner Home
Technologies
Monthly Leaders
ASK A QUESTION
Forumguidelines
Bhawna Tuteja
1.5k
492
60.5k
Error while fetching data from Json File in Javascript
Aug 11 2020 2:18 AM
I have a json file and I wanted to display data from that file to HTML. I have written code but while coding it is giving error as 'Type Error: Failed To Fetch'
Here is the code of various files
JSON File
[
{
"id"
:
"1"
,
"firstName"
:
"John"
,
"lastName"
:
"Doe"
},
{
"id"
:
"2"
,
"firstName"
:
"Mary"
,
"lastName"
:
"Peterson"
},
{
"id"
:
"3"
,
"firstName"
:
"George"
,
"lastName"
:
"Hansen"
}
]
fetch(
'DisplayData.json'
)
.then(
function
(response) {
alert(
'Inside Fetch'
);
return
response.json();
})
.then(
function
(data) {
appendData(data);
})
.
catch
(
function
(err) {
alert(
'Error Occured'
+ err);
});
function
appendData(data) {
alert(
'Inside function'
);
var
m = document.getElementById(
"mDiv"
);
for
(
var
i = 0; i < data.length; i++) {
var
div = document.createElement(
"div"
);
div.innerHTML =
'Name: '
+ data[i].firstName +
' '
+ data[i].lastName;
m.appendChild(div);
}
}
<html>
<script src=
"DisplayData.js"
></script>
<body>
<div id=
"mDiv"
>
</div>
</body>`enter code here`
</html>
Reply
Answers (
4
)
jquery Repeater Returns Null to MVC Controller on Submitting
How to force an array while converting xml to Json ?