Jqgrid+Spring实现的增删改查（一）

最新推荐文章于 2024-04-30 19:40:07 发布
置顶 最新推荐文章于 2024-04-30 19:40:07 发布
阅读量1.1w 收藏 14
点赞数 6
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/kakaxi_77/article/details/51079050
版权

最近基于之前jqgrid+struts的基础上，做了一个jqgrid+spring的例子，大家请上眼。

零：

工程项目图：


一 View

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ include file="/resources/common/include/header.jsp" %>
    
<!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>jqgrid demo</title>
<!-- JQuery CSS -->
<link rel="stylesheet" href="${basePath}/resources/plugin/jquery-ui-themes-1.8.14/themes/redmond/jquery-ui.css" type="text/css" />
<!-- jqGrid CSS -->
<link rel="stylesheet" href="${basePath}/resources/plugin/jqGrid-4.5.4/css/ui.jqgrid.css" type="text/css" />
<!-- The actual JQuery code -->
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js" ></script>
<!-- The JQuery UI code -->
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<!-- The jqGrid language file code-->
<script type="text/javascript" src="${basePath}/resources/plugin/jqGrid-4.5.4/js/i18n/grid.locale-cn.js"></script>
<!-- The atual jqGrid code -->
<script type="text/javascript" src="${basePath}/resources/plugin/jqGrid-4.5.4/js/jquery.jqGrid.src.js"></script>

<script type="text/javascript">
$(function(){
	$("#gridTable").jqGrid({
	 	   url: "${basePath}/itCrud/list",
        datatype: "json",
        mtype : "post",
        height: 250,
        colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'],
        colModel:[
             		{name:'id',index:'id', width:55, editable:true, editoptions:{readonly:true}, sorttype:'int'},
                		{name:'invdate',index:'invdate', width:90, editable:true},
                		{name:'name',index:'name asc, invdate', width:100,editable:true},
                		{name:'amount',index:'amount', width:80, align:"right",editable:true,editrules:{number:true},sorttype:'number',formatter:'number'},
                		{name:'tax',index:'tax', width:80, align:"right",editable:true,editrules:{number:true},sorttype:'number',formatter:'number'},
                		{name:'total',index:'total', width:80,align:"right",editable:true,editrules:{number:true},sorttype:'number',formatter:'number'},
                		{name:'note',index:'note', width:150, sortable:false,editable:true}
                	],
        sortname:'id',
        sortorder:'asc',
        /*editurl: 'server.php', */
        viewrecords:true,
        rowNum:10,
        rowList:[10,20,30],
        prmNames : {  
            search : "search"  
        },
        jsonReader : {  
            root : "rows",
            page: "page",
            total: "total",
            records : "records", 
            repeatitems : false
        },
        pager:"#gridPager",
        caption: "jqgrid CRUD demo",
        hidegrid : false
	});
	
	$('#gridTable').jqGrid('navGrid','#gridPager',{
		   refresh:true, 
		   edit:true,
		   add:true,
		   del:true,
		   search:false,
		   addfunc:openDialog4Adding,
		   editfunc:openDialog4Updating,
		   delfunc:openDialog4Deleting
	   });
	
	//配置对话框
   $("#consoleDlg").dialog({
	   autoOpen:false,
	   modal:true      //设置对话框为模态对话框

   });
	
});

var openDialog4Adding = function() {
    var consoleDlg = $("#consoleDlg");    
//    var dialogButtonPanel = consoleDlg.siblings(".ui-dialog-buttonpane");    
    consoleDlg.find("input").removeAttr("disabled").val("");    
//    dialogButtonPanel.find("button:not(:contains('取消'))").hide();    
//    dialogButtonPanel.find("button:contains('新增')").show();    
    consoleDlg.dialog({
    	title:"新增",
    	resizable:false,
 	    width:480,
 	    buttons:{
 		   "取消":function(){
 			   $("#consoleDlg").dialog("close");
 		   },
 		   "新增":addItem
 	   }
    	});
    consoleDlg.dialog("open");
};

