后台管理中心跳转问题解决
1、管理中心框架页
<%@ page language="java" 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.min.css" /> <link rel="stylesheet" href="css/bootstrap-theme.min.css" /> <script src="js/jquery.min.js"></script> <script src="js/bootstrap.min.js"></script> </head> <body> <header class="row" style="padding: 20px 30px;background-color:#245580;"> <div class="col-xs-7"> <h1 style="color: #FFFFFF;">XXX网 <small>后台管理</small> </h1> </div> <div class="col-xs-3"> <div class="text-right" style="margin-top: 40px;color: #FFFFFF;"> <p>管理员</p> </div> </div> <div class="col-xs-2"> <div style="margin-top: 40px;"> <a>退出</a> </div> </div> </header> <div style="background-color: #999999; 100%;height: 1px;margin: 10px 0px;"></div>
<div class="row"> <aside class="col-xs-3" > <ul class="list-group">
<li class="list-group-item" > <button type="button" class="btn btn-primary btn-block btn-lg" data-toggle="collapse" data-target="#shangpin"> 商品管理 </button> <div > <div class="btn-group-vertical btn-block" > <button type="button" onclick="$('#content').load('toAnniu01');" class="btn btn-primary btn-block" style="margin-top: 6px;border-bottom:#5BC0DE 2px solid;">按钮 1</button> <button type="button" onclick="$('#content').load('toAnniu02');" class="btn btn-primary btn-block" style="margin-top: 6px;border-bottom:#5BC0DE 2px solid;">按钮 2</button> </div> </div> </li>
<li class="list-group-item" > <button type="button" class="btn btn-primary btn-block btn-lg" data-toggle="collapse" data-target="#leibie"> 类别管理 </button> <div > <div class="btn-group-vertical btn-block" > <button type="button" onclick="$('#content').load('toAddCategory');" class="btn btn-primary btn-block" style="margin-top: 6px;border-bottom:#5BC0DE 2px solid;">新增分类</button> <button type="button" onclick="$('#content').load('toListCategory');" class="btn btn-primary btn-block" style="margin-top: 6px;border-bottom:#5BC0DE 2px solid;">分类列表</button> </div> </div> </li>
<li class="list-group-item" > <button type="button" class="btn btn-primary btn-block btn-lg" data-toggle="collapse" data-target="#cangku"> 仓库管理 </button> <div > <div class="btn-group-vertical btn-block" > <button type="button" class="btn btn-primary btn-block" style="margin-top: 6px;border-bottom:#5BC0DE 2px solid;">按钮 1</button> <button type="button" class="btn btn-primary btn-block" style="margin-top: 6px;border-bottom:#5BC0DE 2px solid;">按钮 2</button> </div> </div> </li>
<li class="list-group-item" > <button type="button" class="btn btn-primary btn-block btn-lg" data-toggle="collapse" data-target="#tongji"> 查询统计 </button> <div > <div class="btn-group-vertical btn-block" > <button type="button" class="btn btn-primary btn-block" style="margin-top: 6px;border-bottom:#5BC0DE 2px solid;">按钮 1</button> <button type="button" class="btn btn-primary btn-block" style="margin-top: 6px;border-bottom:#5BC0DE 2px solid;">按钮 2</button> </div> </div> </li>
<li class="list-group-item" > <button type="button" class="btn btn-primary btn-block btn-lg" data-toggle="collapse" data-target="#xitong"> 系统管理 </button> <div > <div class="btn-group-vertical btn-block" > <button type="button" class="btn btn-primary btn-block" style="margin-top: 6px;border-bottom:#5BC0DE 2px solid;">按钮 1</button> <button type="button" class="btn btn-primary btn-block" style="margin-top: 6px;border-bottom:#5BC0DE 2px solid;">按钮 2</button> </div> </div> </li> </ul>
<img src="images/logo.png" class="img-responsive" alt="Cinque Terre"> </aside> <article class="col-xs-8 panel panel-default"> <div > </div> </article> </div> <div style="background-color: #999999; 100%;height: 1px;"></div> <footer class="container"> <div class="row"> <div class="col-md-12" style="padding: 20px;"> <h4 class="text-muted">Copyright © XXXX有限公司</h4> </div> </div> </footer> </body> </html>
2、框架内页
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<h3>新增分类</h3>
<form >
<div class="form-group">
<div class="input-group ">
<span class="input-group-addon">分类名称</span> <input type="text"
class="form-control"
value="${category.cat_name}" placeholder="输入类别名称" required>
</div>
</div>
<div class="form-group">
<div class="input-group">
<span class="input-group-addon">分类描述</span>
<textarea class="form-control" rows="3" name="cat_desc" required>${category.cat_desc}</textarea>
</div>
</div>
<button type="submit" class="btn btn-default">提交</button>
<font size="4" color="red" style="margin-right: 30px">${message}</font>
</form>
<script>
function addCategory() {
$.ajax({
url : "addCategory",
type : "post",
data : $('#listForm').serialize(),
success : function(result) {
$("#content").empty();
$("#content").html(result);
}
});
}
</script>
3、后台java代码SpringMVC
/** * 商品分类控制器 */ @Controller public class CategoryController { // 注入categoryMapper接口 @Autowired private CategoryMapper categoryMapper; // 跳转到 新增分类 页面 @RequestMapping("toAddCategory") public String toAddCategory() { return "admin/add_cat"; } @RequestMapping("addCategory") public String addCategory(Category category, Model model) { categoryMapper.addCategory(category); model.addAttribute("category", category); model.addAttribute("message", "新增成功!"); return "admin/add_cat"; } }