添加学生信息

最新推荐文章于 2024-07-12 13:32:32 发布
最新推荐文章于 2024-07-12 13:32:32 发布
阅读量709 收藏 1
点赞数
分类专栏： 前端 开发 文章标签： mongodb javascript node.js npm web
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/APythonC/article/details/115612637
版权

模板引擎练习（Node.js + MongoDB）

模块化开发
创建 students 文件夹，包含 model , public , route , views 以及app.js五个文件和 js 文件，实现模块化开发，结构如下图：

在这里插入图片描述

model 文件夹：存放数据库相关代码（connect.js + user.js）

connect.js 代码如下：

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

user.js 代码如下：

const mongoose = require('mongoose');
 // 创建学生集合规则
const StudentSchema = new mongoose.Schema({
    name: {
        type: String,
        required: true,
        minlength: 2,
        maxlength: 20
    },
    age: {
        type: Number,
        min: 10,
        max: 25
    },
    sex: String,
    email: String,
    hobbies: [String],
    collage: String,
    enterDate: {
        type: Date,
        default: Date.now
    }
});

// 创建集合 返回集合构造函数
const Student = mongoose.model('Student', StudentSchema);

module.exports = Student;

public 文件夹：存放CSS格式代码（list.css + main.css）

list.css 代码如下：


body {
	padding: 0;
	margin: 0;
}

table {
	border-collapse: collapse;
}

table, td, th {
	text-align: center;
	line-height: 30px;
	border: 1px solid #CCC;
}

caption {
	font-weight: bold;
	font-size: 24px;
	margin-bottom: 10px;
}

table {
	width: 960px;
	margin: 50px auto;
}

a {
	text-decoration: none;
	color: #333;
}

a:hover {
	text-decoration: underline;
	color: #000;
}

main.css 代码如下：


body {
	margin: 0;
	padding: 0 0 40px;
	background-color: #F7F7F7;
	font-family: '微软雅黑';
}

form {
	max-width: 640px;
	width: 100%;
	margin: 24px auto;
	font-size: 28px;
}

label {
	display: block;
	margin: 10px 10px 15px;
	font-size: 24px;
}

.normal {
	display: block;
	width: 100%;
	height: 40px;
	font-size: 22px;
	margin-top: 10px;
	padding: 6px 10px;
	color: #333;
	border: 1px solid #CCC;
	box-sizing: border-box;
}

.btn {
	margin-top: 30px;
}

.btn input {
	color: #FFF;
	background-color: green;
	border: 0 none;
	outline: none;
	cursor: pointer;
}

input[type="file"] {
	/*opacity: 0;*/
	width: 120px;
	position: absolute;
	right: 0;
	z-index: 9;
}

.import {
	height: 40px;
	position: relative;
}

route 文件夹：存放路由代码（index.js）

index.js 代码如下：

// 引入router模块
const getRouter = require('router');
// 获取路由对象
const router = getRouter();
// 学生信息集合
const Student = require('../model/user');
// 引入模板引擎
const template = require('art-template');
// 引入querystring模块
const querystring = require('querystring');
const { model } = require('mongoose');

// 呈递学生档案信息页面
router.get('/add', (req, res) => {
    let html = template('index.art', {});
    res.end(html);
});

// 呈递学生档案信息列表页面
router.get('/list', async (req, res) => {
    // 查询学生信息
    let students = await Student.find();
    let html = template('list.art', {
        students: students
    });
    res.end(html);
});

// 实现学生信息添加功能
router.post('/add', (req, res) => {
    // 接收post请求参数
    let formData = '';
    req.on('data', param => {
        formData += param;
    });
    req.on('end', async () => {
        await Student.create(querystring.parse(formData));
        res.writeHead(301, {
            Location: '/list'
        });
        res.end();
    });
});

module.exports = router;

views 文件夹：存放模板引擎代码（index.art + list.art）

index.art 代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
	<title>学生档案</title>
	<link rel="stylesheet" href="./css/main.css">
