从表中搜索项目，然后选择并删除该项目

编程问答 2022-06-01

问题描述

我有一个搜索表单，可让用户按名称搜索项目。它将以可编辑的形式显示项目值，以便可以更新值。我还希望能够从表中删除该项目。如何从表中选择该项目，然后将项目 ID 提供给删除路由，以便将其删除？

app.post("/delete",function (req,res) {
        let sqlquery = "DELETE FROM `food_item` WHERE id = ?";
        let deleterecord = [req.body.id];

        db.query(sqlquery,deleterecord,(err,result) => {
            if (err) {
                return console.error(err.message);
            }else{
                res.send(" The following food item has been deleted from the database,name: "+ req.body.name + 
                         ",typical values: "+ req.body.price + ",unit of the typical value: " + req.body.unit_of_the_typical_value + 
                         ",calories: " + req.body.calories + ",carbs: " + req.body.carbs + ",fat: " + req.body.fat + 
                         ",protein: " + req.body.protein + ",salt: " + req.body.salt + ",sugar: " + req.body.sugar);
                }
        });
    });

更新表单。

<!doctype html>
<html>
<head>
<title>Update foods page</title>
</head>
<body>
<h1> Update foods page </h1>
<h3>display data related to the food found in the database including 
    name,typical values,unit of the typical value,calories,carbs,fat,protein,salt and sugar here:</h3>
<form method="POST" action="/topic7/mid-term/foodupdated">
    <% availableFood.forEach(function(food_item){ %>
    <p><input id="name" type="text" name="name" value= <%= food_item.name %> /></p>
    <p><input id="typical_values" type="text" name="typical_values" value= <%= food_item.typical_values %> /></p>
    <p><input id="unit_of_the_typical_value" type="text" name="unit_of_the_typical_value" value= <%= food_item.unit_of_the_typical_value %> /></p>
    <p><input id="calories" type="text" name="calories" value= <%= food_item.calories %> /></p>
    <p><input id="carbs" type="text" name="carbs" value= <%= food_item.carbs %> /></p>
    <p><input id="fat" type="text" name="fat" value= <%= food_item.fat %> /></p>
    <p><input id="protein" type="text" name="protein" value= <%= food_item.protein %> /></p>
    <p><input id="salt" type="text" name="salt" value= <%= food_item.salt %>/></p>
    <p><input id="sugar" type="text" name="sugar" value= <%= food_item.sugar %> /></p>
    <p><input type="submit" value="Update record" /></p>
    <% }) %>
</form>
<form method="POST" action="/topic7/mid-term/delete"> 
    <input type="submit" value="Delete record" />
</form>
</body>
</html>

解决方法

您应该在 forEach() 中包含所有表单，以便更新或删除项目。

  <% availableFood.forEach(function(food_item){ %>
  <form method="POST" action="/topic7/mid-term/foodupdated"></form>
    <input type="hidden" name="id" value="<%= food_item.id %>" />
    <p><input id="name" type="text" name="name" value="<%= food_item.name %>" /></p>
    <p><input id="typical_values" type="text" name="typical_values" value="<%= food_item.typical_values %>" /></p>
    <p><input id="unit_of_the_typical_value" type="text" name="unit_of_the_typical_value" value="<%= food_item.unit_of_the_typical_value %>" /></p>
    <p><input id="calories" type="text" name="calories" value="<%= food_item.calories %>" /></p>
    <p><input id="carbs" type="text" name="carbs" value="<%= food_item.carbs %>" /></p>
    <p><input id="fat" type="text" name="fat" value="<%= food_item.fat %>" /></p>
    <p><input id="protein" type="text" name="protein" value="<%= food_item.protein %>" /></p>
    <p><input id="salt" type="text" name="salt" value="<%= food_item.salt %>" /></p>
    <p><input id="sugar" type="text" name="sugar" value="<%= food_item.sugar %>" /></p>
    <p><input type="submit" value="Update record" /></p>
  </form>
  <form method="POST" action="/topic7/mid-term/delete"> 
    <input type="hidden" name="id" value="<%= food_item.id %>" />
    <input type="submit" value="Delete record" />
  </form>
  <% }) %>
expressexpressexpresssql-delete