我正在尝试在Node和Mongoose的帮助下开发CRUD应用程序。因此,我创建了一个联系表单,用户可以在其中输入他的电子邮件,主题和文本。到目前为止,我已经能够输入一些保存到数据库中的数据,并且这些数据随后也会显示在同一页面上。
现在,我正在使用更新功能。我还创建了用于更新的其他表单,用户可以在其中输入ID并更改数据库中的数据。现在,我已经创建了一个表,其中显示了数据。对于更新,我想在每行之后添加另一列更新。如果用户单击表内的更新,则数据应自动输入到我的输入字段中,因此用户只需要更改其电子邮件等,然后提交即可。到现在为止,用户必须复制ID,然后更新我要摆脱的条目。
我的文件:
contact.js
var express = require('express');
var router = express.Router();
var mongoose = require('mongoose');
mongoose.connect('mongodb://admin:admin@vm-uum-docker:27000/contact_form?authSource=admin');
var Schema = mongoose.Schema;
var contactForm = new Schema({
email: {type: String, required: true},
subject: {type: String, required: true},
text: String
});
var Form = mongoose.model('Contact', contactForm);
/* GET users listing. */
router.get('/', function(req, res, next) {
// res.render('contact');
Form.find({}, (err, entries) => {
if (err)
res.send(err);
res.render('contact', {entries:entries});
});
});
router.post('/', function(req, res, next) {
var item = {
email: req.body.email,
subject: req.body.subject,
text: req.body.text
}
var data = new Form(item);
function valideEmail(email){
var re = /\S+@\S+\.\S+/;
return re.test(email);
}
if (valideEmail(req.body.email)){
console.log('Email is valid! Data will be saved into the DB');
data.save();
//res.render('contact')
res.redirect('/contact');
} else {
console.log('Email isn`t valid. Please try another mail!');
}
});
router.post('/update', function(req, res, next) {
var id = req.body.id;
Form.findById(id, function(err, doc) {
if (err) {
console.error('error, no entry found');
}
doc.email = req.body.email;
doc.subject = req.body.subject;
doc.text = req.body.text;
doc.save();
res.redirect('/contact');
})
});
module.exports = router;
contact.pug
doctype html
html(lang='de')
head
meta(charset='utf-8')
meta(http-equiv='X-UA-Compatible', content='IE=edge')
meta(name='viewport', content='width=device-width, initial-scale=1')
script(src='https://ajax.googleapis.com/ajax/libs/jquery
/1.11.3/jquery.min.js')
// Das neueste kompilierte und minimierte CSS
link(rel='stylesheet', href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css')
// Optionales Theme
link(rel='stylesheet', href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css')
// Das neueste kompilierte und minimierte JavaScript
script(src='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js')
link(rel='stylesheet', href='/stylesheets/style.css')
title Kontaktformular
body
.container
h1 Get in touch!
#message
form(action='http://localhost:3000/contact', method='POST')
.form-group
label(for='email') Email address
input#email.form-control(type='text', placeholder='Enter email', name='email')
p.help-block We'll never share your email with anyone else.
.form-group
label(for='subject') Subject
input#subject.form-control(type='text', name='subject')
.form-group
label(for='text') What would you like to ask us?
textarea.form-control(rows='5', name='text')
button#submit.btn.btn-primary(type='submit') Submit
.container
h2 Update data
form(action='http://localhost:3000/contact/update', method='POST')
.form-group
label(for='id') ID
input#id.form-control(type='text', placeholder='Give a specific ID to update your entry in the DB', name='id')
.form-group
label(for='email') Email address
input#email.form-control(type='text', placeholder='Enter email', name='email')
p.help-block We'll never share your email with anyone else.
.form-group
label(for='subject') Subject
input#subject.form-control(type='text', name='subject')
.form-group
label(for='text') What would you like to ask us?
textarea.form-control(rows='5', name='text')
button#submit.btn.btn-primary(type='submit') Submit
hr
.container
if entries
table.table.table-bordered
thead
tr
th ID
th Email
th Subject
th Text
th Update Content
tbody
each entry in entries
tr
td #{entry._id}
td #{entry.email}
td #{entry.subject}
td #{entry.text}
td a(href='google.com') Google
script(type='text/javascript').
document.getElementById('submit').onclick = function(e){
function valideEmail(email){
var re = /\S+@\S+\.\S+/;
return re.test(email);
}
if (valideEmail(document.getElementById('email').value)){
document.getElementById('message').innerHTML = '<div class="alert alert-success">Your message was sent, we`ll respond ASAP!</div';
} else {
document.getElementById('message').innerHTML = '<div class="alert alert-danger">Your message was`t sent, please check your entries!</div';
e.preventDefault();
}
}
我真的很感谢任何帮助
答案 0 :(得分:0)
我已经使用mlab,mongoDB,mongoose数据库制作了基本的node js crud应用程序
const mongoose = require('mongoose');
let dev_db_url = 'mongodb://Anuj:Anuj123@ds233320.mlab.com:33320/db1';
const mongoDB = process.env.MONGODB_URI || dev_db_url;
mongoose.connect(mongoDB, { useNewUrlParser: true });
mongoose.Promise = global.Promise;
const db = mongoose.connection;
db.on('error', console.error.bind(console,'MongoDb Connection Error'));
具有MVC结构的-路由器,模型,控制器,还可以放置后删除数据 请参阅-Nodejs Crud app