后台返回json对象:

package com.sawshaw.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody; import com.alibaba.fastjson.JSONObject; @Controller
@RequestMapping("/hello")
public class HelloController {
@RequestMapping("/greeting")
@ResponseBody
public String greeting(){
JSONObject js=new JSONObject();
js.put("id", "myId");
js.put("content", "mycontent");
return js.toJSONString();
} }

前台解析:

$(document).ready(function() {
$.ajax({
url: "hello/greeting"
}).then(function(data) {
var obj=JSON.parse(data);
//或者var obj=eval("("+data+")");解析
console.log(obj.id);
$('.greeting-id').append(obj.id);
$('.greeting-content').append(obj.content);
});
});
</script>

后台返回数组数据的: 

@Override
public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
int user_id = Integer.parseInt(request.getParameter("user_id"));
User user;
try {
user = service.queryUserById(user_id);
if (user != null) {
response.getWriter().print(user.getUser_name() + "," + user.getUser_phone() + "," + user.getUser_email() + "," + user.getUser_adress());
} else {
response.getWriter().print("false");
}
} catch (SQLException e) {
e.printStackTrace();
}
}

 前台解析:

 <script>
$(function(){
var id=getUrlParam("id").replace(/\+/g," ");
$("#u_id").val(id);
$.ajax({
url : 'queryByUserId',
type : 'get',
contentType : 'text/html',
data : {user_id:id}
}).done(function(data) {
if(data!=false){
var arr=data.split(",");
if(arr[0]!="null"){
$("#u_name").val(arr[0]);
}
if(arr[1]!="null"){
$("#u_phone").val(arr[1]);
}
if(arr[2]!="null"){
$("#u_email").val(arr[2]);
}
if(arr[3]!="null"){
$("#u_adress").val(arr[3]);
}
}else{
alert("查找用户失败");
}
}).fail(function(data) {
}).always(function() {
console.log("complete");
});
$("#updateSubmit").click(function(){
if($("#u_name").val()==""){
alert("用户名不为空");
}
});
});
function getUrlParam(name){
var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
var r = window.location.search.substr(1).match(reg); //匹配目标参数
if (r!=null) return unescape(r[2]); return null; //返回参数值
}
</script>

后台返回json数组的:

@WebServlet(urlPatterns = "/userQueryOrder")
public class OrderUserQueryOrderServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
OrderService service = new OrderServiceImpl(); @Override
public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
HttpSession session = request.getSession();
User user = (User) session.getAttribute("user");
int user_id = user.getUser_id();
try {
List<Order> list = service.userQueryOrder(user_id);
JSONArray orderList = JSONArray.fromObject(list);
response.getWriter().println(orderList);
} catch (Exception e) {
e.printStackTrace();
}
}

  

前台解析:

