Я являюсь javascript, новичком базы данных.
База данных содержит следующие данные
ID Title Comment
1 Book1 test
2 Book2 test
Я пытаюсь сохранить значения формы в базе данных. В то время, нажав кнопку поиска, я хочу проверить, существует ли уже значение формы (имя: заголовок) в базе данных. Если он существует, я хочу отобразить все содержимое (идентификатор, заголовок, комментарий), а если он не существует, я хочу отобразить «Не существует». После этого я хочу сохранить содержимое в базе данных, нажав кнопку сохранения.
・ Сохранить значения формы.
・ Поиск значений из базы данных и их отображение.
Эти два сделаны отдельно, но не могут быть объединены. Я пытался объединить ADD и FIND в rout.js, но не смог.
Если возможно, я бы хотел сделать это, не покидая страницу и не обновляя ее.
Узел. js + Express + MySQL.
Спасибо.
↓ rout.js
var express = require('express');
var router = express.Router();
var mysql = require("mysql");
var knex = require("knex")({
dialect: "mysql",
connection: {
host : "localhost",
user : "root",
password : "",
database : "db",
charset : "utf8"
}
});
var Bookshelf = require("bookshelf")(knex);
var MyData = Bookshelf.Model.extend({
tableName: "mydata"
});
//MySQL
var mysql_setting = {
host : "localhost",
user : "root",
password : "",
database : "db"
};
//ADD
router.get("/add", (req, res, next) => {
var data = {
title: "Hello/Add",
content: "",
form: {title:""},
mydata: null
}
res.render("hello/add", data);
});
router.post('/add', (req, res, next) => {
var ti = req.body.title;
var cm = req.body.comment;
var data = {"title":ti, "comment":cm};
var connection = mysql.createConnection(mysql_setting);
connection.connect();
connection.query("insert into mydata set ?", data,
function (error, results, fields) {
res.render("hello/add", data);
});
connection.end();
});
module.exports = router;
//FIND
router.post("/find", (req, res, next) => {
new MyData().where("title", "=", req.body.title).fetch().then((collection) => {
var data = {
title: "Hello!",
content: "search results : ",
form: req.body,
mydata: collection
};
res.render("hello/find", data);
})
});
↓ add.ejs
<!DOCTYPE html>
<html lang="ja">
<head>
<meta http-equiv="content-type"
content="text/html; charset=UTF-8">
<link rel="stylesheet" href="/stylesheets/style.css" />
<script src="https://code.jquery.com/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.min.js"></script>
</head>
<body>
<div role="main">
<form method="post" action="/hello/add" name="test">
<table>
<tr>
<td><textarea type="text" name="title" rows="10" cols="60" value="<%= form.title %>"></textarea></td>
</tr>
<tr>
<td><textarea type="text" name="comment" rows="10" cols="60" placeholder="comment"></textarea></td>
</tr>
<tr>
<th></th>
<td><input type="submit" value="serch"></td>
</tr>
</table>
</form>
<div>
<p><%- content %></p>
<% if (mydata != null){ %>
<p><ul>
<li><%- mydata.id %></li>
<li><%- mydata.attributes.title %></li>
<li><%- mydata.attributes.comment %></li>
</ul></p>
<table>
<tr>
<td><input type="submit" value="save"></td>
</tr>
</table>
<% } %>
</div>
</div>
</body>
</html>