`

SpringMVC:整合JQUERY与JSON

阅读更多
参考资料
1 Spring3 MVC 笔记(二) —json+rest优化
http://7454103.iteye.com/?show_full=true
2 jquery 遍历对象、数组、集合
http://blog.sina.com.cn/s/blog_5db0dfe40100hay7.html
3 jquery 遍历 map(callback)
http://kaxu.iteye.com/blog/308367
4  Jquery的map遍历
http://blog.csdn.net/niu870781892/archive/2010/04/13/5479850.aspx
5 Spring mvc3的ajax
http://xace.iteye.com/blog/731263
6 Spring MVC 学习笔记 九 json格式的输入和输出
http://starscream.iteye.com/blog/1067606

在SpringMVC中使用JSON必须注意二点
1 必须包含:jackson的jar包,我使用的是: jackson-all-1.8.1.jar,
可在官网:http://mvnrepository.com/artifact/org.codehaus.jackson中去下载
2 在springmvc.xml配置文件中必配置: <mvc:annotation-driven/>
3 jquery.json-*.*.min.js
实现功能: 从后台获取对象,List,Map在前台显示,前台提交JSON数据格式到后台并且返回
一 工程相关图片
1 工程图片

2 效果图片

二 具体代码
1 springmvc.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:p="http://www.springframework.org/schema/p"
	xmlns:context="http://www.springframework.org/schema/context"
	xmlns:mvc="http://www.springframework.org/schema/mvc"
	xsi:schemaLocation="
        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-3.0.xsd
        http://www.springframework.org/schema/mvc    
        http://www.springframework.org/schema/mvc/spring-mvc-3.0.xsd">
	<!-- 
		自动搜索@Controller标注的类
		用于指明系统从哪个路径下寻找controller,然后提前初始化这些对象。
	-->
	<context:component-scan base-package="com.liuzd.sj.web" />	
	<mvc:annotation-driven/>   		

	<!--  ③:对模型视图名称的解析,即在模型视图名称添加前后缀 -->
	<bean
		class="org.springframework.web.servlet.view.InternalResourceViewResolver"
		p:prefix="/WEB-INF/jsp/" p:suffix=".jsp" />
    <!-- 
	<bean
		class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter">
		<property name="messageConverters">
			<list>
				<bean
					class="org.springframework.http.converter.StringHttpMessageConverter">
					<property name="supportedMediaTypes">
						<list>
							<value>text/html;charset=UTF-8</value>
						</list>
					</property>
				</bean>
			</list>
		</property>
	</bean>
	<bean id="mappingJacksonHttpMessageConverter"
		class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter" />
		
	-->
</beans>

2 springmvc与jquery整合页面
<%@ page language="java" contentType="text/html; charset=UTF-8"  pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!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">
	<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery/jquery-1.4.4.min.js"></script>	
	<title>Spring MVC - jQuery 整合教程</title>
</head>
<body>
<h3>Spring MVC - jQuery 整合教程</h3>
<h4>AJAX version</h4>
<p>Demo 1 计算并返回值</p>
<div style="border: 1px solid #ccc; width: 250px;">
	Add Two Numbers: <br/>
	<input id="inputNumber1" type="text" size="5"> +
	<input id="inputNumber2" type="text" size="9">
	<input type="submit" id="demo1" value="Add" /> <br/>
	Sum: <br>
	<span id="sum">(Result will be shown here)</span>
</div>
<hr><br>
<p>Demo 2 获取一个对象</p>
<div style="border: 1px solid #ccc; width: 250px;">
	<select id="userId">		
		<c:forEach var="index" begin="1" end="5" step="1">
			<option value="${index}">${index}</option>
		</c:forEach>
	</select>
	<input type="submit" id="demo2" value="Get" /> <br/>	
	<span id="info">(Result will be shown here)</span>
</div>
<hr><br>
<p>Demo 3 返回List集合对象</p>
<div style="border: 1px solid #ccc; width: 250px;">	
	<input type="submit" id="demo3" value="Get List User" /> <br/>	
	<span id="listInfo">(Result will be shown here)</span>
</div>
<hr><br>
<p>Demo 4 返回Map集合对象</p>
<div style="border: 1px solid #ccc; width: 250px;">	
	<input type="submit" id="demo4" value="Get Map User" /> <br/>	
	<span id="mapInfo">(Result will be shown here)</span>
</div>
<hr><br>
<a href="${pageContext.request.contextPath}/index.jsp">返回</a>
<hr><br>
<script type="text/javascript"> 
$(function() {
	 $("#demo1").click(function(){
		$.post("${pageContext.request.contextPath}/main/ajax/add.do",
					{inputNumber1:  $("#inputNumber1").val(),
				  	 inputNumber2:  $("#inputNumber2").val() 
				  	},
					function(data){							  													
						$("#sum").replaceWith('<span id="sum">'+ data + '</span>');							   
					});
	 });
	 
	  $("#demo2").click(function(){
	  	var userId = $("#userId").val();
		$.post("${pageContext.request.contextPath}/main/ajax/getUser/"+userId+".do",
					null,
					function(data){		
						var info = "姓名: " + data.name+",年龄: " + data.age + ",地址: " + data.address + ",性别: " + (data.sex == 1 ? "男" : "女")+",密码: " + data.password;					  													
						$("#info").html(info);							   
					});
	 });
	 
	  $("#demo3").click(function(){	  
		$.post("${pageContext.request.contextPath}/main/ajax/userList.do",
					null,
					function(data){	
							/*							
						    var info = '';	
						    var leng = data.length;						    						
							for(var i=0;i<leng;i++){
							  info += data[i].id + "," + data[i].name + "," + data[i].sex + "," + data[i].password + "," + data[i].address + "," + data[i].age+"<br>";
							}						  													
						    $("#listInfo").html(info);	*/
						    
						    var info = '';	
						     $.each(data,function(index,entity) { 
						       info += "姓名: " + entity.name+",年龄: " + entity.age + ",地址: " + entity.address + ",性别: " + (entity.sex == 1 ? "男" : "女")+",密码: " + entity.password+"<br>";   
						     });
						     $("#listInfo").html(info);
						      
						  						    				   
					});
	 });	 
	 
	 $("#demo4").click(function(){	  
		$.post("${pageContext.request.contextPath}/main/ajax/userMap.do",
					null,
					function(map){	
					     var info = '';	
					     $.each(map,function(key,values) { 
					           info += "key="+key+"<br>";
					           $(values).each(function(){      
							       info += "姓名: " + this.name+",年龄: " + this.age + ",地址: " + this.address + ",性别: " + (this.sex == 1 ? "男" : "女")+",密码: " + this.password+"<br>";
							    });    
					             
					     });
					     $("#mapInfo").html(info);				   
					});
	 });	 
	 
	 
	 
});
</script>
</body>
</html>

3 springmvc与jquery整合后台代码
package com.liuzd.sj.web;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;

import com.liuzd.sj.entity.User;

@Controller
@RequestMapping("/main/ajax")
public class AjaxController {

	/**
	 * 根据映射跳转到指定的页面
	 */
	@RequestMapping(value = "/add", method = RequestMethod.GET)
	public String getAjaxAddPage() {
		// 解析 /WEB-INF/jsp/ajax-add-page.jsp
		return "ajax-add-page";
	}

	/**	 
     * 提交表单并进行运算.
	 */
	@RequestMapping(value = "/add", method = RequestMethod.POST)
	public @ResponseBody Integer add(
			@RequestParam(value = "inputNumber1", required = true)Integer inputNumber1,
			@RequestParam(value = "inputNumber2", required = true)Integer inputNumber2) {
		// 实现运算
		Integer sum = inputNumber1 + inputNumber2;
		System.out.println("sum: " + sum);
		// @ResponseBody 会自动的将返回值转换成JSON格式
		// 但是你必须添加jackson的jar包!!!
		return sum;
	}	

	@RequestMapping(value = "/getUser/{userId}", method = RequestMethod.POST)
	public @ResponseBody User getUser(@PathVariable("userId")String  userId) {
		System.out.println("根据ID获取用户对象: " + userId);		
		Map<String,User> users = new HashMap<String,User>();
		users.put("1", new User("123456", "李逵", "123", "成都市", "1", 23));
		users.put("2", new User("565676", "张三", "123", "北京市", "2", 53));
		users.put("3", new User("325566", "李四", "123", "河南省", "2", 93));
		users.put("4", new User("989654", "刘邦", "123", "蒙古包", "1", 13));
		users.put("5", new User("234444", "王熙凤", "123", "成都市", "1", 43));		
		return users.get(userId);
	}

	@RequestMapping(value = "/userList", method = RequestMethod.POST)
	public @ResponseBody
	List<User> getUsers() {		
		List<User> users = new ArrayList<User>();
		users.add(new User("123456", "李逵", "123", "成都市", "1", 23));
		users.add(new User("123457", "李四", "124", "北京市", "2", 53));
		users.add(new User("123458", "李三", "125", "河南市", "0", 73));
		users.add(new User("123459", "李五", "126", "大路市", "3", 93));
		return users;
	}
	
	@RequestMapping(value = "/userMap", method = RequestMethod.POST)
	public @ResponseBody Map<String,User> getUserMap() {		
		Map<String,User> users = new HashMap<String,User>();
		users.put("1", new User("123456", "李逵", "123", "成都市", "1", 23));
		users.put("2",new User("123457", "李四", "124", "北京市", "2", 53));
		users.put("3",new User("123458", "李三", "125", "河南市", "0", 73));
		users.put("4",new User("123459", "李五", "126", "大路市", "3", 93));
		return users;
	}
}

4 sprinmcv与jquery,json整合页面
<%@ page language="java" contentType="text/html; charset=UTF-8"   pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!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>Spring MVC</title>   
	<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery/jquery-1.4.4.min.js"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery/jquery.json-2.2.min.js"></script>   
	<script type="text/javascript">		
		   
		$(document).ready(function(){   
		
		      jQuery.ajax( {   
		        type : 'GET',   
		        contentType : 'application/json',   
		        url : '${pageContext.request.contextPath}/user/list.do',   
		        dataType : 'json',   
		        success : function(data) {   
		          if (data && data.success == "true") {   
		            $('#info').html("共" + data.total + "条数据。<br/>");   
		            $.each(data.data, function(i, item) {   
		              $('#info').append("编号:" + item.id + ",姓名:" + item.name + ",年龄:" + item.age+"<br>");   
		            });   
		          }   
		        },   
		        error : function() {   
		          alert("error")   
		        }   
		      });  
		       
		      $("#submit").click(function() {   
		        var jsonuserinfo = $.toJSON($('#form').serializeObject());   
		        alert(jsonuserinfo);   
		        jQuery.ajax( {   
		          type : 'POST',   
		          contentType : 'application/json',   
		          url : '${pageContext.request.contextPath}/user/add.do',   
		          data : jsonuserinfo,   
		          dataType : 'json',   
		          success : function(data) {   
		             if (data && data.success == "true") {   
			            $('#info').html("共" + data.total + "条数据。<br/>");   
			            $.each(data.data, function(i, item) {   
			              $('#info').append("编号:" + item.id + ",姓名:" + item.name + ",年龄:" + item.age+"<br>");   
			            });
			             alert("新增成功!");      
			          }   		           
		          },   
		          error : function(data) {   
		            alert("error")   
		          }   
		        });   
		      });   
		    });  
		    
		    //将一个表单的数据返回成JSON对象   
			$.fn.serializeObject = function() {   
			  var o = {};   
			  var a = this.serializeArray();   
			  $.each(a, function() {   
			    if (o[this.name]) {   
			      if (!o[this.name].push) {   
			        o[this.name] = [ o[this.name] ];   
			      }   
			      o[this.name].push(this.value || '');   
			    } else {   
			      o[this.name] = this.value || '';   
			    }   
			  });   
			  return o;   
			};   
	</script>
</head>   
<body>   
<div id="info"></div>   
<form action="add" method="post" id="form">   
编号:<input type="text" name="id"/>   
姓名:<input type="text" name="name"/>   
年龄:<input type="text" name="age"/> 
性别: <select name="sex">
          	<option value="1">男</option>
          	<option value="2">女</option>
     </select>
 密码: <input name="password">      
 地址:<input name="address"/>
          
<input type="button" value="提交" id="submit"/>   
</form>   
</body>   
</html>  

5 sprinmcv与jquery,json后台代码
package com.liuzd.sj.web;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import org.springframework.http.HttpEntity;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.bind.annotation.SessionAttributes;

import com.liuzd.sj.entity.User;

@Controller
@RequestMapping("/user")
@SessionAttributes("users")
public class DemoController {

	@RequestMapping(value = "/list", method = RequestMethod.GET)
	@ModelAttribute("users")
	@ResponseBody
	public Map<String, Object> getUserMaps() {

		List<User> list = new ArrayList<User>();
		User um = new User();
		um.setId("1");
		um.setName("sss");
		um.setAge(66);
		list.add(um);
		
		um = new User();
		um.setId("2");
		um.setName("aaa");
		um.setAge(44);
		list.add(um);
		
		Map<String, Object> modelMap = new HashMap<String, Object>();
		modelMap.put("total", list.size());
		modelMap.put("data", list);
		modelMap.put("success", "true");
		return modelMap;
	}

	  @RequestMapping(value = "/add", method = RequestMethod.POST)   
	  @ResponseBody   
	  //二种方式: A HttpEntity<User>  B使用注解 @ResponseBody
	  public Map<String, Object> addUser(HttpEntity<User> model,javax.servlet.http.HttpServletRequest request) {   
		System.out.println("user: " + model.getBody());
	
		Map<String, Object> map = (Map)request.getSession().getAttribute("users");
		if(null == map){
			map = getUserMaps();
		}
		List<User> list = (List<User>)map.get("data");
		list.add(model.getBody());
		map.put("total", list.size());
		map.put("data", list);
		request.getSession().setAttribute("users",map);
		return map;
	}


	@RequestMapping("/ajaxPage")
	public String ajaxAddPage() {
		return "ajax-add-page2";
	}
}

6 web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee 
	http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">	
	
	<context-param>
	   <param-name>log4jConfigLocation</param-name>
	   <param-value>/WEB-INF/classes/log4j.properties</param-value>
	</context-param> 
	
	 <context-param>
	  <param-name>log4jRefreshInterval</param-name>
	  <param-value>60000</param-value>
	 </context-param>	
	 <context-param>
		<param-name>log4jExposeWebAppRoot</param-name>
		<param-value>false</param-value>
	</context-param>	
	
	<listener>
	   <listener-class>
			org.springframework.web.util.Log4jConfigListener
	   </listener-class>
	</listener> 

	<filter>
		<filter-name>encodingFilter</filter-name>
		<filter-class>
			org.springframework.web.filter.CharacterEncodingFilter
		</filter-class>
		<init-param>
			<param-name>encoding</param-name>
			<param-value>UTF-8</param-value>
		</init-param>
		<init-param>   
            <param-name>forceEncoding</param-name>   
            <param-value>false</param-value>   
        </init-param>  
	</filter>

	<filter-mapping>
		<filter-name>encodingFilter</filter-name>
		<url-pattern>*.do</url-pattern>
	</filter-mapping>
	
	<filter-mapping>
		<filter-name>encodingFilter</filter-name>
		<url-pattern>*.jsp</url-pattern>
	</filter-mapping>

	<servlet>
		<servlet-name>springmvc</servlet-name>
		<servlet-class>
			org.springframework.web.servlet.DispatcherServlet
		</servlet-class>		
		<init-param>
			<param-name>contextConfigLocation</param-name>							 
			 <param-value>classpath:springmvc.xml</param-value>
		</init-param>	
		<load-on-startup>1</load-on-startup>
	</servlet>

	<servlet-mapping>
		<servlet-name>springmvc</servlet-name>
		<url-pattern>*.do</url-pattern>
	</servlet-mapping>
	
	 
	<welcome-file-list>
		<welcome-file>index.jsp</welcome-file>
	</welcome-file-list>

</web-app>

7 附件为工程原件,只包含jackson-all-1.8.1.jar,其它jar可在相关页面下载
  • 大小: 53.7 KB
  • 大小: 40.4 KB
分享到:
评论
包在哪里啊
15 楼 chensl 2014-12-03  
找了许久,终于找到一个可以运行的,不乱码的,晕……
谢了
14 楼 进击的巨人 2014-03-07  
都写了<mvc:annotation-driven/> ,又写了AnnotationMethodHandlerAdapter,这样有没有关系?
13 楼 cuitengfei2006x 2013-11-25  
Demo2里我测试了,我的解析不了。。。
12 楼 qq245282209 2013-07-30  
 $("#demo3").click(function(){     
        $.post("${pageContext.request.contextPath}/main/ajax/userList.do",  
                    null,  
                    function(data){   
                            /*                            
                            var info = '';    
                            var leng = data.length;                                                   
                            for(var i=0;i<leng;i++){  
                              info += data[i].id + "," + data[i].name + "," + data[i].sex + "," + data[i].password + "," + data[i].address + "," + data[i].age+"<br>";  
                            }                                                                             
                            $("#listInfo").html(info);  */  
                              
                            var info = '';    
                             $.each(data,function(index,entity) {   
                               info += "姓名: " + entity.name+",年龄: " + entity.age + ",地址: " + entity.address + ",性别: " + (entity.sex == 1 ? "男" : "女")+",密码: " + entity.password+"<br>";     
                             });  
                             $("#listInfo").html(info);  
                                
                                                                         
                    });  
     });   

这个可不可以用
<c:forEach items="${listInfo}" var="list">
<tr>
<td>${list.name}</td>
<td>${list.age}</td>
<td>${list.sex}</td>
<td>${list.password}</td>
<td>${list.address}</td>
</tr>
</c:forEach>

代替呢?
11 楼 lucky_xingxing 2012-08-28  
你好,我想请问下我请求的时候一直报406错误是什么情况(Firebug检测的),然后我把你的程序下载下来运行也是一样的,都报这错误,已经成功请求服务端,只是在返回数据的时候出的问题。请问知道这是什么情况吗?
10 楼 yzongjie 2012-07-25  
谢了,想找一个完整的大型的项目学习一下
9 楼 helloguoxing 2012-05-31  
用到springmvc+jquery,就会遇到JSON的问题,jquery1.3.2可以把数组从jsp传入到controller去,但是后面的版本就不行了,至今1.7的版本还是不能传入复杂数据。请问楼上的大侠有没有好的解决办法呢?
8 楼 helloguoxing 2012-05-31  
已经解决了,多谢楼上的大侠!
7 楼 liuzidong 2012-04-16  
从二方面查找下原因吧!
1 确保jQuery前台调用没问题,用FF查看
2 后台.do的配置是否正确,可从请求方法打印日志查看下
参考链接:Spring MVC入门(登录示例) http://liuzidong.iteye.com/blog/897047
6 楼 helloguoxing 2012-04-16  
我按照上面的配置后,结果ajax返回没有反映,请问大侠遇到过该问题吗?
5 楼 Jerry_BJ 2012-04-12  
liuzidong 写道
用了org.springframework.web.filter.CharacterEncodingFilter一般就没有乱码的问题了,你试过吗,请提意见呀

为何注释掉下面这段代码呢?
 <!-- 
	<bean
		class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter">
		<property name="messageConverters">
			<list>
				<bean
					class="org.springframework.http.converter.StringHttpMessageConverter">
					<property name="supportedMediaTypes">
						<list>
							<value>text/html;charset=UTF-8</value>
						</list>
					</property>
				</bean>
			</list>
		</property>
	</bean>
	<bean id="mappingJacksonHttpMessageConverter"
		class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter" />
	-->
4 楼 shmily2038 2012-02-25  
jquery跟spring mvc交互有点复杂了,提交数据还要先进行序列化。。。
3 楼 liuzidong 2011-08-14  
用了org.springframework.web.filter.CharacterEncodingFilter一般就没有乱码的问题了,你试过吗,请提意见呀
2 楼 source78 2011-08-13  
貌似没考虑返回乱码问题
1 楼 guyuelong2010 2011-07-07  
谢啦,先研究一下,好好看看啊

相关推荐

    SpringMVC整合jdbc+json实例

    **SpringMVC整合jdbc+json实例** 在Java Web开发中,SpringMVC作为一个强大的MVC框架,被广泛用于构建高效、可维护的Web应用程序。它提供了丰富的功能,包括请求处理、视图解析、数据绑定以及依赖注入等。而jdbc...

    SpringMVC整合jdbc+json

    **SpringMVC整合jdbc+json** 是一个典型的后端开发示例,主要展示了如何在SpringMVC框架下,结合JDBC进行数据操作,并利用JSON进行数据传输。这个项目适合初学者学习,它提供了完整的配置和代码,使得可以直接运行。...

    springmvc+mybatis+jquery easyui+json+log4j

    Spring MVC、MyBatis、jQuery EasyUI、JSON 和 Log4j 是常见的 Java Web 开发技术栈,它们在构建高效、可维护的Web应用程序中扮演着重要角色。下面将详细介绍这些技术及其整合应用。 1. Spring MVC:Spring MVC 是 ...

    springmvc mongodb jquery 实现用户操作

    在这个项目中,"springmvc mongodb jquery 实现用户操作",我们将深入探讨如何整合这三个技术来构建一个能够处理用户操作的Web应用程序。 首先,SpringMVC是Spring框架的一个模块,专门用于构建MVC(Model-View-...

    springmvc-ajax-json

    在这个主题"springmvc-ajax-json"中,我们将深入探讨如何在Spring MVC中整合jQuery和Jackson库,实现前端与后端的数据交互,特别是在使用Ajax进行异步请求时。 首先,Spring MVC 提供了Controller接口和@...

    学生管理系统SpringMVC+Mybatis+Ajax

    总结,通过整合SpringMVC、Mybatis和Ajax技术,我们可以构建一个高效、用户体验优良的学生管理系统。这种架构不仅简化了开发流程,还使得系统更加健壮、易维护。对于教育行业的信息化建设来说,这样的技术组合无疑是...

    Springmvc+MyBatis+JQueryEasyUI

    **整合Spring MVC、MyBatis与JQueryEasyUI** 将这三个技术结合使用,可以构建出功能强大、用户体验良好的企业级Web应用。Spring MVC作为前端控制器,处理HTTP请求,调用MyBatis执行数据库操作,返回数据给前端。...

    SpringMVC与Mybatis的整合

    SpringMVC与MyBatis的整合主要有以下几个关键步骤: 1. **配置SpringMVC**:首先,我们需要在web.xml中配置DispatcherServlet,并指定SpringMVC的配置文件路径。接着,在SpringMVC的配置文件中,配置视图解析器(如...

    整合JSON的SSM框架项目

    下面我们将详细探讨SSM框架与JSON的整合以及相关知识点。 首先,Spring框架作为整个项目的基石,主要负责依赖注入(Dependency Injection,DI)和面向切面编程(Aspect-Oriented Programming,AOP)。在整合JSON的...

    ajax+springmvc+json

    在Ajax与SpringMVC的集成中,SpringMVC可以通过`@ResponseBody`注解将方法的返回值直接转换为JSON格式,然后通过Ajax的`dataType: 'json'`设置,前端可以方便地解析这些数据。 具体实现步骤如下: 1. **配置...

    springmvc整合webservice加整合socket

    8. **前端交互**:在HTML页面(如index.html和login.html)中,使用JavaScript或jQuery与后端进行交互,包括AJAX请求和WebSocket连接的建立。 9. **静态资源管理**:了解`statics`目录下的静态文件如CSS、...

    spring3mvc-jQuery-easyUI做的ajax版本用户管理系统

    【标题】"spring3mvc-jQuery-easyUI做的ajax版本用户管理系统" 提供了一个使用SpringMVC、jQuery和easyUI框架构建的Web应用程序实例,它着重于实现基于Ajax的用户管理功能。这个项目展示了如何将这三个强大的技术...

    jquery-easyui-1.5.1.rar

    《jQuery EasyUI 1.5.1与SpringMVC整合详解》 jQuery EasyUI 是一个基于 jQuery 的前端框架,它提供了丰富的用户界面组件,如表格、表单、对话框、菜单、滚动条等,极大地简化了网页开发过程。在1.5.1版本中,...

    使用springmvc整合ajax请求demo代码示例

    7. **Spring MVC与Ajax的结合**:Spring MVC支持JSON和XML等多种数据格式,这使得它与Ajax的集成非常方便。通过配置`MessageConverter`,可以自动将Java对象转换为JSON或XML响应。 以上就是使用Spring MVC整合Ajax...

    springmvc+ajax+mybatis前后端整合珍藏版

    【标题】"springmvc+ajax+mybatis前后端整合珍藏版"涉及到的是一个完整的Web开发框架集成,其中SpringMVC作为后端控制层,MyBatis作为持久层框架,而Ajax则是前端与服务器交互的重要技术。这个整合教程提供了一个...

    基于springmvc+easyui+权限控制的后台管理系统带数据库文件可直接运行

    综上所述,"基于SpringMVC+EasyUI+权限控制的后台管理系统"整合了强大的后端处理能力与直观的前端展示效果,结合数据库,可快速搭建出功能完备的管理平台。在实际应用中,开发者通常还需要考虑权限控制,例如基于...

    Mybatis springMVC

    Mybatis SpringMVC是一个...通过Mybatis、SpringMVC和jQuery的组合,开发者可以快速构建出功能完善的Web应用,实现高效的数据操作和流畅的用户体验。同时,这种架构也具备良好的扩展性和维护性,便于项目的长期发展。

    SpringMVC4+MyBatis3+EasyUI项目

    2. **MyBatis作为数据访问层**:与数据库交互,执行SQL语句,返回结果集。SpringMVC可以通过MyBatis的SqlSessionTemplate或SqlSessionFactoryBean来集成MyBatis,实现DAO层的代码。 3. **EasyUI构建前端界面**:在...

    springmvc_mybatis1208

    本项目"springmvc_mybatis1208"是一个典型的SSM(Spring、SpringMVC、MyBatis)整合案例,涵盖了商品管理的全部操作,包括增、删、改、查功能,同时也融合了JSON、Ajax、JSP、JavaScript和jQuery等技术,为开发者...

Global site tag (gtag.js) - Google Analytics