#javascript
#язык JavaScript
Вопрос:
Привет, я хочу показать элементы только для определенной категории, поэтому, когда пользователь находится на html-странице, он может выбрать категорию, а затем он должен показывать элементы только для этой категории, это «vareKategori», где вы можете выбрать.[См.Ее интерфейс][1] на данный момент я могу отображать все товары, но я не могу получить товары только для одной категории. Было бы так здорово, если бы кто-нибудь показал мне, как это делается, тх.
Пожалуйста,помогите, это для экзаменационного проекта.
this is my code for now: // Jeg laver en function som tager userinputtet fra det de skriver. Det gør jeg både for nyt userID og nyt password document.addEventListener("DOMContentLoaded", (event) =gt; { document.getElementById("form").addEventListener("submit", (event) =gt; { event.preventDefault(); const varer = document.getElementById("varer").value; const pris = document.getElementById("pris").value; const vareKategori = document.getElementById("vareKategori").value; const billede = document.getElementById("billede").value const opretVare = { varer: varer, pris: pris, vareKategori: vareKategori, billede: billede }; fetch("http://localhost:8200/varer/createvarer", { method: "POST", headers: { 'Accept': 'application/json', 'Content-Type': 'application/json' }, body: JSON.stringify(opretVare), }) //converter det til Json .then((response) =gt; response.json()) .then((response) =gt; { if (response) { location.href = "/varer.html"; } }) .catch(() =gt; { window.alert("Der skete en fejl"); }); }); }); async function getGoods() { const response = await fetch("http://localhost:8200/varer/getproducts") const result = await response.json() return result } async function deleteGoods(id) { const response = await fetch("http://localhost:8200/varer/getproducts/" id, { method: 'DELETE' }) const result = await response.json() return result } function renderTable(goods) { const table = document.getElementById('varerTable'); let tableHtml = ` lt;trgt; lt;thgt; lt;label Varekategori:lt;/labelgt; lt;select name="kategori" id="kategori"gt; lt;option value="mad"gt;Madlt;/optiongt; lt;option value="drikkelse"gt;Drikkelselt;/optiongt; lt;/selectgt; lt;/thgt; lt;thgt;Varelt;/thgt; lt;thgt;Prislt;/thgt; lt;thgt;Billedelt;/thgt; lt;/trgt;`; for (const row of goods){ tableHtml = ` lt;trgt; lt;tdgt;${row.vareKategori}lt;/tdgt; lt;tdgt;${row.varer}lt;/tdgt; lt;tdgt;${row.pris}lt;/tdgt; lt;tdgt;lt;img src="${row.billede}" style="height:100px;width000px;"lt;/tdgt; lt;tdgt;lt;button onclick = "handleDelete(${row.id})"gt; Delete lt;/buttongt;lt;/tdgt; lt;tdgt;lt;button onclick ="toDo"gt; Edit lt;/buttongt;lt;/tdgt; lt;/trgt; `; } table.innerHTML = tableHtml; } async function handleDelete(id) { try { await deleteGoods(id) const goods = await getGoods() renderTable(goods) } catch(err) { console.error(err) } } async function handleLoad() { try { const goods = await getGoods() renderTable(goods) } catch(err) { console.error(err) } } document.getElementById("clickMe").addEventListener('click', handleLoad);
маршруты
router.put("/opdater_products/:varer", (req, res)=gt;{ let category = req.params.varer; if(products[category]){ products[category] = req.body.pris; res.status(200).json({[category]:products[category]}); } else{ res.send(404) } });
Модель
class Goods { constructor(varer, pris, vareKategori, billede) { this.varer = varer; this.pris = pris; this.vareKategori = vareKategori; this.billede = billede; } } module.exports = Goods;
Ответ №1:
Это немного сложно понять, но, может Array.prototype.filter
быть, это то, чего вы хотите? Например, если у вас есть список продуктов,
let categoryToSort = 'foo'; let products = [ { 'name': 'whatever', 'categories': ['foo', 'baz'], }, { 'name': 'baz', 'category': ['bar'], } ]; // Filter let filteredProducts = products.filter(p =gt; p.category.includes(categoryToSort)); // Output filtered array console.log(filteredProducts); /** output: { 'name': 'whatever', 'category': ['foo', 'baz'], }, **/