So far, everything seems to be working reasonably well.
We're making our request to the backend with our authorization token and we're getting a response.
And if we look at the response we're getting back here on our Web browser, I still have it open where
it was the last time we did this.
If I switched to Raw, you can see the Jason is coming in a really predictable format.
We have our basic information here and then we have things about our widget or transaction and our customer.
And we're going to use this to populate our table, which is really straightforward.
So back here in all dash sales page HTML, I've just so far did console log data.
And now what I want to do is actually to loop through all of the entries, images and we're getting
that in JavaScript.
That's as simple as data dot for each with a capital E and we put a function in there and I'll call
what I'm passing for each iteration I for iteration and open a curly bracket and close it.
So I don't forget an inside here.
I'm just going to say let nu row equal t body, which we have a reference to right up there in line
twenty nine dot insert row and that puts a row, that creates a row for us.
OK, and I will create a self new cell, equal new row which we just created on line forty six in my
code insert.
So and we populate that with the information we want.
So the first thing I want, if you look at the table at the top here is a transaction reference.
I'm going to make that a clickable link, so I'll build that this way.
I'll say nacelle the inner HTML is going to be equal to and I'll make this a JavaScript template using
tactics a trip equals and I'll make that admin slash, admin slash sales slash and then using the JavaScript
template syntax dollar sign curly bracket I, which is the value in the current iteration of this for
each loop ID, which is the order eyeteeth and I'll close that quote, close the attack and say order
and then dollar sign curly brackets ID again.
And close my eyes and now finally put it back to close the JavaScript template, so that should insert
something in the first cell in the row that I just inserted.
But I better spell cell right here or I'll get a JavaScript error.
That's better.
Now, I'll make new cell equal to this time neuro insert cell to insert a second cell and a populated
information pretty easily, I'll say let Eitam equal document dot create text node.
And inside of that, I'll put IDOT.
Customer, Daudt, last name, and that corresponds to this right here.
I would be our first iteration customers down here and first name is right there, so I got customers
up first or last name, last name plus, and then I'll put a comma in the space.
Plus, I got customer first name, first underscore name.
So that creates a variable for me.
And I will say New South, the Penn child, and I'll put item in there, which I just created, so that's
my second.
So let's do the third cell.
New cell equals neuro insert cell.
And this time item is equal to document, not create text notes.
And I'm going to put it in their widget dot net because that's what I want to display in that cell and
all new cell and child.
And I'm spending item.
And finally, new cell equals neuro insert cell, it's an empty cell.
So in this time, item is equal to document, not create text note, and I want idot transaction amount.
Now that will display a sense but this will get it up there on the table for us anyway and append that
new cell, the appen child.
And if we did everything right, I already have the backend running and I run the front end using air
you can see right here and it's running.
So let's go back and refresh our page and see what we get.
So reload the page and there is my information.
And obviously these links don't go anywhere.
We'll have to create the route in the handler and so forth for those to display the sales information
on an individual basis.
But you are always correct.
I have slash admin slash sales too, which is order too.
And I have the customer's name and I have the product and I have the amount and we'll have to write
some JavaScript to format this as currency.
But that's trivial.
I will take care of that sort of thing in the next lecture.