SpringMVC后端返回数据到前端代码示例

1.返回ModelAndView对象(.jsp)

controller代码:

package controller;

import java.util.List;

import javax.annotation.Resource;

import model.Comment;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.stereotype.Service;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.servlet.ModelAndView;

import service.CommentService;

@Controller
//@RequestMapping("comment")
public class CommentController {
  @Resource private CommentService commentService;
  @RequestMapping(value="showComments")
  public ModelAndView test(){
    ModelAndView mav = new ModelAndView();
    List<Comment> comments = commentService.selectAllComment();
    for(Comment com:comments){
      System.out.println(com.getC_text());
    }
    mav.addObject("msg",comments);
    mav.setViewName("textIndex.jsp");
    return mav;
  }
}

jsp页面代码

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

  <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
 <head>
  <base href="<%=basePath%>" rel="external nofollow" >

  <title>My JSP 'index.jsp' starting page</title>
  <meta http-equiv="pragma" content="no-cache">
  <meta http-equiv="cache-control" content="no-cache">
  <meta http-equiv="expires" content="0">
  <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  <meta http-equiv="description" content="This is my page">
  <!--
  <link rel="stylesheet" type="text/css" href="styles.css" rel="external nofollow" >
  -->
 </head>

 <body>
 <c:forEach items="${msg}" var="com">
  ${com.getUid()}:${com.getC_text()}:${com.getC_date()}<br>
  </c:forEach>
 </body>
</html>

2.返回JSON数据到html页面

利用ajax接收数据

ajax({
    method:'post',
    url:'http://localhost:8080/graduate/showComments.do',
    data:'null',
    success:function(response){
      console.log(response);
    }
})

controller

@Controller
//@RequestMapping("comment")
public class CommentController {
  @Resource private CommentService commentService;

  @RequestMapping(value="showComments")
  @ResponseBody
  public List<Comment> test(){
    List<Comment> comments = commentService.selectAllComment();
    for(Comment com:comments){
      System.out.println(com.getC_text());
    }
    return comments;
  }
}

3.顺便记录一下原生ajax,方便以后使用

