When getting /lego/sets it renders all the data successfully but with query parameters like /lego/sets/?theme=technic it does not render correct, it just creates a single empty row of a table without any data
server.js
app.get("/lego/sets", (req, res) => {
if(req.query.theme){
legoData
.getSetsByTheme(req.query.theme)
.then((data) => {
if (data.length > 0) {
res.render("sets", {sets:data});
console.log(data);
}
//res.send(data);
})
.catch((err) => {
res.status(404).render("404");//sendFile(path.join(__dirname, "/views/404.html"));
});
}
else{
legoData
.getAllSets()
.then((data) => {
res.render("sets", {sets:data});
})
.catch((err) => {
console.log('err')
res.status(404).render("404");//sendFile(path.join(__dirname, "/views/404.html"));
});
}
});
sets.ejs
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=
, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="/css/main.css">
</head>
<body>
<%- include('partials/navbar', {page: '/lego/sets'}) %>
<div class="hero min-h-24 p-6 bg-base-200 md:container md:mx-auto">
<div class="max-w-md">
<h1 class="text-5xl font-bold">Collection</h1>
<!-- <p class="py-6 text-5xl ">Error 404 you messed up</p> -->
</div>
</div>
<table class="flex justify-center">
<tbody>
<% sets.forEach((set)=>{ %>
<tr>
<td class="w-24 rounded">
<img class="w-24 p-2" src="<%= set.img_url %>">
</td>
<td ><%= set.name %> </td>
<td ><a href="/lego/sets?theme=<%= set.theme %>" class="btn"><%= set.theme %></td>
<td ><%= set.year %></td>
<td class="pl-6 pr-6"><%= set.num_parts %></td>
<td><a href="/lego/sets/<%= set.set_num %>" class="btn">Details</a></td>
</tr>
<% }) %>
</tbody>
</table>
</body>
</html>
all the routes are configured properly i also tried console logging from both sets.ejs and server.js and it does console logs the correct data.