demo25.js

//创建http连接
const http = require('http');
//创建服务器
const app = http.createServer();
//第三方模块导入
/* const mongoose = require('mongoose'); */
//获取连接
const url = require('url');
//
const querystring = require('querystring');require('./demo26.js');
const User = require('./model.js');//数据库连接地址
/* mongoose.connect('mongodb://localhost/playground', { useNewUrlParser: true }).then(() => console.log('数据库连接成功')).catch(() => console.log('数据库连接失败')); */
//创建用户集合
/* const userSchema = new mongoose.Schema({name: {type: String,required: true,minlength: 2,maxlength: 20},age: {type: Number,min: 18,max: 80},password: String,email: String,hobbies: [String]
});
//创建集合
const User = mongoose.model('User', userSchema); */
//添加属性事件
app.on('request', async(req, res) => {//请求方式const method = req.method;//请求地址const { pathname, query } = url.parse(req.url, true);if (method == 'GET') {//呈现用户列表页面if (pathname == '/list') {let users = await User.find();console.log(users);let list = `<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><body><div class="container"><h6><a href="/add" class="btn btn-primary">添加用户</a></h6><table class="table table-striped table-bordered"><tr><td>用户名</td><td>年龄</td><td>爱好</td><td>邮箱</td><td>操作</td></tr>`;//循环users.forEach(item => {list += `<tr><td>${item.name}</td><td>${item.age}</td><td>`item.hobbies.forEach(item => {list += `<span>${item}</span>`})list += ` </td> <td>${item.email}</td><td><a href="/remove?id=${item._id}">删除</a>|<a href="/modify?id=${item._id}">修改</a></td></tr>`;})list += `       </table></div></body></html>`res.end(list);} else if (pathname == '/add') {let add = `<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><body><div class="container"><h3>添加用户</h3><form method="post" action="/add"><div class="form-group"><label>用户名</label><input name="name" type="text" class="form-control" placeholder="请输入用户名"></div><div class="form-group"><label>密码</label><input name="password" type="password" class="form-control" placeholder="请输入密码"></div><div class="form-group"><label>年龄</label><input name="age" type="text" class="form-control" placeholder="请输入年龄"></div><div class="form-group"><label>邮箱</label><input name="email" type="text" class="form-control" placeholder="请输入年龄"></div><div><label class="checkbox-inline"><input type="checkbox" value="足球" name="hobbies">足球</label><label class="checkbox-inline"><input type="checkbox" value="篮球" name="hobbies">篮球</label><label class="checkbox-inline"><input type="checkbox" value="游戏" name="hobbies">游戏</label><label class="checkbox-inline"><input type="checkbox" value="娱乐" name="hobbies">娱乐</label><label class="checkbox-inline"><input type="checkbox" value="爬山" name="hobbies">爬山</label><label class="checkbox-inline"><input type="checkbox" value="划船" name="hobbies">划船</label><button type="submit">添加用户</button></div></form></div></body></html>`res.end(add);} else if (pathname == '/modify') {let user = await User.findOne({ _id: query.id });let hobbies = ['足球', '篮球', '游戏', '娱乐', '爬山', '划船'];let modify = `<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><body><div class="container"><h3>修改用户</h3><form method="post" action="/modify?id=${user._id}"><div class="form-group"><label>用户名</label><input value='${user.name}' name="name" type="text" class="form-control" placeholder="请输入用户名"></div><div class="form-group"><label>密码</label><input value='${user.password}' name="password" type="password" class="form-control" placeholder="请输入密码"></div><div class="form-group"><label>年龄</label><input value='${user.age}' name="age" type="text" class="form-control" placeholder="请输入年龄"></div><div class="form-group"><label>邮箱</label><input value='${user.email}' name="email" type="text" class="form-control" placeholder="请输入年龄"></div><div></html>`hobbies.forEach(item => {//判断爱好是不是在数组里面let isHobby = user.hobbies.includes(item);if (isHobby) {modify += `<label class="checkbox-inline"><input type="checkbox" value="${item}" name="hobbies" checked>${item}</label>`} else {modify += `<label class="checkbox-inline"><input type="checkbox" value="${item}" name="hobbies">${item}</label>`}})modify += `    <button type="submit">修改用户</button></div></form></div>
</body>`res.end(modify);} else if (pathname == '/remove') {//res.end(query.id);await User.findOneAndDelete({ _id: query.id });res.writeHead(301, {Location: '/list'});res.end();}} else if (method == 'POST') {//接受用户提交信息if (pathname == '/add') {let formData = '';req.on('data', param => {formData += param;})req.on('end', async() => {let user = querystring.parse(formData);await User.create(user);res.writeHead(301, {Location: 'list'});res.end();})} else if (pathname == '/modify') {let formData = '';req.on('data', param => {formData += param;})req.on('end', async() => {let user = querystring.parse(formData);await User.updateOne({ _id: query.id }, user);res.writeHead(301, {Location: 'list'});res.end();})}}url.parse(req.url);/* res.end('ok'); */
})
app.listen(3000);

demo26.js

const mongoose = require('mongoose');
mongoose.connect('mongodb://localhost/playground', { useNewUrlParser: true }).then(() => console.log('数据库连接成功')).catch(() => console.log('数据库连接失败'));

model.js

const mongoose = require('mongoose');const userSchema = new mongoose.Schema({name: {type: String,required: true,minlength: 2,maxlength: 20},age: {type: Number,min: 18,max: 80},password: String,email: String,hobbies: [String]
});
//创建集合
const User = mongoose.model('User', userSchema);module.exports = User;

运行结果

前端学习(1350):用户的增删改查操作7增删改查相关推荐

  1. yii学习笔记(6),数据库操作(增删改)

    数据库增删改操作通过活动记录实例来完成 插入记录 /* ----------添加记录---------- */ // 创建活动记录对象 $article = new Article(); $artic ...

  2. 前端学习(2884):dom更新操作的实现

  3. 前端学习(2622):过滤器进行操作

  4. Web前端学习:jQuery基础--3【jquery操作样式类名、添加元素、jQuery-CSS()方法】

    目录 1.jquery操作样式类名 代码演示 二.添加元素 1.append()演示 2.prepend()演示 3.after()演示 4.before()演示 三.jQuery-CSS()方法 1 ...

  5. mysql数据库中命令行下常用命令的操作(增、删、改、查)和数据类型

    连接命令:mysql -h[主机地址] -u[用户名] -p[用户密码] 创建数据库:create database [库名] 显示所有数据库: show databases; 打开数据库:use [ ...

  6. 在mysql中能够删除一列的是什么_mysql数据库中命令行下常用命令的操作(增、删、改、查)和数据类型...

    连接命令:mysql -h[主机地址] -u[用户名] -p[用户密码] 创建数据库:create database [库名] 显示所有数据库: show databases; 打开数据库:use [ ...

  7. 简单易懂的并查集算法以及并查集实战演练

    文章目录 前言 一.引例 二.结合引例写出并查集 1. 并查集维护一个数组 2. 并查集的 并 操作 3. 并查集的 查 操作 4. 基本并查集模板代码实现--第一版(有错误后面分析) 4.1 Jav ...

  8. Django学习笔记(10)——Book单表的增删改查页面

    一,项目题目:Book单表的增删改查页面 该项目主要练习使用Django开发一个Book单表的增删改查页面,通过这个项目巩固自己这段时间学习Django知识. 二,项目需求: 开发一个简单的Book增 ...

  9. Mybatis学习笔记(二) 之实现数据库的增删改查

    开发环境搭建 mybatis 的开发环境搭建,选择: eclipse j2ee 版本,mysql 5.1 ,jdk 1.7,mybatis3.2.0.jar包.这些软件工具均可以到各自的官方网站上下载 ...

最新文章

  1. 数据库SQL优化大总结之百万级数据库优化方案
  2. 盘点丨MIT教授Poggio:过去23年,机器学习取得了哪些进步
  3. XAF 官方问题笔记
  4. qt tcp通信_Qt之网络编程TCP通信
  5. JavaScript 基础知识 - BOM篇
  6. 伸缩轨道_深度解析——伸缩喷漆房为什么这么受欢迎!
  7. 在IBM服务器安装Windows server 2012的心得
  8. SAR数据集项目说明文档写作
  9. oracle 无法套取,mycat-oracle报java.sql.SQLException: 无法从套接字读取更多的数据
  10. 华为交换机vlan创建命令
  11. video标签实现简单视频背景+遇到问题(视频无法显示,不能自动播放)
  12. 路飞学城-python开发集训-第一章
  13. 日本艺伎的拍照姿势,竟源于孔子?看完真的涨知识···
  14. iOS开发之在地图上绘制出你运动的轨迹
  15. 软件研发管理工具Ones横评,对比国内外主流项目管理软件
  16. 用好销冠话术库,业绩增长十倍
  17. elementui+vue+springboot企业员工工资考勤请假系统
  18. wifi 信号差 android,手机WiFi信号弱怎么办 手机WiFi信号突然变弱的解决方法
  19. arcgis制图之天地图符号样式配置
  20. 迪文串口屏想实现超低功耗怎么办?

热门文章

  1. 1005:I Think I Need a Houseboat-poj
  2. .toString(c) 将数字值 渲染成 货币形式
  3. S3C2440、S3C2450和S3C6410之间区别
  4. c++分治法求最大最小值实现_最优化计算与matlab实现(12)——非线性最小二乘优化问题——G-N法...
  5. php splqueue 5.5安装,解析PHP标准库SPL数据结构
  6. mysql 数据分析的步骤_数据分析8个主要步骤
  7. 数据库杂谈(二)——数据模型
  8. Error format not a string literal and no format arguments解决方案
  9. 安卓之USB主机(Host)与配件(Accessory)模式
  10. [react] Consumer向上找不到Provider的时候怎么办?