springMVC前后台交互
后台返回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前后台交互的更多相关文章
- JAVA配置&注解方式搭建简单的SpringMVC前后台交互系统
前面两篇文章介绍了 基于XML方式搭建SpringMVC前后台交互系统的方法,博文链接如下: http://www.cnblogs.com/hunterCecil/p/8252060.html htt ...
- springMVC前后台数据交互
假设项目需求是在springMVC框架下,后台要传送一个list到前台,那我们就要做以下几个步骤: 1 在web.xml文件中进行springMVC的配置: <?xml version=&quo ...
- 前后台交互经常使用的技术汇总(后台:Java技术,前台:Js或者Jquery)
1:由于针对特定的前后台交互用到的知识总结,所以不大量贴代码,主要给出思路,方便自己以后脑补和技术总结,当然也希望可以帮助到别人. 后台Json和其他格式转化,之前总结过Json和对象,集合,字符串的 ...
- 基础框架整合-ssm框架+前后台交互完整教程
1.基本概念 ssm:spring+springMVC+mybatis 2.开发环境 Eclipse mars + jdk1.7 + maven + tomcat7 3.使用maven构建web项目 ...
- Devexpress 使用经验 —— ASPxGridView前后台交互写法推荐
这里的格式是仁者见仁智者见智,这篇随笔只是我在工作过程中总结出的阅读性高,对我来说效率较高的写法. ASPX: <dx:ASPxGridView ID="ASPxGridViewLin ...
- jquery ajax返回json数据进行前后台交互实例
jquery ajax返回json数据进行前后台交互实例 利用jquery中的ajax提交数据然后由网站后台来根据我们提交的数据返回json格式的数据,下面我来演示一个实例. 先我们看演示代码 代码如 ...
- ajax实现异步前后台交互,模拟百度搜索框智能提示
1.什么是异步?在传统的网站项目中,填写一堆数据,最后点击提交,在点击提交的这一刻才实现数据提交,前后台交互.在你点击提交之前数据是没有提交到后台的.这样就会造成很大的不便.比如,我填了一大堆数据,结 ...
- WebSocket前后台交互
其实对于前后台交互有很多种方法(只列举我知道的,嘻嘻): 1:from 表单: 使用场景——小信息量提交给后台 2:ajax(跨域的话用jsonp): 可以进行多量的前后台信心传递: 但实时性不高,不 ...
- MySQL前后台交互登录系统设计
1.首先我们做一个前台的注册页面 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...
随机推荐
- BarTender条码检验位类型知识讲解
检验位类型指定BarTender使用哪一种算法来计算符号的附加检验位.使用“BarTender检验位类型”选项可以从您的符号所支持的检验位类型中选择一种检验位类型.下面,小编就给大家分享设置检验位类型 ...
- MVC使用 Elmah 日志记录组件
在后台管理中,有一些操作是需要增加操作日志的,尤其是对一些比较敏感的金额类的操作,比如商城类的修改商品金额.删除商品.赠送金额等人工的操作.日志中记录着相关操作人的操作信息,这样,出了问题也容易排查. ...
- Faulty Odometer(九进制数)
Faulty Odometer Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 9301 Accepted: 5759 D ...
- 如何在O(n)的时间复杂度内找出数组中出现次数超过了一半的数
方法一:每次取出两个不同的数,剩下的数字中重复出现次数超过一半的数字肯定,将规模缩小化.如果每次删除两个不同的数,这里当然不是真的把它们踢出数组,而是对于候选数来说,出现次数减一,对于其他数来说,循环 ...
- 我的notepad++
我觉得,做开发的一定要有一个简单,但功能强大的文本编辑器.我比较喜欢notepad++,而且一直使用.准备通过这篇文章分享一下我的notepad++配置. 希望广大notepad++用户,如果有好的配 ...
- mysql触发器的使用 想让b字段在更新的时候把旧数据保存到a字段中
使用mysql希望数据库自动触发一些规则,进行更新数据的时候,就需要用触发器了,比如 将旧数据保存到额外字段中,如何做呢? 在abc表中 name更新的时候 我希望把name的老数据保存到 old_n ...
- ios开发之--跳转到指定的TabBarViewController中的某一个VIewController
比较简单,也很实用,方法大同小异,仅做记录,方法的系统记录如下: [self dismissViewControllerAnimated:YES completion:^{ // 这是从一个模态出来的 ...
- linux文件和目錄管理的基本命令命令
ls命令 作用:顯示目標列表或目錄的內容 語法:ls[選項][目錄或文件] -a:顯示指定目錄下所有子目錄與文件,包括隱藏文件 -l:顯示文件的詳細信息 -d: 顯示目錄 例:ls -dl cd命令 ...
- Mybatis的resultMap返回map
<resultMap type="Map" id="bankMaintainMap"> <result column="bank_n ...
- Struts2(四)属性驱动和模型驱动
一.概述 所谓模型驱动,就是使用单独的JavaBean实例贯穿整个MVC流程,与之相对应的属性驱动方式,则使用属性作为贯穿MVC流程的信息携带者.属性无法独立存下,它必须依附于一个对象,这个对象就是A ...