var openDialog4Updating = function() {  
	   var consoleDlg = $("#consoleDlg");    
	//   var dialogButtonPanel = consoleDlg.siblings(".ui-dialog-buttonpane");    
	   consoleDlg.find("input").removeAttr("disabled");    
	/*    dialogButtonPanel.find("button:not(:contains('取消'))").hide();    
	   dialogButtonPanel.find("button:contains('修改')").show();    */ 
	   
	   consoleDlg.dialog({
	   	title:"修改",
	   	resizable:false,
		    width:480,
		    buttons:{
			   "取消":function(){
				   $("#consoleDlg").dialog("close");
			   },
			   "修改":editItem
		   }
	   	});
	   
	   loadSelectedRowData();
	   consoleDlg.dialog("open");
	   
	};

var openDialog4Deleting = function() {    
	   var consoleDlg = $("#consoleDlg");    
	//   var dialogButtonPanel = consoleDlg.siblings(".ui-dialog-buttonpane");    
	   consoleDlg.find("input").attr("disabled", true);
	   /* 
	   dialogButtonPanel.find("button:not(:contains('取消'))").hide();    
	   dialogButtonPanel.find("button:contains('删除')").show();    
	   consoleDlg.dialog("option", "title", "delete record");
	    */
	    
	    consoleDlg.dialog({
	       	title:"删除",
	       	resizable:false,
	    	    width:480,
	    	    buttons:{
	    		   "取消":function(){
	    			   $("#consoleDlg").dialog("close");
	    		   },
	    		   "删除":deleteItem
	    	   }
	       	});
	   loadSelectedRowData();
	   consoleDlg.dialog("open");
	};

var loadSelectedRowData = function(){
	//2016-03-18 当前选中的行
	var selectedRowId = $("#gridTable").jqGrid("getGridParam", "selrow");
	//获得当前行各项属性
	var rowData = $("#gridTable").jqGrid("getRowData",selectedRowId);
		
	if (!selectedRowId) {  
        alert("请先选择需要编辑的行!");    
        return false;
    } else {
    	var consoleDlg = $("#consoleDlg");  
        
        consoleDlg.find("#selectId").val(rowData.id);    
        consoleDlg.find("#invdate").val(rowData.invdate);    
        consoleDlg.find("#name").val(rowData.name);
        consoleDlg.find("#amount").val(rowData.amount);
        consoleDlg.find("#tax").val(rowData.tax);    
        consoleDlg.find("#total").val(rowData.total);    
        consoleDlg.find("#note").val(rowData.note);
    	
    }
};

var openDialog4Deleting = function() {    
	   var consoleDlg = $("#consoleDlg");    
	//   var dialogButtonPanel = consoleDlg.siblings(".ui-dialog-buttonpane");    
	   consoleDlg.find("input").attr("disabled", true);
	   /* 
	   dialogButtonPanel.find("button:not(:contains('取消'))").hide();    
	   dialogButtonPanel.find("button:contains('删除')").show();    
	   consoleDlg.dialog("option", "title", "delete record");
	    */
	    
	    consoleDlg.dialog({
	       	title:"删除",
	       	resizable:false,
	    	    width:480,
	    	    buttons:{
	    		   "取消":function(){
	    			   $("#consoleDlg").dialog("close");
	    		   },
	    		   "删除":deleteItem
	    	   }
	       	});
	   loadSelectedRowData();
	   consoleDlg.dialog("open");
	};

var addItem = function(){
	var consoleDlg = $("#consoleDlg");
	
	var invdate = $.trim(consoleDlg.find("#invdate").val());  
    var name = $.trim(consoleDlg.find("#name").val());  
    var amount = $.trim(consoleDlg.find("#amount").val());  
    var tax = $.trim(consoleDlg.find("#tax").val());  
    var total = $.trim(consoleDlg.find("#total").val());  
    var note = $.trim(consoleDlg.find("#note").val());
    
    var params = {  
            "invdate" : invdate,  
            "name" : name,  
            "amount" : amount,  
            "tax" : tax,  
            "total" : total,  
            "note" : note
    };
    
    $.ajax({
    	url:"${basePath}/itCrud/add",
    	data : params,
    	dataType : "json",
    	cache : false,
        success : function(response, textStatus) {    
        	/* alert("id123-->" + response.id + "; message-->" + response.message); */
            if (response.message == true) {
                var dataRow = {  
                    id : response.id,    //从server端获得系统分配的id  
                    invdate : invdate,  
                    name : name,  
                    amount : amount,  
                    tax : tax,  
                    total : total,  
                    note : note  
                };
                  
                /*   
                var srcrowid = $("#gridTable").jqGrid("getGridParam",    
                        "selrow");     
                */  
                    
                $("#gridTable").jqGrid("addRowData",    
                		response.id, dataRow, "last");    //将新行插入到末尾  
                  
                consoleDlg.dialog("close");  
                alert("添加成功!");  
            }else{
                alert("添加失败!");
            }
        },
	    error : function(textStatus, e) {    
	        alert("系统ajax交互错误: " + textStatus);  
	    }
    });
};

