基於ssm框架的個人部落格（9）--部落格的管理（刪除，條件查詢）
阿新 • • 發佈：2019-01-26
前面已經將博類別的相關頁面與後臺實現，並且將部落格的一些管理實現了（刪除，條件查詢），最後我們就針對我這次部落格實現的內容做個大概的過程介紹（包括遇到的問題，我是如何碰壁的，如何解決）
1、最開始的時候部落格類別的datagrid，我是使用js實現出來的，然後嘗試使用easyui的另一種方法，就是使用（通過<table>建立資料表格標記。巢狀的< th >標記定義列的表。具體開APII），在這個基礎上，我開始實現接收後臺傳遞的json資料，由於不熟悉，百度了很多，參考了很多，但還是覺得沒有js實現好用，所以又換成了js實現datagrid。開發過程中的小問題我就不說了，就談談我實現datagrid部落格分類這列上碰的壁，因為，使用者不知道我們blogType的id指的是什麼意思，所以，必須，必須轉換成使用者能夠理解的blogTypeName，這種形式例如：”生活”，“工作“才是我們需要展示給使用者看的。所以就存在一個現實欄位資料前對資料進行處理，把“1”程式設計“生活”，在easyui datagrid中這個叫做formatter，具體自行查閱API。
我使用的ajax訪問後臺，獲取typeid對應typename，ajax回撥函式中的typename，在ajax中無法使用，這個困擾了我很久，最後的解決辦法是，使用jq的最基礎的ajax，將async :設定成false,必選是同步，才能使用ajax中的變數。在分頁查詢的過程中，出現一個問題就是，如何設計成點選查詢按鈕，將文字框中的值作為title的模糊查詢的使用的引數？這裡出現一個問題就是，如何將頁面中的值傳遞給後臺，我是使用改變datagrid中的url的值（在地址後新增？str="生"），然後出現一個問題就是亂碼，由於未找到合適的方法，最後使用
$('#dg').datagrid({ url: '${pageContext.request.contextPath}/admin/Selectmh'});
$("#dg").datagrid("load",{
str:str
});
來進行傳引數。經過測試，實現了傳參需求。
最後一個問題就是如何，如果合併兩個查詢（查詢全部、模糊查詢）？
我的解決方案是，在後臺使用mybatis逆向工程生成的example建立criteria 來新增條件，這樣的話就可以通過if語句來判斷何時需要模糊查詢。
TBlogExample example = new TBlogExample();
Criteria criteria = example.createCriteria();
if (str != null && str != "") {
criteria.andTitleLike("%" + str + "%");
}
其實中間走了很多彎路，說不清楚的頁面除錯與後臺的debug，這個的話需要朋友們自行聯絡
現在貼上頁面程式碼：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>部落格管理</title>
<%@include file="../common/head.jspf"%>
<script type="text/javascript">
$(function() {
//datagrid初始化
$('#dg').datagrid({
//請求資料的url
url : '${pageContext.request.contextPath}/admin/Selectmh',
//載入提示資訊
loadMsg : 'loading...',
//水平自動展開，如果設定此屬性，則不會有水平滾動條，演示凍結列時，該引數不要設定
fitColumns : true,
//資料多的時候不換行
nowrap : true,
//設定分頁
pagination : true,
//設定每頁顯示的記錄數，預設是10個
pageSize : 5,
//每頁顯示記錄數
pageList : [ 2, 5, 10, 15, 20 ],
//指定id為標識欄位，在刪除，更新的時候有用，如果配置此欄位，在翻頁時，換頁不會影響選中的項
idField : 'id',
//上方工具條 新增 修改 刪除 重新整理按鈕 '-'是分割符
toolbar : [
{
text: '標題：<input type="text" id="s_title"/>'
},'-',
{
iconCls : 'icon-search',
text : '查詢',
handler : function() {
str = $("#s_title").val();
$('#dg').datagrid({ url: '${pageContext.request.contextPath}/admin/Selectmh'});
$("#dg").datagrid("load",{
str:str
});
}
},'-',
{
iconCls : 'icon-edit',
text : '刪除',
handler : function() {
//獲取選中要刪除的行
var selectedRows = $("#dg").datagrid("getSelections");
//判斷是否有選擇的行
if(selectedRows.length == 0) {
$.messager.alert("系統提示", "請選擇要刪除的資料");
return;
}
//定義選中 選中id陣列
var idsStr = [];
//迴圈遍歷將選中行的id push進入陣列
for(var i = 0; i < selectedRows.length; i++) {
idsStr.push(selectedRows[i].id);
}
//將陣列安裝,連線成字串
var ids = idsStr.join(","); //1,2,3,4
//提示是否確認刪除
$.messager.confirm("系統提示", "<font color=red>您確定要刪除選中的"+selectedRows.length+"條資料麼？</font>", function(r) {
if(r) {
$.post("${pageContext.request.contextPath}/admin/deleteBlog",
{"ids": ids}, function(result){
if(result.status==400) {
$.messager.alert("系統提示", '該類別下有部落格，不能刪除!');
} else if(result.status==200) {
$.messager.alert("系統提示", "資料刪除成功！");
$("#dg").datagrid("reload");
} else {
$.messager.alert("系統提示", "資料刪除失敗！");
}
});
}
});
}
}, '-', {
iconCls : 'icon-reload',
text : '重新整理',
handler : function() {
$("#dg").datagrid("reload");
}
} ],
//同列屬性，但是這些列將會凍結在左側
frozenColumns : [ [ {
field : 'checkbox',
checkbox : true
},
{
field : 'id',
title : '編號',
width : 200
}
] ],
columns : [ [ {
field : 'title',
title : '標題',
width : 300
},
{
field : 'releasedate',
title : '發表日期',
width : 300
},
{
field : 'typeId',
title : '部落格類別',
width : 300,
formatter:function(value){
var typeId = value;
$.ajax({
type : "POST",
url : "${pageContext.request.contextPath}/admin/selectBlogType",
data : {
"typeId" : typeId
},
async : false, //核心啊 ，因為這個我調了很久，必選是同步，才能使用ajax中的變數
success : function(result) {
if (result.status == 200) {
str = result.data.typename;
}
}
});
if (str == null || str == "") {
return value;
}else{
return str;
}
}
}
] ],
});
});
</script>
</head>
<body>
<table id="dg"></table>
</body>
</html>先貼上後臺的程式碼：
BlogController.java
package com.lailai.controller;
import javax.servlet.http.HttpServletResponse;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import com.lailai.common.utils.EasyUIDataGridResult;
import com.lailai.common.utils.MyResult;
import com.lailai.entity.TBlog;
import com.lailai.service.BlogService;
@Controller
@RequestMapping("admin")
public class BlogController {
@Autowired
private BlogService blogService;
@RequestMapping("manageBlog")
public String gotoBlogMange() {
return "admin/manageBlog2";
}
// 新增或更新部落格
@RequestMapping("saveBlog")
@ResponseBody
public MyResult saveBlog(TBlog blog) {
Integer n;
if (blog.getId() == null) {
n = blogService.saveBlog(blog);
} else {
n = blogService.updateBlog(blog);
}
if (n > 0) {
return MyResult.ok();
}
return MyResult.build(400, "操作失敗");
}
// 刪除部落格
@RequestMapping("deleteBlog")
@ResponseBody
public MyResult deleteBlog(String ids, HttpServletResponse response) {
String[] idsArr = ids.split(",");
for (String id : idsArr) {
blogService.deleteBlog(new Integer(id));
}
return MyResult.ok();
}
// 通過id獲取部落格
@RequestMapping("getBlog")
@ResponseBody
public TBlog getById(Integer id) {
TBlog blog = blogService.getById(id);
return blog;
}
// 分頁查詢部落格
@RequestMapping("SelectAllBlog")
@ResponseBody
public EasyUIDataGridResult SelectAllBlog(int page, int rows) {
EasyUIDataGridResult allBlog = blogService.SelectAllBlog(page, rows);
return allBlog;
}
// 分頁模糊部落格
@RequestMapping("Selectmh")
@ResponseBody
public EasyUIDataGridResult Selectmh(String str,int page, int rows) {
EasyUIDataGridResult allBlog = blogService.Selectmh(str,page, rows);
return allBlog;
}
}BlogServiceImpl.java
package com.lailai.service.impl;
import java.util.List;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import com.github.pagehelper.PageHelper;
import com.github.pagehelper.PageInfo;
import com.lailai.common.utils.EasyUIDataGridResult;
import com.lailai.entity.TBlog;
import com.lailai.entity.TBlogExample;
import com.lailai.entity.TBlogExample.Criteria;
import com.lailai.mapper.TBlogMapper;
import com.lailai.service.BlogService;
@Service
public class BlogServiceImpl implements BlogService {
@Autowired
private TBlogMapper blogMapper;
/**
* 儲存部落格
*/
public Integer saveBlog(TBlog tBlogWithBLOBs) {
return blogMapper.insert(tBlogWithBLOBs);
}
/**
* 修改部落格
*/
public Integer updateBlog(TBlog blog) {
return blogMapper.updateByPrimaryKeyWithBLOBs(blog);
}
/**
* 刪除部落格
*/
public Integer deleteBlog(Integer id) {
return blogMapper.deleteByPrimaryKey(id);
}
/**
* 按ID查詢部落格
*/
public TBlog getById(Integer id) {
TBlogExample example = new TBlogExample();
Criteria criteria = example.createCriteria();
criteria.andIdEqualTo(id);
List<TBlog> list = blogMapper.selectByExampleWithBLOBs(example);
return list.get(0);
}
/**
* 查詢所有部落格（與下面的模糊查詢合併了）
*/
public EasyUIDataGridResult SelectAllBlog(int pageNum, int pageSize) {
return null;
/*
** 設定分頁資訊 PageHelper.startPage(pageNum, pageSize); TBlogExample example
* = new TBlogExample(); Criteria criteria = example.createCriteria();
* List<TBlog> list = blogMapper.selectByExampleWithBLOBs(example); //
* 建立一個返回值物件 EasyUIDataGridResult result = new EasyUIDataGridResult();
* result.setRows(list); // 取分頁結果 PageInfo<TBlog> pageInfo = new
* PageInfo<>(list); // 取總記錄數 long total = pageInfo.getTotal();
* result.setTotal(total); return result;
*/ }
public EasyUIDataGridResult Selectmh(String str, int pageNum, int pageSize) {
// 設定分頁資訊
PageHelper.startPage(pageNum, pageSize);
TBlogExample example = new TBlogExample();
Criteria criteria = example.createCriteria();
if (str != null && str != "") {
criteria.andTitleLike("%" + str + "%");
}
List<TBlog> list = blogMapper.selectByExampleWithBLOBs(example);
// 建立一個返回值物件
EasyUIDataGridResult result = new EasyUIDataGridResult();
result.setRows(list);
// 取分頁結果
PageInfo<TBlog> pageInfo = new PageInfo<>(list);
// 取總記錄數
long total = pageInfo.getTotal();
result.setTotal(total);
return result;
}
}
到現在為止，我們已經實現了部落格管理的基本操作了，希望喜歡我文章的朋友們能夠有所收穫，要是能夠跟著聯絡的話，應該對ssm、easyui有更深的理解。文章還在編輯ing......希望大家繼續關注我。
彩蛋：搞到現在還沒開始實現部落格的編輯，在下一篇中就開始使用富文字了，大家關注哦！