这是一个基于JavaWeb的场馆场地预订管理系统，使用JSP、Servlet、SpringBoot、MySQL和Ajax等技术。系统支持课程设计、大作业等多种场景，具备用户登录、场地信息展示、预约管理等功能。代码中包含了编辑和查看公告、预约详情的Ajax操作，以及前端界面的Bootstrap样式。系统还涉及到了MVC模式、数据持久化和前端交互。
基于javaweb+jsp的场馆场地预订管理系统(JavaWeb JSP MySQL Servlet SSM SpringBoot Bootstrap Ajax)
JavaWeb JavaBean JSP MVC MySQL Tomcat JavaScript Bootstrap Ajax
基础JSP+Servlet或JSP+SSM(Spring、SpringMVC、MyBatis)框架或JSP+SSM+Maven(pom.xml)框架或SpringBoot…均可
开发工具：eclipse/idea/myeclipse/sts等均可配置运行
适用
课程设计，大作业，毕业设计，项目练习，学习演示等
$('#modal-edit').on('show.bs.modal', function (event) {
let button = $(event.relatedTarget);
let id = button.data('id');
let modal = $(this);
$.ajax({
url: 'noticeGet?id=' + id,
type: "get",
success: function (voString) {
let vo = eval('(' + voString + ')');
modal.find('#edit-id').val(vo.id);
modal.find('#edit-noticeName').val(vo.noticeName);
modal.find('#edit-noticeText').val(vo.noticeText);
modal.find('#edit-noticeType').val(vo.noticeType);
modal.find('#edit-createDate').val(vo.createDate);
}
})
})
$('#modal-info').on('show.bs.modal', function (event) {
let button = $(event.relatedTarget);
let id = button.data('id');
let modal = $(this);
<input class="form-control" type="text" id="search_keyword" name="search_keyword" placeholder="名称"/> <span class="input-group-btn"><button class="btn btn-line btn-rect btn-default" type="button" onclick="searchList()">搜索</button></span>
</div>
</div>
<div class="col-sm-5">
<button type="button" <c:if test="${loginUser.userType != '管理员'}">disabled="disabled" title="没有权限！！！"</c:if> class="btn btn-line btn-rect btn-default" data-toggle="modal" data-target="#modal-add">添加场地
</button>
</div>
</div>
<br>
<br>
<div class="table-responsive">
<table class="table table-striped table-hover">
<thead>
<tr>
<th>名称</th>
<th>负责人</th>
modal.find('#edit-yuyueShijian').val(vo.yuyueShijian);
modal.find('#edit-yuyueText').val(vo.yuyueText);
}
})
})
$('#modal-info').on('show.bs.modal', function (event) {
let button = $(event.relatedTarget);
let id = button.data('id');
let modal = $(this);
$.ajax({
url: 'yuyueGet?id=' + id,
type: "get",
success: function (voString) {
let vo = eval('(' + voString + ')');
modal.find('#info-yuyueName').text(vo.yuyueName);
modal.find('#info-yuyueSex').text(vo.yuyueSex);
<div class="modal-content">
<form action="yuyueAdd" onsubmit="return addCheck()">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"
aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title" id="myModalLabel">增加预约</h4>
</div>
<div class="modal-body">
<div class="form-group hidden">
<label class="control-label">(hidden)</label>
<input type="text" class="form-control" name="action" value="add">
</div>
<div class="form-group">
<label for="add-yuyueName" class="control-label">预约人:</label>
<input type="text" class="form-control" name="yuyueName" id="add-yuyueName">
</div>
<div class="form-group">
<label class="control-label">性别:</label>
<input name="yuyueSex" id="add-yuyueSex_男" type="radio" value="男" checked="checked"/>男
<input name="yuyueSex" id="add-yuyueSex_女" type="radio" value="女"/>女
<input name="yuyueSex" id="add-yuyueSex_保密" type="radio" value="保密"/>保密
</div>
<div class="form-group">
<label for="add-yuyuePhone" class="control-label">联系方式:</label>
<input type="text" class="form-control" name="yuyuePhone" id="add-yuyuePhone">
</div>
</div>
<!-- info -->
<div class="modal fade" id="modal-info" tabindex="-1" role="dialog"
aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<form>
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title">公告</h4>
}
package com.demo.vo;
import java.io.Serializable;
/**
* 预约（t_yuyue表对应的Java实体类）
*/
public class Yuyue implements Serializable {
private Long id;//主键
private String yuyueName;//预约人
private String yuyueSex;//性别:男/女/保密
private String yuyuePhone;//联系方式
private String yuyueChangdi;//场地
private String yuyueShijian;//时间
private String yuyueText;//备注
<c:choose>
<c:when test="${fn:length(vo.noticeText) > 19}">
<c:out value="${fn:substring(vo.noticeText, 0, 19)}..."/>
</c:when>
<c:otherwise>
<c:out value="${vo.noticeText}"/>
</c:otherwise>
</c:choose>
</td>
<td>${vo.noticeType}</td>
<td>${vo.createDate}</td>
<th style="text-align: center;">
<button class="btn btn-line btn-rect btn-warning btn-sm" data-id="${vo.id}"
data-toggle="modal" data-target="#modal-info">详情
</button>
<button class="btn btn-line btn-rect btn-warning btn-sm"
<c:if test="${loginUser.userType != '管理员'}">disabled="disabled" title="没有权限！！！"</c:if>
data-id="${vo.id}"
data-toggle="modal" data-target="#modal-edit">编辑
</button>
<input type="text" class="form-control" name="noticeType" id="add-noticeType">
</div>
<div class="form-group">
<label for="add-createDate" class="control-label">创建时间:</label>
<input type="text" class="form-control" name="createDate" id="add-createDate">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-line btn-rect btn-warning" data-dismiss="modal">取消</button>
<button type="submit" class="btn btn-line btn-rect btn-default">提交</button>
</div>
</form>
</div>
</div>
</div>
<!-- info -->
<div class="modal fade" id="modal-info" tabindex="-1" role="dialog"
aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<form>
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
if (document.getElementById("edit-noticeName").value.trim().length == 0) {
alert("标题不能为空");
return false;
}
if (document.getElementById("edit-noticeType").value.trim().length == 0) {
alert("类型不能为空");
return false;
}
if (document.getElementById("edit-createDate").value.trim().length == 0) {
alert("创建时间不能为空");
return false;
}
return true;
}
</script>
</html>
<%@ page contentType="text/html; charset=utf-8" pageEncoding="utf-8" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>登录</title>
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/main.css">
<script src="js/jquery-3.5.1.js"></script>
<script src="js/bootstrap.js"></script>
/**
* 获取场地的详细信息（详情页面与编辑页面要显示该场地的详情）并跳转回页面
*
* @param response
* @param request
* @throws IOException
*/
@RequestMapping({"changdiGet", "changdiEditPre"})
public void get(HttpServletResponse response, HttpServletRequest request) throws IOException {
Serializable id = Util.decode(request, "id");//取出主键id
Changdi vo = changdiService.get(id);
response.getWriter().println(com.alibaba.fastjson.JSONObject.toJSONString(vo));
}
<if test ='yuyueShijian != null'>#{yuyueShijian},</if>
<if test ='yuyueText != null'>#{yuyueText}</if>
</trim>
</insert>
<!--批量删除-->
<delete id="doRemoveBatch" parameterType="java.util.Collection">
DELETE FROM `t_yuyue` WHERE `id` IN
<foreach collection="list" item="id" separator="," open="(" close=")">
#{id}
</foreach>
</delete>
<!--修改-->
<update id="doUpdate" parameterType="com.demo.vo.Yuyue">
UPDATE `t_yuyue`
<set>
<if test ='id != null'>`id` = #{id},</if>
<if test ='yuyueName != null'>`yuyue_name` = #{yuyueName},</if>
<if test ='yuyueSex != null'>`yuyue_sex` = #{yuyueSex},</if>
<if test ='yuyuePhone != null'>`yuyue_phone` = #{yuyuePhone},</if>
运行环境
Java≥6、Tomcat≥7.0、MySQL≥5.5
开发工具
eclipse/idea/myeclipse/sts等均可配置运行
技术框架
JavaWeb JavaBean JSP MVC MySQL Tomcat JavaScript Bootstrap Ajax
基础JSP+Servlet或JSP+SSM(Spring、SpringMVC、MyBatis)框架或JSP+SSM+Maven(pom.xml)框架或SpringBoot…均可
适用
课程设计，大作业，毕业设计，项目练习，学习演示等
功能说明
登录、注册、退出、用户模块、公告模块、场地模块、预约模块的增删改查管理
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