var editItem = function(){
	var consoleDlg = $("#consoleDlg");
	var id = $.trim(consoleDlg.find("#selectId").val()); 
	var tempInvdate = $.trim(consoleDlg.find("#invdate").val());
	var invdate = tempInvdate.substring(0,10);
    var name = $.trim(consoleDlg.find("#name").val());  
    var amount = $.trim(consoleDlg.find("#amount").val());  
    var tax = $.trim(consoleDlg.find("#tax").val());  
    var total = $.trim(consoleDlg.find("#total").val());  
    var note = $.trim(consoleDlg.find("#note").val());
    
    var params = {  
    		"id" : id,
            "invdate" : invdate,  
            "name" : name,  
            "amount" : amount,  
            "tax" : tax,  
            "total" : total,  
            "note" : note
    };
    
    $.ajax({
    	url:"${basePath}/itCrud/edit",
    	data : params,
    	dataType : "json",
    	cache : false,
        success : function(response, textStatus) {    
//        	alert("id-->" + response.id + "; message-->" + response.message);
            if (response.message == true) {
                var dataRow = {  
                	selectId : id,
                    invdate : invdate,  
                    name : name,  
                    amount : amount,  
                    tax : tax,  
                    total : total,  
                    note : note  
                };
                
                /*   
                var srcrowid = $("#gridTable").jqGrid("getGridParam",    
                        "selrow");     
                */
                    
	            //将表格中对应记录更新一下
	            $("#gridTable").jqGrid("setRowData", id, dataRow);
                  
                consoleDlg.dialog("close");
                alert("修改成功!");
            }else{
                alert("修改失败!");
            }
        },
	    error : function(textStatus, e) {    
	        alert("系统ajax交互错误: " + textStatus);  
	    }
    });
}

var deleteItem = function(){
	var consoleDlg = $("#consoleDlg");
	var id = $.trim(consoleDlg.find("#selectId").val());
	var tempInvdate = $.trim(consoleDlg.find("#invdate").val());
	var invdate = tempInvdate.substring(0,10);
    var name = $.trim(consoleDlg.find("#name").val());  
    var amount = $.trim(consoleDlg.find("#amount").val());  
    var tax = $.trim(consoleDlg.find("#tax").val());  
    var total = $.trim(consoleDlg.find("#total").val());  
    var note = $.trim(consoleDlg.find("#note").val());
    
    var params = {  
    		"id" : id,
            "invdate" : invdate,  
            "name" : name,  
            "amount" : amount,  
            "tax" : tax,  
            "total" : total,  
            "note" : note
    };
    
    $.ajax({
    	url:"${basePath}/itCrud/delete",
    	data : params,
    	dataType : "json",
    	cache : false,
        success : function(response, textStatus) {    
//        	alert("id-->" + response.id + "; message-->" + response.message);
            if (response.message == true) {
                $("#gridTable").jqGrid("delRowData", id); 
                  
                consoleDlg.dialog("close");
                alert("删除成功!");
            }else{
                alert("删除失败!");
            }
        },
	    error : function(textStatus, e) {    
	        alert("系统ajax交互错误: " + textStatus);  
	    }
    });
	
}

</script>
</head>
<body>
	<table id="gridTable"></table>
    <div id="gridPager"></div>
    
    <div id="consoleDlg" style="display:none">
    	<form id="consoleForm">
    		<input type="hidden" id="selectId"/>
    		<table class="formTable">
				<tr>
					<th>Date</th>
					<td><input type="text" class="textField" id="invdate" name="invdate" />
					</td>
				</tr>
				<tr>
					<th>Client</th>
					<td><input type="text" class="textField" id="name" name="name" />
					</td>
				</tr>
				<tr>
					<th>Amount</th>
					<td><input type="text" class="textField" id="amount" name="amount" />
					</td>
				</tr>
				<tr>
					<th>Tax</th>
					<td><input type="text" class="textField" id="tax" name="tax" />
					</td>
				</tr>
				<tr>
					<th>Total</th>
					<td><input type="text" class="textField" id="total" name="total" />
					</td>
				</tr>
				<tr>
					<th>Notes</th>
					<td><input type="text" class="textField" id="note" name="note" />
					</td>
				</tr>
			</table>
    	</form>
    </div>
