mysql - 从mysql运行GET请求时只返回空格前的第一个单词
问题描述
背景:
我正在做一个小型 crud 项目,学习如何将 CRUD 与 node.js 和 mysql 结合起来。对于本节,我将提取将填充几个输入字段的数据,以便我可以进行一些更改然后更新。
问题:
一切正常,只是当我运行GET请求时,我返回的数据是第一个空格之前的所有内容。因此,如果我有一个名为ALL Clear的产品,我只会得到结果ALL,这对于每个字段都是相同的。
目标:
我的目标是将全文而不是部分输入到我的输入字段中。
这是我的 server.js 代码,它显示了我的 GET 请求,其中包括 html 代码,该代码将呈现显示填充有来自 mysql 的数据的所有输入:
我做了什么:
我已经做过研究,但出于某种原因,我只找到了对 PHP 的引用
app.get("/test", function(req, res) {
let ID = req.query.ID;
let option = req.query.selectpicker;
mysqlConnection.query('SELECT * FROM ' + option + ' WHERE id=' + ID, function(err, result) {
if (err) throw err;
var html = `
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="../css/bootstrap.min.css">
<link rel="stylesheet" href="../css/style.css">
<title>Update Item</title>
</head>
<body>
<h1 class="bg-dark p-3 text-center text-white">UPDATE ITEM</h1>
<div class="form-group col-md-4 pt-5 container font-weight-bold">
`;
for (var i = 0; i < result.length; i++) {
html += `<form class="contact_section_form pt-3 pb-3">`
html += `<div class="form-group">`
html += `<label class="font-weight-bold">Option</label>`
html += `<input type="input" class="form-control" name="selectpicker" value=${option} readonly>`
html += `</div>`
html += `<div class="form-group">`
html += `<label class="font-weight-bold">Id</label>`
html += `<input type="input" class="form-control" name="idName" value=${result[i].id} readonly>`
html += `</div>`
html += `<div class="form-group">`
html += `<label class="font-weight-bold">Supply Name</label>`
html += `<input type="input" class="form-control" name="supplyName" value=${result[i].supply_name} readonly>`
html += `</div>`
html += `<div class="form-group">`
html += `<label class="font-weight-bold">Description</label>`
html += `<input type="input" class="form-control" name="descriptionInfo" value=${result[i].description_info} readonly>`
html += `</div>`
html += `<div class="form-group">`
html += `<label class="font-weight-bold">Quantity</label>`
html += `<input type="input" class="form-control" name="quantity" value=${result[i].qty}>`
html += `</div>`
html += `<div class="form-group">`
html += `<label class="font-weight-bold">Size</label>`
html += `<input type="input" class="form-control" name="size" value=${result[i].size }>`
html += `</div>`
html += `<div class="form-group">`
html += `<label class="font-weight-bold">Amount</label>`
html += `<input type="input" class="form-control" name="amount" value=${result[i].amount}>`
html += `</div>`
html += `<div class="form-group">`
html += `<label class="font-weight-bold">Unit Of Measurement</label>`
html += `<input type="input" class="form-control" name="unitOfMeasurement" value=${result[i].unit_of_measurement}>`
html += `</div>`
html += `<div class="form-group">`
html += `<label class="font-weight-bold">Category</label>`
html += `<input type="input" class="form-control" name="category" value=${result[i].category} readonly>`
html += `</div>`
html += `<div class="form-group">`
html += `<label class="font-weight-bold">Category Id</label>`
html += `<input type="input" class="form-control" name="categoryId" value=${result[i].category_id} readonly>`
html += `</div>`
html += `<div class="form-group">`
html += `<label class="font-weight-bold">Date received</label>`
html += `<input type="input" class="form-control" name="dateReceived" value=${result[i].date_received} readonly>`
html += `</div>`
html += `<div class="form-group">`
html += `<label class="font-weight-bold">Last date removed</label>`
html += `<input type="input" class="form-control" name="lastDateRemoved" value=${result[i].last_date_removed} readonly>`
html += `</div>`
html += `<div class="text-center">`
html += `<button class="btn btn-md btn-secondary font-weight-bold text-uppercase" formmethod="POST" formaction="/update">Update</button>`
html += `</div>`
html += `</form>`
}
html += `</body>`
html += `</html>`
res.send(html);
});
});
这是将数据拉入输入表单时的示例:
这是此示例中数据库的图片,您可以看到我们用于上图中的项目是卫生纸,但它只是拉厕所
任何指导或反馈将不胜感激。
解决方案
尝试在所有属性周围加上引号value
,就像这样。
html += `<input type="input" class="form-control"
name="supplyName"
value="${result[i].supply_name}" readonly>`
^ ^
但是,它比这更复杂一些,因为您的数据库列值本身可能包含"
字符。将它们从字面上放入您的 html 会弄乱它。尝试这个:
html += `<input type="input" class="form-control"
name="supplyName"
value="${escape(result[i].supply_name)}" readonly>`
^ ^^^^^^^ ^ ^
专业提示使用像哈巴狗或车把这样的 HTML 模板引擎会让你的生活变得更加轻松。
浏览器中的专业提示 View source ...
是您的朋友。
推荐阅读
- vba - 如何在列中搜索位于不同位置的单词
- python - 有条件地删除缩写中的句点,但不是以 python 正则表达式结尾的句子
- python - 我要删除的代码运行警告
- html - 如何在我的页面导航旁边对齐 CSS 中的对象
- java - 将数据发送到另一个活动的 Listview
- amazon-web-services - 使用 AWS Lambda (NodeJS) 训练和部署 SageMaker ML 模型
- assembly - 这两条指令在做什么?
- node.js - Node.js express 在 / 之后得到一切
- python-3.x - 如何在网络爬虫中添加链接的内部文本?
- javascript - 推送到数组不会触发 vue 的反应