http://127.0.0.1:8080/mrbbs/goTest02
样式与脚本文件
jspHeader.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%><%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %><%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
String socketPath = request.getServerName()+":"+request.getServerPort()+path+"/";
%><!--
该文件定义了样式与脚本文件--><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>BBS </title><style type="text/css">.tbl {background: #e5edf2 none repeat scroll 0 0;border-right: 1px solid #c2d5e3;overflow: hidden;width: 160px;}.tbr {hyphens: auto;word-break: break-all;}.list-paddingleft-2 {padding-left: 36px;}</style><!-- ********************************Bootstrap*************************************** --><link href="<%=basePath %>bootstrap-3.3.5-dist/css/bootstrap.min.css" rel="stylesheet"><link href="<%=basePath %>css/ityks.css" rel="stylesheet"><!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --><!-- WARNING: Respond.js doesn't work if you view the page via file:// --><!--[if lt IE 9]><script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script><script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script><![endif]--><!-- 配置文件 --><script type="text/javascript" src="<%=basePath %>uedit/js/ueditor.config.js"></script><!-- 编辑器源码文件 --><script type="text/javascript" src="<%=basePath %>uedit/js/ueditor.all.js"></script><!-- jQuery (necessary for Bootstrap's JavaScript plugins) --><script src="<%=basePath %>bootstrap-3.3.5-dist/js/jquery-1.11.3.min.js"></script><!-- Include all compiled plugins (below), or include individual files as needed --><script src="<%=basePath %>bootstrap-3.3.5-dist/js/bootstrap.min.js"></script><script type="text/javascript" src="<%=basePath %>js/index.js"></script>
添加新帖表单与富文本编辑器
mrbbs=>WebContent=>WEB-INF=>view=>myJSP=>mainPage.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE HTML>
<html>
<head>
<%@include file="/../../../jspHead.jsp" %>
</head>
<body><!-- **************************添加新帖表单与富文本编辑器******************************** --><form action="<%=basePath %>saveUeditorContent" method="post"><!-- 加载编辑器的容器 --><!-- label标签为input表单定义标注 --><label for="biaoti"> 帖子标题：</label> <!-- input标签用于收集用户信息 --><input type="text" name="mainTitle" placeholder="最大长度80个汉字" style="width: 360px;" > <!-- button标签放置一个按钮，type属性设置为submit用于提交表单 --><button type="submit" class="btn btn-primary btn-xs text-right">发表帖子</button> <!-- 富文本编辑器 --> <div style="padding: 0px;margin: 0px;width: 100%;height: 100%;" ><script id="container" name="content" type="text/plain"></script></div><button type="submit">保存</button></form><!-- 配置文件 --><script type="text/javascript" src="<%=basePath %>uedit/js/ueditor.config.js"></script><!-- 编辑器源码文件 --><script type="text/javascript" src="<%=basePath %>uedit/js/ueditor.all.js"></script><!-- 实例化编辑器 --><script type="text/javascript">var editor = UE.getEditor('container');</script><!-- ***************************************富文本*************************************** --></body>
</html>
接受新帖表单与富文本编辑器参数
mrbbs=>myresource=>com.mrkj.ygl.controller=>MainPageController.java
package com.mrkj.ygl.controller;import java.util.List;
import java.util.Map;import javax.annotation.Resource;
import javax.servlet.http.HttpServletRequest;import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.servlet.ModelAndView;import com.mrkj.ygl.service.MainPageService;/** 接收新帖提交参数，处理参数，存入数据库* *///@Controller注解声明该类为Spring控制类，继而通过@requestMapping注解声明的路径映射
//如果不使用@Controller注解，@requestMapping注解也会失效
@Controller
public class MainPageController {/* @Resource，Javax.annotation.Resource，该注解并不是Spring注解，但是Spring支持该注解注入被rquestMapping注解声明的方法，会自动注入request：该参数由Spring注入content：该参数由前端传递过来，记录了富文本数据，参数名称要与传递过来的参数名要一致mainTitle：该参数由前端传递过来，记录了帖子标题，参数名称要与传递过来的参数名要一致* */@ResourceMainPageService mps;@RequestMapping(value = "/saveUeditorContent")public ModelAndView saveUeditor(HttpServletRequest request, String content, String mainTitle) {ModelAndView mav = new ModelAndView();// 获取客户端IP地址作为发帖人String mainCreatuser = request.getRemoteAddr();int result = mps.saveMainContent(content, mainTitle, mainCreatuser);// 根据result判断是否向数据库当中插入了一条数据if (result == 1) {// 如果数据插入成功，重新刷新页面数据mav.setViewName("redirect:/goMainPage");} else {// 如果数据插入失败，设置视图指向错误页面mav.setViewName("myJSP/error");}return mav;}
}
存储数据库
mrbbs=>myresource=>com.mrkj.ygl.service=>MainPageService.java
package com.mrkj.ygl.service;import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.List;
import java.util.Map;
import java.util.UUID; import javax.annotation.Resource;
import org.springframework.jdbc.core.JdbcTemplate;
import org.springframework.stereotype.Service;@Service
public class MainPageService {//注入Spring JdbcTemplate@ResourceJdbcTemplate jdbc;//注入时间格式化@ResourceSimpleDateFormat sdf;/*** * @param content 帖子内容* @param mainTitle 帖子标题* @param mainCreatuser 发帖人，这里我们使用用户IP作为发帖* @return*/public int saveMainContent(String content,String mainTitle,String mainCreatuser){//定义sql语句，这里的sql使用的是防注入模式，VALUES的值使用的是?占位符String sql_save_mymain = "INSERT INTO my_main "+ "(main_id,main_title,main_content,"+ "main_creatime,main_creatuser,main_commend)"+ " VALUES (?,?,?,?,?,?)";String sql_save_myinfo = "INSERT INTO my_info "+ "(main_id,info_reply,info_see,"+ "info_lastuser,info_lastime) "+ "VALUES (?,0,0,?,?)";//表id使用的是UUIDString mainId = UUID.randomUUID().toString();//时间格式化，格式要与数据库中的datatime相对应yyyy-MM-dd hh:mm:sssdf.applyPattern("yyyy-MM-dd hh:mm:ss");//获取当前时间作为创建时间String mainCreatime = sdf.format(new Date());//精华帖标记，0普通帖，1精华帖Integer mainCommend = 0;//初始化myinfo表数据，注意my_info表的id为自增长所以这里并没有设置info_id的值jdbc.update(sql_save_myinfo, mainId,mainCreatuser,mainCreatime);//执行update语句，第一个参数sql语句，后面可以写任意多的参数return jdbc.update(sql_save_mymain, mainId,mainTitle,content,mainCreatime,mainCreatuser,mainCommend);}
}