</head>
<body>
	<form action="/add" method="post">
		<fieldset>
			<legend>学生档案</legend>
			<label>
				姓名: <input class="normal" type="text" autofocus placeholder="请输入姓名" name = "name">
			</label>
			<label>
				年龄: <input class="normal"  type="text" placeholder="请输入年龄" name = "age">
			</label>
			<label>
				性别: 
				<input type="radio" value="0" name = "sex"> 男
				<input type="radio" value="1" name = "sex"> 女
			</label>
			<label>
				邮箱地址: <input class="normal" type="text" placeholder="请输入邮箱地址" name = "email">
			</label>
			<label>
				爱好: 
				<input type="checkbox" value="敲代码" name = "hobbies"> 敲代码
				<input type="checkbox" value="打篮球" name = "hobbies"> 打篮球
				<input type="checkbox" value="睡觉" name = "hobbies"> 睡觉
			</label>
			<label>
				所属学院: 
				<select class="normal" name = "collage">
					<option value="前端与移动开发">前端与移动开发</option>
					<option value="PHP">PHP</option>
					<option value="JAVA">JAVA</option>
					<option value="Android">Android</option>
					<option value="IOS">IOS</option>
					<option value="UI设计">UI设计</option>
					<option value="C++">C++</option>
				</select>
			</label>
			<label>
				入学日期: <input type="date" class="normal" name = "enterDate">
			</label>
			<label class="btn">
				<input type="submit" value="提交" class="normal">
			</label>
		</fieldset>
	</form>
</body>
</html>

list.art 代码如下：

<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<title>学员信息</title>
	<link rel="stylesheet" href="./css/list.css">
</head>

<body>
	<table>
		<caption>学员信息</caption>
		<tr>
			<th>姓名</th>
			<th>年龄</th>
			<th>性别</th>
			<th>邮箱地址</th>
			<th>爱好</th>
			<th>所属学院</th>
			<th>入学时间</th>
		</tr>
		{{each students}}
		<tr>
			<th>{{$value.name}}</th>
			<th>{{$value.age}}</th>
			<th>{{$value.sex == '0' ? '男' : '女'}}</th>
			<th>{{$value.email}}</th>
			<th>
				{{each $value.hobbies}}
					<span>{{$value}} </span>
				{{/each}}
			</th>
			<th>{{$value.collage}}</th>
			<th>{{dateformat($value.enterDate, 'yyyy-mm-dd')}}</th>
		</tr>
		{{/each}}

	</table>
</body>

</html>

app.js 代码如下：

// 引入http模块
const http = require('http');
// 引入模板引擎
const template = require('art-template');
// 引入path模块
const path = require('path');
// 引入静态资源访问模块
const serveStatic = require('serve-static');
// 引入处理日期的第三方模块
const dateformat = require('dateformat');

const router = require('./route/index');
// 实现静态资源服务
const serve = serveStatic(path.join(__dirname, 'public'));

// 配置模板的根目录
template.defaults.root = path.join(__dirname, 'views');
// 处理日期格式
template.defaults.imports.dateformat = dateformat;

// 数据库连接
require('./model/connect')

// 创网站服务器
const app = http.createServer();
// 当客户端访问服务器端的时候
app.on('request', (req, res) => {
    // 启动路由功能
    router(req, res, () => { });
    // 启动静态资源访问服务功能
    serve(req, res, () => { });
});