</body>
</html>


二 Model

package com.yangw.demo.pojo;

import com.yangw.demo.base.BasePojo;

public class Item extends BasePojo {
	
	private static final long serialVersionUID = 1L;
	private int id;
	private String invdate;
	private String name;
	private double amount;
	private double tax;
	private double total;
	private String note;
	
	public int getId() {
		return id;
	}
	public void setId(int id) {
		this.id = id;
	}
	public String getInvdate() {
		return invdate;
	}
	public void setInvdate(String invdate) {
		this.invdate = invdate;
	}
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	public double getAmount() {
		return amount;
	}
	public void setAmount(double amount) {
		this.amount = amount;
	}
	public double getTax() {
		return tax;
	}
	public void setTax(double tax) {
		this.tax = tax;
	}
	public double getTotal() {
		return total;
	}
	public void setTotal(double total) {
		this.total = total;
	}
	public String getNote() {
		return note;
	}
	public void setNote(String note) {
		this.note = note;
	}
	
	
}


三 Action

1 MediatorController

@Controller
@RequestMapping("/main")
public class MediatorController {
	@RequestMapping(value = "/items", method = RequestMethod.GET)
	public String getItemPage(){
		return "listView";
	}

}


2 JqDemoController 

@Controller
@RequestMapping(value={"/itCrud"})
public class JqDemoController extends BaseController {
	@Autowired
	private IItemService<Item, Integer> itemService;
	private List<Item> dataList;

	@RequestMapping(value={"/list"})
	public @ResponseBody DataResponse<Item> showList(
			Item item,
			@RequestParam(defaultValue="1",value="page") String page,
			@RequestParam(defaultValue="10",value="rows") String rows
			
			){
		int records;     //总记录数
		int totalPages;  //总页数
		int pageSize = StringUtils.isEmpty(rows) ? 10 : Integer.valueOf(rows);  //每页显示记录数
		int currPage = StringUtils.isEmpty(page) ? 1 : Integer.valueOf(page); //当前页码
		DataResponse<Item> response = new DataResponse<Item>();
		
		try {
			records = itemService.getEntityCount(item);
			totalPages = (records + pageSize -1) / pageSize;
			int start = pageSize * (currPage - 1) + 1;
			start = (start < 0) ? 0 : start;
			int stop = currPage * pageSize;
			item.setStart(start);
			item.setStop(stop);
			dataList = itemService.searchEntityList(item);
			
			response.setRecords(String.valueOf(records));
			response.setTotal(String.valueOf(totalPages));
			response.setPage(String.valueOf(currPage));
			response.setRows(dataList);
			
			
			
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		
		return response;
		
	}
	
	@RequestMapping(value={"/add"})
	public @ResponseBody ResultResponse add(Item item) throws Exception{
		ResultResponse response = new ResultResponse();
		try {
			System.out.println(item);
			itemService.insertEntity(item);
			
			response.setId(100);
			response.setMessage(true);
			
			
			
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
			response.setMessage(false);
			throw e;
		}
		
		return response;
		
	}
	
	@RequestMapping(value={"/edit"})
	public @ResponseBody ResultResponse edit(Item item) throws Exception{
		ResultResponse response = new ResultResponse();
		
		try {
			System.out.println(item);
			itemService.updateEntity(item);

			response.setMessage(true);
			
			
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
			response.setMessage(false);
			throw e;
		}
		
		return response;
	}
	
	@RequestMapping(value={"/delete"})
	public @ResponseBody ResultResponse delete(Item item) throws Exception{
		ResultResponse response = new ResultResponse();
		
		try {
			System.out.println(item);
			itemService.deleteEntity(item);

			response.setMessage(true);
			
			
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
			response.setMessage(false);
			throw e;
		}
		
		return response;
	}
	
	
	
	public List<Item> getDataList() {
		return dataList;
	}

	public void setDataList(List<Item> dataList) {
		this.dataList = dataList;
	}
}



四 Service

1 BaseService

public interface BaseService<Entity extends Serializable,Query extends Object> {
	/**
	 * 添加 实体
	 * sqlKey  insertEntity
	 * @param entity
	 * @return
	 * @throws Exception
	 */
	public Query insertEntity(Entity entity) throws Exception;
	
