根据节点发送的数据填充表

Question

I am trying to populate a table which will show a table of books based on the result it receives from node function. I have a function in Node which sends Books after it retrieves it from the mongodb:

app.get('/viewBooks', function (req, res) {
    BookTable.find(function (err, booksList) {
        if (err) return console.error(err);
        res.send(booksList);
    });
});

I want to display this sent result in a table-like format. This is how I tried to achieve this:

<table class="table table-striped table-hover " id="booksTable">
    <thead>
    <tr>
        <th>ISBN</th>
        <th>Book Title</th>
        <th>Book Authors</th>
        <th>Publisher</th>
        <th>Description</th>
        <th>Call Number</th>

    </tr>
    </thead>
</table>

<script>
    $(document).ready(function () {
        $.get('/viewBooks',function (data) {
                    var trJSON = '';
                    $.each(data.booksList, function (i, item) {
                        trJSON += '<tr><td>' + booksList.ISBN[i] + '</td><td>' + booksList.BookTitle[i] + '</td></tr>' + booksList.BookAuthors[i] + '</td></tr>'
                            + '<tr><td>' + booksList.Publisher[i] + '<tr><td>' + booksList.Description[i] + '<tr><td>' + booksList.CallNumber[i] + '<tr><td>';
                    });
                    $('#booksTable').append(trJSON);
                });
    });

</script>

If anyone is wondering, this is the data that /viewBooks sends back.

[{"_id":"58c7d0694172ab199c6de78e","ISBN":"9780730324218","BookTitle":"The Barefoot Investor : The Only Money Guide You'll Ever Need","BookAuthors":"Scott Pape","Publisher":"John Wiley & Sons Australia Ltd","Description":"This is the only money guide you'll ever need That's a bold claim, given there are already thousands of finance books on the shelves.","CallNumber":" 0730324214","__v":0},{"_id":"58c7d0694172ab199c6de790","ISBN":"9781447277682","BookTitle":"The Man Who Couldn't Stop","BookAuthors":"David Adam","Publisher":"Pan MacMillan","Description":"A Sunday Times Bestseller Have you ever had a strange urge to jump from a tall building, or steer your car into oncoming traffic? You are not alone.","CallNumber":"1447277686","__v":0},{"_id":"58c7d0694172ab199c6de78f","ISBN":"9781784701994","BookTitle":"When Breath Becomes Air","BookAuthors":"Paul Kalanithi","Publisher":"Vintage Publishing","Description":"This book is the New York Times Number One Bestseller. The Sunday Times Number one Bestseller.","CallNumber":"1784701998","__v":0},{"_id":"58c7d0694172ab199c6de791","ISBN":"9781447275282","BookTitle":"An Unquiet Mind:Picador Classic","BookAuthors":"Kay Redfield Jamison","Publisher":"Pan MacMillan","Description":"With an introduction by Andrew Solomon 'It stands alone in the literature of manic depression for its bravery, brilliance and beauty.' ","CallNumber":"1447275284","__v":0},{"_id":"58c7d0694172ab199c6de792","ISBN":"9780393340792","BookTitle":"Loud in the House of Myself:Memoir of a Strange Girl","BookAuthors":"Stacy Pershall","Publisher":"WW Norton & Co","Description":"Stacy Pershall grew up as an overly intelligent, depressed, deeply strange girl in Prairie Grove, Arkansas, population 1,000. From her days as a thirteen-year-old Jesus freak through her eventual diagnosis of bipolar disorder and borderline personality disorder, this spirited memoir chronicles Pershall's journey through hell and her struggle with the mental health care system.","CallNumber":"0393340791","__v":0}]

But this doesn't work. I don't get an error as well, I don't know what's wrong. If anyone could enlighten me it would be great.

Answer 1

You are using your index on the wrong part of the JSON object and you are calling data.bookList which I don't believe exists.

data.bookList.ISBN[0] is going to return an undefined value.

bookList[0].ISBN is also undefined.

data[0].ISBN will return 9780730324218.

Update your code to:

 $.each(data, function (i, item) {
     trJSON += '<tr><td>' + data[i].ISBN + '</td><td>' + data[i].BookTitle + '</td></tr>' + data[i].BookAuthors + '</td></tr>'
     + '<tr><td>' + data[i].Publisher + '<tr><td>' + data[i].Description + '<tr><td>' + data[i].CallNumber + '<tr><td>';
 });