$.ajax({
url : 'userQueryOrder',
type : 'get',
dataType : 'json',
contentType:'text/html'
}).done(function(data) {
//var json=eval("("+data+")");
for(var i=0;i<data.length;i++){
$("#orderList").append("<table>"
+"<tr class='order_detail'>"
+"<td class='order_id'>"+ data[i].order_id+"</td>"
+"<td class='order_price'>"+data[i].order_price+"</td>"
+"<td class='order_time'>"+(parseInt(data[i].order_time.year)+1900)+"-"+(parseInt(data[i].order_time.month)+1)+"-"+(data[i].order_time.date)+" "+(parseInt(data[i].order_time.hours)+1)+":"+(data[i].order_time.minutes)+":"+(data[i].order_time.seconds)+"</td>"
+"</tr>"
+"</table>"
+"<table class='orderDetail' style='display:none;'>"
+"<tr>"
+"<td>商品名</td>"
+"<td>价格(元)</td>"
+"<td>数量</td>"
+"</tr>"
+"</table>"
+"<div class='XX'>"
+"</div>");
}
}).fail(function(data) {

  

 

 

  

springMVC前后台交互的更多相关文章

  1. JAVA配置&注解方式搭建简单的SpringMVC前后台交互系统

    前面两篇文章介绍了 基于XML方式搭建SpringMVC前后台交互系统的方法,博文链接如下: http://www.cnblogs.com/hunterCecil/p/8252060.html htt ...

  2. springMVC前后台数据交互

    假设项目需求是在springMVC框架下,后台要传送一个list到前台,那我们就要做以下几个步骤: 1 在web.xml文件中进行springMVC的配置: <?xml version=&quo ...

  3. 前后台交互经常使用的技术汇总(后台:Java技术,前台:Js或者Jquery)

    1:由于针对特定的前后台交互用到的知识总结,所以不大量贴代码,主要给出思路,方便自己以后脑补和技术总结,当然也希望可以帮助到别人. 后台Json和其他格式转化,之前总结过Json和对象,集合,字符串的 ...

  4. 基础框架整合-ssm框架+前后台交互完整教程

    1.基本概念 ssm:spring+springMVC+mybatis 2.开发环境 Eclipse mars + jdk1.7 + maven + tomcat7 3.使用maven构建web项目 ...

  5. Devexpress 使用经验 —— ASPxGridView前后台交互写法推荐

    这里的格式是仁者见仁智者见智,这篇随笔只是我在工作过程中总结出的阅读性高,对我来说效率较高的写法. ASPX: <dx:ASPxGridView ID="ASPxGridViewLin ...

  6. jquery ajax返回json数据进行前后台交互实例

    jquery ajax返回json数据进行前后台交互实例 利用jquery中的ajax提交数据然后由网站后台来根据我们提交的数据返回json格式的数据,下面我来演示一个实例. 先我们看演示代码 代码如 ...

  7. ajax实现异步前后台交互,模拟百度搜索框智能提示

    1.什么是异步?在传统的网站项目中,填写一堆数据,最后点击提交,在点击提交的这一刻才实现数据提交,前后台交互.在你点击提交之前数据是没有提交到后台的.这样就会造成很大的不便.比如,我填了一大堆数据,结 ...

  8. WebSocket前后台交互

    其实对于前后台交互有很多种方法(只列举我知道的,嘻嘻): 1:from 表单: 使用场景——小信息量提交给后台 2:ajax(跨域的话用jsonp): 可以进行多量的前后台信心传递: 但实时性不高,不 ...

  9. MySQL前后台交互登录系统设计

    1.首先我们做一个前台的注册页面 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...

随机推荐

  1. 通过Nginx反向代理,IIS和apache 共用80端口

    #user nobody; worker_processes ; #error_log logs/error.log; #error_log logs/error.log notice; #error ...

  2. php扩展yaf 按照配置

    Yaf,全称 Yet Another Framework,是一个C语言编写的PHP框架,是一个用PHP扩展形式提供的PHP开发框架, 相比于一般的PHP框架, 它更快. 它提供了Bootstrap, ...

  3. logback.xml常用配置详解

    <?xml version="1.0" encoding="UTF-8"?><configuration debug="false& ...

  4. AngularJS------命令行

    如下:(‘$’符号不需要输入哦) $ ng build --发布项目

  5. flexbox子盒子align-self属性

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. ios开发之--armv7,armv7s,arm64,i386,x86_64详解

    有时候在运行的时候,经常出现诸如i386的错误,最新一些可能会出现 No architectures to compile for (ONLY_ACTIVE_ARCH=YES, active arch ...

  7. win10进入到安全模式的三种方法

    这里介绍三种方法: 如果能够进入到系统 点击开始--设置--更新和安全--恢复,右侧点击高级启动中的立即重启 能够进入到登陆界面 进入到登录屏幕后,在按住 Shift 键的同时依次选择“电源” > ...

  8. ajax访问WebService跨域问题

    1.先看一个网站介绍,了解跨域问题    HTTP访问控制(CORS) 2.像谷歌.火狐浏览器对一些非简单请求会触发预检请求,首先使用 OPTIONS   方法发起一个预检请求到服务器,然而IE浏览器 ...

  9. vmware centos7系统虚拟机复制到其他电脑后不能联网问题解决

    虚拟机复制到别的电脑后,无法联网 使用ifconfig命令,没有显示出IP4的网址信息(显示ens33文件配置信息) 在网上查看相关资料,大部分说是mac地址不一致导致 如果配置了mac地址,那么在/ ...

  10. Ora2Pg的安装和使用

    1. 安装DBI,DBD::Oracle DBI只是个抽象层,要实现支持不同的数据库,则需要在DBI之下,编写针对不同数据库的驱动.对MySql来说,有DBD::Mysql, 而对ORACLE来说,则 ...