	/**
	 * 修改 实体
	 * sqlKey  updateEntity
	 * @param entity
	 * @return
	 * @throws Exception
	 */
	public int updateEntity(Entity entity) throws Exception;
	
	/**
	 * 删除 实体
	 * sqlKey  deleteEntityById
	 * @param entity
	 * @return
	 * @throws Exception
	 */
	public int deleteEntity(Entity entity) throws Exception;
	
	/**
	 * 根据实体参数查找单个数据
	 * sqlKey  searchEntity
	 * @param sqlMap
	 * @param query
	 * @return
	 * @throws Exception
	 */
	public Entity searchEntity(Entity entity)throws Exception;
	
	/**
	 * 查询 实体列表
	 * sqlKey  searchEntityList
	 * @param query
	 * @return
	 * @throws Exception
	 */
	public List<Entity> searchEntityList(Entity entity) throws Exception;
	
	/**
	 * 查询总数
	 * @param sqlMap
	 * @param query
	 * @throws Exception
	 */
	public int getEntityCount(Entity entity) throws Exception;
}

2 ItemServiceImpl 

@Service
public class ItemServiceImpl extends BaseServiceSupport<Item, Integer> implements IItemService<Item, Integer> {

	@Resource(name="itemDao") 
	private ItemDao itemDao;

}

五 Dao层

1 BaseDao

public interface BaseDao<Entity extends Serializable, Query extends Object> {
	/**
	 * 添加 实体
	 * @param entity
	 * @return
	 * @throws SQLException
	 */
	public Query insertEntity(Entity entity) throws SQLException;
	
	/**
	 * 修改 实体
	 * @param entity
	 * @return
	 * @throws SQLException
	 */
	public int updateEntity(Entity entity) throws SQLException;
	
	/**
	 * 删除 实体
	 * @param entity
	 * @return
	 * @throws SQLException
	 */
	public int deleteEntity(Entity entity) throws SQLException;
	
	/**
	 * 根据实体参数查找单个数据
	 * @param sqlMap
	 * @param query
	 * @return
	 * @throws SQLException
	 */
	public Entity searchEntity(Entity entity)throws SQLException;
	
	/**
	 * 查询 实体列表
	 * @param query
	 * @return
	 * @throws SQLException
	 */
	public List<Entity> searchEntityList(Entity entity) throws SQLException;
	
	/**
	 * 查询总数
	 * @param sqlMap
	 * @param query
	 * @throws SQLException
	 */
	public int getEntityCount(Entity entity) throws SQLException;
}


六 json

1 DataResponse

public class DataResponse<T> {
	private String page;     
	private String total;     
	private String records;   
	private List<T> rows;     
	private Map<String, Object> userdata;  
	
	public String getPage() {
		return page;
	}
	public void setPage(String page) {
		this.page = page;
	}
	public String getTotal() {
		return total;
	}
	public void setTotal(String total) {
		this.total = total;
	}
	public String getRecords() {
		return records;
	}
	public void setRecords(String records) {
		this.records = records;
	}
	public List<T> getRows() {
		return rows;
	}
	public void setRows(List<T> rows) {
		this.rows = rows;
	}
	public Map<String, Object> getUserdata() {
		return userdata;
	}
	public void setUserdata(Map<String, Object> userdata) {
		this.userdata = userdata;
	}
	
}


2 ResultResponse

public class ResultResponse {
	private boolean message;
	private Integer id;
	
	
	public boolean getMessage() {
		return message;
	}
	public void setMessage(boolean message) {
		this.message = message;
	}
	
