Answered step by step
Verified Expert Solution
Question
1 Approved Answer
if ( document . readyState = = = 'loading' ) { / * * Description: Loads a file from the web server. Runs a callback
ifdocumentreadyState 'loading'
Description: Loads a file from the web server. Runs a callback function if successful.
@param String filename The filename to load.
@param Function callback The callback function to run after the file has been loaded.
function ajaxLoadFilefilename callback
Create new request.
let xobj new XMLHttpRequest;
Add datetime parameter to the URL to prevent browser caching.
let bustCache datetime new DategetTime;
xobj.openGET filename bustCache, true;
xobj. onreadystatechange function
DONE, request was fulfilled.
if xobj readyState && xobj.status
File was loaded so run callback function.
;
callbackxobj responseText;
xobj.sendnull;
The following line of code shows one way to execute the ajaxLoadFile function:
ajaxLoadFiledatabooksjson', addRowsToTable ;
document.addEventListenerDOMContentLoaded readJSONFile
else
readJSONFile;
function readJSONFileFilename callback
fetchFilename
thenresponse response.json
thendata callbackdata
catcherror console.errorError reading the JSON file', error;
function booksObjectdata
const tableBody document.querySelectortbody;
createTableRowsdata tableBody;
function createTableRowsbooks tableBody
const fragment document.createDocumentFragment;
for const isbn in books
const book booksisbn;
const row document.createElementtr;
const isbnCell document.createElementtd;
const titleCell document.createElementtd;
const priceCell document.createElementtd;
const quantityCell document.createElementtd;
const totalCell document.createElementtd;
isbnCell.textContent isbn;
titleCell.textContent book.title;
priceCell.textContent book.price;
quantityCell.textContent book.quantity;
totalCell.textContent book.price book.quantity;
row.appendChildisbnCell;
row.appendChildtitleCell;
row.appendChildpriceCell;
row.appendChildquantityCell;
row.appendChildtotalCell;
fragment.appendChildrow;
tableBody.appendChildfragment;
readJSONFiledatabooksjson', booksObject;
function booksObject
let books
:
title : "DATA SCIENCE & BIG DATA ANALYSIS",
price :
quantity :
:
title : "PRINCIPLES OF DATABASE MANAGEMENT",
price :
quantity :
:
title : "CCNA ROUTING & SWITCHING PORTABLE COMMAND GUIDE",
price :
quantity :
:
title : "CCNA ROUTING AND SWITCHING : EXAM",
price :
quantity :
:
title : "HANDSON MICROSOFT WINDOWS SERVER
price :
quantity :
:
title : "INTRODUCTION TO WEB DEVE",
price :
quantity :
:
title : "MURACH'S PHP AND MYSQL
price :
quantity :
:
title : "REVEL FOR LIANG JAVA ACCESS CARD",
price :
quantity :
Error I am getting is "failed to fetch at readJSONFile. How do i fix this?
Also any corrections on code will help too. THANK YOU
Step by Step Solution
There are 3 Steps involved in it
Step: 1
Get Instant Access to Expert-Tailored Solutions
See step-by-step solutions with expert insights and AI powered tools for academic success
Step: 2
Step: 3
Ace Your Homework with AI
Get the answers you need in no time with our AI-driven, step-by-step assistance
Get Started