function ajax(opt) {
    opt = opt || {};
    opt.method = opt.method.toUpperCase() || 'POST';
    opt.url = opt.url || '';
    opt.async = opt.async || true;
    opt.data = opt.data || null;
    opt.success = opt.success || function () {};
    var xmlHttp = null;
    if (XMLHttpRequest) {
      xmlHttp = new XMLHttpRequest();
    }
    else {
      xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
    }var params = [];
    for (var key in opt.data){
      params.push(key + '=' + opt.data[key]);
    }
    var postData = params.join('&');
    if (opt.method.toUpperCase() === 'POST') {
      xmlHttp.open(opt.method, opt.url, opt.async);
      xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded;charset=utf-8');
      xmlHttp.send(postData);
    }
    else if (opt.method.toUpperCase() === 'GET') {
      xmlHttp.open(opt.method, opt.url + '?' + postData, opt.async);
      xmlHttp.send(null);
    }
    xmlHttp.onreadystatechange = function () {
      if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
        opt.success(JSON.parse(xmlHttp.responseText));
      }
    };
  }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • laypage+SpringMVC实现后端分页

    项目中用到了模板引擎thymeleaf和前端框架layUI,算是一路摸索.一个坑一个坑踩过来的.之前边学习边做项目的时候没有记录下学习的过程和遇到问题的解决思路和方法,着实有点可惜.所以从现在开始咯. laypage分页 下面就以laypage的两种分页展开行文的思路:异步刷新分页和整页刷新式跳转.具体可参看官方文档. 异步刷新分页 首先使用laypage之前,先加载laypage模块.使用 layui.use('laypage')加载即可. 1.前端html代码如下: <div id="

  • Spring MVC前后端的数据传输的实现方法

    本篇文章主要介绍了Spring MVC中如何在前后端传输数据.具体内容如下所示: 后端--> 前端 在Spring MVC中这主要通过Model将数据从后端传送到前端,一般的写法为: @RequestMapping(value = "/index", method = RequestMethod.POST) public String index(Model model){ String greeting = "Hello !" model.addAttrib

  • Spring MVC前端与后端5种ajax交互方法【总结】

    前端ajax与后端Spring MVC控制器有以下五种数据交互方式.(前台使用了dhtmlxGrid,后端使用了fastjson) 方式一 通过URL传参 通过URL挂接参数,如/auth/getUser?userid='6' 服务器端方法可编写为:getUser(String userid),也可新增其他参数如HttpSession, HttpServletRequest,HttpServletResponse,Mode,ModelAndView等. 方式二 单值传参 前台调用如: ajaxP

  • spring mvc 实现获取后端传递的值操作示例

    本文实例讲述了spring mvc 实现获取后端传递的值.分享给大家供大家参考,具体如下: jsp页面怎么获取从后端传递过来的值? JSTL 方法获取后端传递的值 @RequestMapping("index1") public ModelAndView index1() { ModelAndView model = new ModelAndView("/Index/index"); model.addObject("msg","my

  • java web SpringMVC后端传json数据到前端页面实例代码

    下面的后台的代码:目的的查询数据库中的所有省的列表,然后转化为json传到前端页面 @Controller public class DistrictController { @Resource private ProvinceService provinceServiceImp; @Resource private CityService cityServiceImp; @Resource private TourSpotService tourSpotServiceImp; /** * 获取

  • SpringMVC前端和后端数据交互总结

    本文主要介绍了SpringMVC前端和后端数据交互的资料,特地发出来记录一下.有需要的朋友可以了解一下. 控制器 作为控制器,大体的作用是作为V端的数据接收并且交给M层去处理,然后负责管理V的跳转.SpringMVC的作用不外乎就是如此,主要分为:接收表单或者请求的值,定义过滤器,跳转页面:其实就是servlet的替代品. 传值方式 springmvc最方便的一点就是可以通过注释方式来定义它的url. @Controller public class formMVC { @RequestMapp

  • 轻松玩转BootstrapTable(后端使用SpringMVC+Hibernate)

    还是那句老话,好记性不如烂笔头.记得以前的一个Demo项目里面有分页,但是没有用插件,自己手写的分页处理,但是效果并不是很好,最近接触到插件BootstrapTable,风格和Bootstrap统一,现在就来说说怎样使用它. 初上手,直接套json数据进去,然后设置分页方式为client',很快表格就做出来,但是一般项目中都是使用后台来进行分页的,不可能一下从数据库从捞出成千上万条数据,先不说流量的问题,客户端的渲染也吃力.在使用服务器后端分页的过程中,也遇到了一些问题,相信大部分初次接触Boo

  • SpringMVC后端返回数据到前端代码示例

    1.返回ModelAndView对象(.jsp) controller代码: package controller; import java.util.List; import javax.annotation.Resource; import model.Comment; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Controller;

  • 使用jdbcTemplate查询返回自定义对象集合代码示例

    1.在UserInfo.java中添加一个Map转换为UserInfo的方法 public static UserInfo toObject(Map map) { UserInfo userInfo = new UserInfo(); userInfo.setId((Integer) map.get(id)); userInfo.setUname((String) map.get(uname)); userInfo.setUnumber((Integer) map.get(unumber));

  • springmvc Rest风格介绍及实现代码示例

    简介 REST 即 Representational State Transfer.(资源)表现层状态转化.是目前最流行的一种互联网软件架构.它结构清晰.符合标准.易于理解.扩展方便,所以正得到越来越多网站的采用,POST, DELETE, PUT, GET 分别对应 CRUD.Spring3.0 开始支持 REST 风格的请求,是通过 org.springframework.web.filter.HiddenHttpMethodFilter 把 POST 请求转化为 PUT 和 DELETE

  • vue+springmvc导出excel数据的实现代码

    vue端处理 this.$http.get(this.service + '/user/excel',{responseType: 'blob'}).then(({data})=> { console.info(typeof data) var a = document.createElement('a'); var url = window.URL.createObjectURL(data); a.href = url; a.download = '用户统计信息.xls'; a.click()

  • springmvc的validator数据校验的实现示例代码

    一.什么是数据校验? 这个比较好理解,就是用来验证客户输入的数据是否合法,比如客户登录时,用户名不能为空,或者不能超出指定长度等要求,这就叫做数据校验. 数据校验分为客户端校验和服务端校验 客户端校验:js校验 服务端校验:springmvc使用validation校验,struts2使用validation校验.都有自己的一套校验规则. 二.springmvc的validation校验 Springmvc本身没有校验功能,它使用hibernate的校验框架,hibernate的校验框架和orm

  • Ajax叠加(Ajax返回数据用Ajax发出)示例代码

    最近在做人事管理系统的一个签到功能,首先是把部门当做参数,把参数用Ajax发送到数据库进行查询,然后以表格形式动态生成员工信息到返回页面的Div里,表格最后的一列是签到按钮,这时我想用JQuery继续获取被点击的"签到"按钮,然后用Ajax将数据发送到数据库签到表,更新签到表,于是我就把每个签到按钮的id属性设置成第一次Ajax返回的每个员工信息的工号,再次用JQuery获取,怎么获取呢?想到了标签加事件选择器,于是写了下面代码: 复制代码 代码如下: $(function(){ $(

  • SpringMVC方法返回值多种情况代码实例

    返回ModelAndView 如果前后端不分的开发,大部分情况下,我们返回ModelAndView,即数据模型+视图: @Controller @RequestMapping("/user") public class HelloController { @RequestMapping("/hello") public ModelAndView hello() { ModelAndView mv = new ModelAndView("hello"

  • 使用NumPy读取MNIST数据的实现代码示例

    NumPy 什么是NumPy NumPy是 Python 语言的一个扩展程序库,支持大量的维度数组与矩阵运算,此外也针对数组运算提供大量的数学函数库.主页为https://numpy.org/. 安装NumPy 使用pip工具来安装. python -m pip install numpy 使用NumPy读取mnist数据 如果直接从网络上读取mnist数据,恭喜你,目前国内基本需要一个小时以上.所以建议预先下载mnist数据包. 工作环境 当前我的工作环境如下:Win10 + Anaconda

  • JDBC插入数据返回数据主键代码实例

    Java数据库连接,(Java Database Connectivity,简称JDBC)是Java语言中用来规范客户端程序如何来访问数据库的应用程序接口,提供了诸如查询和更新数据库中数据的方法.JDBC也是Sun Microsystems的商标.我们通常说的JDBC是面向关系型数据库的. 代码如下 package com.test; import java.sql.Connection; import java.sql.PreparedStatement; import java.sql.Re

  • SpringBoot前后端json数据交互的全过程记录

    目录 一.参考文献 二.勇敢尝试 三.最终选择交互方式 总结 一.参考文献 原生Ajax与JQuery Ajax SpringMVC接受JSON参数详解及常见错误总结 提交方式为 POST 时, JQuery Ajax 以 application/x-www-form-urlencoded 上传 JSON对象 , 后端用 @RequestParam 或者Servlet 获取参数. JQuery Ajax 以 application/json 上传 JSON字符串, 后端用 @RquestBody

随机推荐