	public Integer getId() {
		return id;
	}
	public void setId(Integer id) {
		this.id = id;
	}
	

}



七  配置文件

application.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xmlns:mvc="http://www.springframework.org/schema/mvc"
	xmlns:context="http://www.springframework.org/schema/context"
	xmlns:tx="http://www.springframework.org/schema/tx"
	xmlns:dubbo="http://code.alibabatech.com/schema/dubbo"
	xmlns:p="http://www.springframework.org/schema/p"
	xmlns:aop="http://www.springframework.org/schema/aop"
	xmlns:rabbit="http://www.springframework.org/schema/rabbit"
	xsi:schemaLocation="http://www.springframework.org/schema/mvc
		http://www.springframework.org/schema/mvc/spring-mvc-3.2.xsd
		http://www.springframework.org/schema/beans
		http://www.springframework.org/schema/beans/spring-beans-3.0.xsd
		http://www.springframework.org/schema/context 
		http://www.springframework.org/schema/context/spring-context-2.5.xsd
		http://www.springframework.org/schema/tx 
        http://www.springframework.org/schema/tx/spring-tx-3.0.xsd
        http://code.alibabatech.com/schema/dubbo 
		http://code.alibabatech.com/schema/dubbo/dubbo.xsd
		http://www.springframework.org/schema/aop
		http://www.springframework.org/schema/aop/spring-aop-2.5.xsd
		http://www.springframework.org/schema/rabbit
        http://www.springframework.org/schema/rabbit/spring-rabbit-1.0.xsd">
        
   <!-- 外部属性文件 -->
	<bean id="propertyConfigurer" class="org.springframework.beans.factory.config.PropertyPlaceholderConfigurer">
		<property name="locations">
			<list>
				<value>classpath:jdbc.properties</value>
			</list>
		</property>
	</bean>
	
	<!-- 扫描注解组件并且自动的注入 -->
	<context:component-scan base-package="com.XXX.demo" />
	
	<mvc:annotation-driven/>
	<!-- 配置静态资源访问目录 -->
	<mvc:resources mapping="/resources/**" location="/resources/"/>
	
	<!-- JSP视图解析器 -->
	<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
		<property name="viewClass" value="org.springframework.web.servlet.view.JstlView"/>
		<property name="prefix" value="/WEB-INF/views/"/>
		<property name="suffix" value=".jsp"/>
	</bean>

	<!-- JSON解析器 -->
	<bean class="org.springframework.web.servlet.mvc.method.annotation.RequestMappingHandlerAdapter">
		<property name="messageConverters">
			<list>
				<bean class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter" />
			</list>
		</property>
	</bean>
	
	<!-- 设置数据源 -->
	<bean id="dataSource" class="com.mchange.v2.c3p0.ComboPooledDataSource" destroy-method="close">
	    <property name="driverClass" value="${jdbc.driverClassName}"/>
	    <!-- 数据库参数配置 -->
	    <property name="jdbcUrl" value="${jdbc.url}"/>
        <property name="user" value="${jdbc.username}"/>
        <property name="password" value="${jdbc.password}"/>
		<property name="minPoolSize" value="${c3p0.miniPoolSize}"/>
		<property name="maxPoolSize" value="${c3p0.maxPoolSize}"/>
		<property name="initialPoolSize" value="${c3p0.initialPoolSize}"/>
		<property name="maxIdleTime" value="${c3p0.maxIdleTime}"/>
		<!-- 超时20秒 -->
		<property name="checkoutTimeout" value="${c3p0.checkoutTimeout}"/>
	</bean>
	
	<!-- 声明事务为注解驱动 -->
	<bean id="transactionManager" class="org.springframework.jdbc.datasource.DataSourceTransactionManager">
		<property name="dataSource" ref="dataSource" />
	</bean>
	
	<tx:advice id="txAdvice" transaction-manager="transactionManager">
        <tx:attributes>
            <tx:method name="*" read-only="false" rollback-for="Exception,RuntimeException" propagation="REQUIRED"/>
        </tx:attributes>
    </tx:advice>

    <aop:config proxy-target-class="true">
        <aop:pointcut id="serviceManage" expression="execution(* com.XXX.demo.service..*(..))"/>
        <aop:advisor pointcut-ref="serviceManage" advice-ref="txAdvice"/>
    </aop:config>
	 
    <bean id="sqlSessionFactory"  class="org.mybatis.spring.SqlSessionFactoryBean">
		<property name="dataSource" ref="dataSource" />
		<property name="configLocation" value="classpath:config/mybatis-config.xml" />
	</bean>
	