// MySQL会占用80端口
app.listen(80);
console.log('服务器启动成功');
APythonC
关注
专栏目录
学生信息管理系统——添加学生信息（Java+web综合）
Nice_xue的博客
07-15 5335
前言 之前我们已经完成了登录和查询的操作，接下来我们完成学生信息添加的操作 一 分析 之前的博客我们已经把准备工作完成了，戳–>登录模块，查询模块<–查看 现在我们直接分析添加学生信息的逻辑： 二 代码 AddUserServlet package com.itevent.web.servlet; import com.itevent.domain.Users; import com.itevent.service.UserService; import com.itevent.serv
利用结构体实现学生管理系统（五大功能：1，查询学生信息  按学号或姓名查询 2，添加学生信息 3，修改学生信息 4，删除学生信息 5，对学生按照学号排序并输出其信息 ）
眼泪划过的星空
01-23 3538
本人新手，如果有需要修改的地方可以评论下哦，感谢大佬们指点！ 跪求老司机带飞，，，大家都是d=====(￣▽￣*) 棒棒哒！ 学生管理系统 学生信息包括：学号、姓名、性别、年龄 1.功能概述： 1）查询学生信息  按学号或姓名查询 2）添加学生信息 3）修改学生信息 4）删除学生信息 5）对学生按照学号排序并输出其信息 #include<stdio.h> #include<stdlib.h> #include<string.h> #define N 30 typede
java 添加学生信息并修改
04-10
添加学生信息（性别，班级，学号）并提供修改的java参考代码。
学生信息的添加与查询
yan17864307817的博客
04-14 1259
学生信息的添加与查询 Time Limit: 1000MS Memory Limit: 65536KB Submit Statistic Problem Description 设计一个学生添加和查询的系统，从键盘读入学生的数据，然后再从屏幕显示出来。 Input 第一行有2个整数N和M，其中：N——学生数量，M——学生属性数量； 第二行有M个字符串，表示学生
Python—学生信息管理系统（附源码）
最新发布
GLB_0627的博客
07-12 1366
定义一个主函数main,在通过定义一个menu函数对学生管理系统的菜单进行打印。# 定义menu()函数print('1. 新增学生')print('2. 显示学生')print('3. 查找学生')print('4. 删除学生')print('0. 退出程序')# 定义主函数print(' 欢迎来到学生管理系统 ')menu()main()
添加学生信息并显示
weixin_30576859的博客
06-26 601
思路分析 第一，创建表单 <fieldset> <legend>学生信息添加</legend> <form id="mainForm"> 姓名：<input type="text" name="name"> <br> 年龄：<input type="text" ...
新增学生数据(二)
我要记录学习博客
05-11 443
新增学生学习思路 1、点击弹出模态框 2、获取每一个input的val值 3、保存新增至数据库 4、新增成功自动刷新页面 框架弹出模态窗体的两种方法： 这里我们通过JQuery的方法来点击弹出模态窗体 // 点击弹出新增学生信息 $("#PopModel").click(function () { $('#myModal').modal() }); 然后通过表单输入的值传递给方法新增至表单呢？ 1、通过弹出模态框点击新增学生信息获取到input的val值 // 点击
Python小项目（学生成绩管理系统）3.添加学生信息部分
Deuts的博客
07-19 4181
Python小项目（学生成绩管理系统） 第三天：添加学生信息部分。 一.insert()函数 定义一个insert()函数，其功能为： 1.创建一个列表student_list=[]，用于存放学生的各种信息以及考试成绩。 2.用input()写入学生信息，注意将姓名部分改为字符串类型str()。 3.将学生的信息汇总成一个字典student={}。 一个学生就是一个字典，将所有的字典放入最初student_list列表中。 下一步即为将列表信息保存至本地文件中（即为save()函数）。 .
java添加学生信息_javaweb之添加学生信息
weixin_29416781的博客
02-13 1666
1登录账号：要求由6到12位字母、数字、下划线组成，只有字母可以开头；(1分)2登录密码：要求显示“• ”或“*”表示输入位数，密码要求八位以上字母、数字组成。(1分)3性别：要求用单选框或下拉框实现，选项只有“男”或“女”；(1分)4学号：要求八位数字组成，前四位为“2018”开头，输入自己学号；(1分)5姓名：输入自己的姓名；6点击“添加”按钮，将学生个人信息存储到数据库中。(3分)7可以演示...
Java 项目 学生信息管理系统 超详细 超完整 保姆级讲解（主页面 + 添加学生信息 + 删除学生信息 +
bsegebr的博客
06-05 677
关注博主不迷路，博主带你码代码！这是一个学生信息管理系统，学生信息主要包括：学号，姓名，性别，出生日期，班级；暂时就只有这些信息，若后续需要，可以相应的进行添加。该项目主要采用的技术是 Java GUI 设计，这个地方主要用 Java 工具 windowsbuilder 进行布局，（windowsbuilder没有安装或者不会安装的，可以看看我的这篇博客 Eclipse 安装 windowbuilder插件），MySql 数据库（MySql 数据库没有安装的 或者数据库使用软件 Navicat 没有安装的可
c语言添加学生信息代码,《C语言-学生信息管理系统(代码)》.doc
weixin_33229152的博客
05-21 902
X X 师 范 大 学实 验 报 告课 程 C语言课程设计任课老师学 号姓 名院 系_______年______月至_______年_______月注意事项使用C语言，代码已在vs中运行过，可以运行(主要功能都能实现)需求分析，前期设计都没写，请同学们自己完成附带有 student.txt 文件，将其移动至 F:\stu 文件夹中，运行程序时可直接选 6号指令，...
学生信息管理系统 实现学生的添加删除修改(java代码编写)
06-09
java 代码编写 能够实现学生信息的添加,删除,修改.
学生信息管理系统 包括添加学生 班级管理 查询
11-30
学生信息管理系统 包括添加学生 班级管理 查询 使用ASP.NET开发，功能良好，使用方便
学生信息管理系统（可实现查询，删除，修改，增加等功能）
11-21
一个关于学生信息管理系统~~可实现查询，修改，删除等等！输入学生学号可以查询学生的学号，姓名，年龄，性别等等，很好的一个C++编写的学生信息管理系统
链表解决学生信息的新增数据，保存数据，查看数据及退出系统
02-07
链表文件操作综合例题，关于学生信息的新增数据，保存数据，查看数据及退出系统
java添加学生信息
08-23
要用Java编写一个程序来添加学生信息，首先需要定义一个学生类，包含以下属性：学生姓名、学生年龄、学生性别、学生学号等。可以通过构造方法来初始化这些属性，并提供相应的修改和获取方法。 在主程序中，可以通过...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值