	<!-- Dao -->
	<bean id="itemDao" class="org.mybatis.spring.mapper.MapperFactoryBean">     
       <property name="mapperInterface" value="com.XXX.demo.dao.ItemDao" />
       <property name="sqlSessionFactory" ref="sqlSessionFactory" />
    </bean>
	
</beans>


八  页面效果


http://localhost:8080/springJqgrid/main/items


九 总结

由于;

1 缺少值类型校验

2 缺少页面查询条件输入

所以这个例子离实际的应用还有一段距离。


十 鸣谢

http://krams915.blogspot.com/2010/12/jqgrid-and-spring-3-mvc-integration.html
jqGrid and Spring 3 MVC Integration Tutorial

http://blog.csdn.net/kakaxi_77/article/details/46671249
Jqgrid+Struts2实现的增删改查

http://gongm-24.iteye.com/blog/1275430
JqGrid4.2实践-2-集成Spring MVC


---------------------------------------------------------------------------

*备注：

①值类型的校验应该使用custom_func，但我试过了，没起作用。目前原因未明。


--------------------------------------------------------------------------

【补充】

2017-05-18 补充了页面条件输入查询


说明：

①输入条件就是在页面加一个div

②js：

function searchReload(){
	var client = $("#client").val();
	var amount = $("#amount").val();
	
	$("#gridTable").jqGrid("setGridParam",
			{
				url:"${basePath}/itCrud/list",
				mtype: 'POST',
				postData:{
					client:client,
					amount:amount
					},
				datatype: "json"
			}).trigger("reloadGrid");
}

Description:
setGridParam：是jqGrid中的一个方法,表示设置grid的参数
url：这是grid的参数，表示数据的获取路径。grid中的数据就是通过这个url来获取的
postData：表示参数， 请求url时postData中的参数将会被发送到后台。
trigger： 这也是jqGrid的方法，该方法和setGridParam配合使用可以重新加载grid，$("").setGridParam().trigger("reloadGrid");

卡卡西CC
关注
  • 6
    点赞
  • 踩
  • 14
    收藏
    觉得还不错? 一键收藏
  • 13
    评论
jqgrid+struts2实现的增删改查
06-23
** jqGrid与Struts2结合实现增删改查 ** 在本项目中，jqGrid 与 Struts2 结合，实现了Web应用中的核心功能——增删改查。以下是关键步骤： 1. **配置 Struts2**：首先，需要在项目的 `struts.xml` 配置文件中设置...
PHP+jqGrid表格插件实现增删改查
12-21
要实现“PHP+jqGrid表格插件实现增删改查”，首先需要在HTML页面中引入jqGrid的CSS和JS文件，然后创建一个表格元素，定义相应的列名和ID。接着，使用jQuery初始化jqGrid，设置数据源（通常是PHP脚本返回的JSON或XML...
jqgrid增删改查
chenjunjun79的博客
07-23 8936
Form Editing编辑模式主要的方法有几个，分别是editGridRow——用来修改记录，editGridRow函数，传递一个'new'的参数就表示新增记录；viewGridRow查看记录详情；delGridRow删除记录。 这几个方法的调用方式，和jqGrid的其它函数调用方式一样。（可以采用new API的调用方式，把函数名称作为第一个参数来调用）需要注意的地方是，各个函数调用内容的o
在 springMVC 中整合表格插件 jqGrid
magicpenta的博客
12-03 3624
springMVC 快速整合 jqGrid 与 PageBounds
jqGrid用法汇总(全经典)
最新发布
男神的专栏
04-30 1491
rowid：当前行id；设置该列是否允许排序，在列的属性里设置sortable，同时对于不同的数据类型，也需要设置其相应的排序类型sorttype，类型有int/integer 整型,float/number/currency 浮点型，date 日期，text 文本，function 定义函数来实现自定的排序规则。统计时利用getCol方法，第一个参数为colMode的name值，第二个设为false，否则会返回一个数组而不是但一个数据，第三个是设置统计方式，有’sum’,‘avg’和’count’。
jqGrid应用SpringMVC以及分组汇总-不分页
java_Xianfeng的专栏
11-14 3349
js脚本 jQuery(function($) { $("#list").jqGrid({   url:"report_hz_json", datatype: "json", mtype: 'POST',  width : 950, height : 400,   colNames:['类型','序号','项目编号','项目名称','项目编号',"建设单位","成本投入","资
Jqgrid+spring mvc使用心得
alex_fung的博客
01-12 8218
前言：项目需要用到表格插件，本来觉得jquery datatable样式不错，后台发现没有继承checkbox等问题，最终转而使用jqgrid。 项目语言及架构：java spring mvc 1、jqgrid的创建： jar包地址：http://pan.baidu.com/s/1nutFNvz 密码：i7ka 2、html代码 3、js代码 3.
asp.net MVC5 + Bootstrap 增删改查分页(最新)
12-02
asp.net MVC5 + Bootstrap 增删改查分页(重点是里面的table及分页用法)。另外说一下项目用到了bootstrap-table,bootstrap-dialog,bootstrap-daterangepicker组件，很不错的几个组件
jqgrid 表格的增删改查以及modal弹出框
03-07
首先，让我们看看 jqGrid 的增删改查功能： **增加（Add）**：在 jqGrid 中添加新记录通常通过调用 `editGridRow` 方法实现，但在这个项目中，可能会使用一个 modal 弹出框来收集用户输入的数据。当用户点击“添加...
ASP.NET MVC JQGRID 增删改查 实例
03-01
要实现JQGrid的增删改查功能，我们需要在控制器中添加对应的操作，并在JavaScript中配置相应的参数。例如，添加新的员工可以通过POST请求发送数据到服务器，删除员工则需要一个DELETE请求，更新员工信息则使用PUT...
jqGrid与java简单的增删改查
11-09
jqGrid与java实现简单增删改查，java使用jdbc链接数据库，前后台使用servlet，界面还是使用html
jqgrid+struts2+ibatis增删改查
07-05
在"jqgrid+struts2"的组合中，通常会创建一个Struts2 Action，接收来自jqGrid的AJAX请求，处理增删改查操作，并返回更新后的数据。 再者，iBatis是一个轻量级的持久层框架，它将SQL语句与Java代码分离，提供灵活的...
jqgrid+jquery+servlet实现的一个智能交通后台系统
04-21
servlet与数据库紧密配合，实现了数据的增删改查，确保了系统的稳定运行。 系统功能丰富多样，包括： 1. **交通数据**：收集和统计各类交通数据，如车流量、拥堵情况等，为交通规划提供依据。 2. **实时记录**：...
jqgrid简单前后台增删改查异调用实例
09-13
本实例将详细介绍如何在前端使用jqGrid实现简单的增删改查操作，并通过C#作为后台处理数据。 **前后端交互** 1. **数据加载**：在前端，使用jqGrid的`url`参数指定后台数据源的URL，jqGrid会发送Ajax请求获取数据...
S2HH+jqGrip的用户增删改查完整示例
04-03
总的来说，"S2HH+jqGrip的用户增删改查完整示例"是一个综合性的教程，它展示了如何使用S2HH框架与jqGrip插件来构建一个功能齐全的用户管理系统，同时利用Oracle数据库存储和管理数据。这对于学习和实践Java Web开发...
JqGrid完整例子，springboot面试题及答案高级
m0_64205415的博客
11-16 308
index:‘sensortype’, width: 100, },{ name:‘unit’, index:‘unit’, width: 100, },{ name:‘highvalue’, index:‘highvalue’, width: 100, } ], sortname : “id”, sortorder : “desc”, viewrecords : true, shrinkToFit : true, width: 1645, height: 500, rowNum : 20, rowList
【JqGrid】JqGrid使用后台分页+查询条件+排序
热门推荐
每一名出色的架构师，必定是一位优秀程序员
11-30 1万+
最近做项目时要用到jqGrid,先学习了一下jqGrid的使用方法，现总结如下，先从基本的说起： 1、数据显示： jqGrid可以解析的数据有很多种，如xml、json等，在这个项目中主要用的就是json数据解析，JqGrid查询时和后台交互是很简单的，但是必须注意几个地方，废话少说，我直接上代码： JSP代码如下： <%@ page language="java" contentType
bootstrap jqgrid 某一列实现删除和修改
05-27
对于Bootstrap和JqGrid，它们是用于前端开发的框架和插件。关于如何实现删除和修改某一列，可以通过以下步骤实现： 1. 添加Bootstrap和JqGrid的CSS和JS文件到HTML页面中。 2. 在HTML页面中创建一个div元素，用于显示JqGrid的表格。 3. 使用ajax请求从后端获取数据，将数据填充到JqGrid的表格中。 4. 在JqGrid的参数中配置需要显示的列，并且设置列的类型、宽度、对齐方式、格式等属性。 5. 编写JqGrid的事件方法，如单击某一列实现删除和修改的功能。可以使用JqGrid提供的函数（如setCell）来实现对某一列数据的修改。 以上是简单的实现方式，具体要根据实际需求进行修改和调整。希望可以帮助您解决问题。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 13
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值