zoukankan      html  css  js  c++  java
  • web开发-服务器Controller到前端中的数据传递

    一, ajax方式

    (一)controller中

    1. 定义AjaxResponse类 成员有: status , message, data.  其中 status是成功或失败状态, message是给出的相关信息, data是传递过来的数据

    2. 定义返回AjaxResponse对象的controller: 

    一个实例:

     1     @RequestMapping("createOrder")
     2     @ResponseBody
     3     public AjaxResponse createOrder(String subData, String travellerDetail) {
     4         AjaxResponse response = new AjaxResponse();
     5         response.setStatus(AjaxResponseStatus.FAILED);  //先设置状态为失败
     6         String operatorName = getOperator().getOperatorName();
     7         DisneyOrderCreateVo vo =  JSON.parseObject(subData, DisneyOrderCreateVo.class);
     8         vo.setOperator(operatorName);
     9         List<TravellerDetail> travellerDetails = new ArrayList<TravellerDetail>();
    10         travellerDetails = JSON.parseArray(travellerDetail, TravellerDetail.class);
    11         try {
    12             orderService.createDsnOrder(vo, travellerDetails);
    13         } catch (Exception e) {
    14             logger.debug(e.getMessage(), e);     
    15             response.setMessage(e.getMessage());  // 将失败信息返回到页面
    16             return response;
    17         }
    18         response.setStatus(AjaxResponseStatus.SUCCESS);  // 将状态设置为成功
    19         return response;
    20     }

    3. 在js中接收controller中返回的AjaxResponse 对象

    一个实例:

     1         $.ajax({     
     2             url : basepath + "/disney/order/createOrder",
     3             method : 'POST',
     4             data : {"subData":JSON.stringify(subData) , "travellerDetail":JSON.stringify(travellerDetail)},  //将对象序列化为json对象
     5             dataType : "json", //预期服务器返回的数据类型。如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息来智能判断
     6             success:function(res){  // 成功后进行的操作 返回200
     7                 if(res && res.status==="SUCCESS"){
     8                     createOrderPopwin.close();
     9                     window.location.href=basepath+"/disney/order/orderList";
    10                 }else if(res && res.status === "FAILED"){
    11                     var errorMsg = res.message;
    12                     alert(errorMsg);
    13                 }
    14             },
    15             error:function(res){ }  //失败后进行的操作 除200外的返回状态都执行error
    16         });

    -------补充知识:----------

     简单的说Ajax请求通过XMLHttpRequest对象发送请求,该对象有四个状态(readyState): 
    0-未初始化 
    1-正在初始化 
    2-发送数据 
    3-正在发送数据 
    4-完成 
    当XMLHttpRequest.readyState为4时,表示请求已经完成可以得到响应结果。当然success和error方法还是根据响应状态码来触发。当XMLHttpRequest.status为200的时候,表示响应成功,此时触发success().其他状态码则触发error(). 
    Jquery的$.ajax()函数只是封装了ajax请求,本质上还是通过JS XMLHttpRequest内置对象来处理的。 )

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

    二, 在controller中的@RequestMapping方法中通过参数Model 来传递数据

    三, 在controller中的@RequestMapping方法中通过返回值Map来传递数据

    四, 在controller中通过ModelAndView 来传递参数,

    一个实例:

     1    @RequestMapping("/tourVisitorList")
     2    public ModelAndView tourVisitorList(@RequestParam(required = true) String tourGroupMark) {
     3       tourGroupMark = StringUtils.trimToNull(tourGroupMark);
     4       ModelAndView mav = new ModelAndView("opPage/jn/signUp/tour_visitor_list");
     5       tourGroupMark = StringUtils.trimToNull(tourGroupMark);
     6       14       Map<String, Object> idSaleMap = new HashMap<>();
    15       Map<String, Object> idCusMap = new HashMap<>();
    16       38       mav.addObject("idSaleMap", idSaleMap);
    39       mav.addObject("idCusMap", idCusMap);
    40       return mav;
    41    }

    其中, ModelAndView mav = new ModelAndView("opPage/jn/signUp/tour_visitor_list"); 设置返回的页面.   mav.addObject("xxx",XXX); 设置传递的数值.

    此传递的数值在freemark中渲染, 不需要@responseBody.

  • 相关阅读:
    superset可视化不同算法的点击率
    flume通过avro对接(汇总数据)
    Flume同时输出数据到HDFS和kafka
    剑指offer题目系列二
    剑指offer题目系列一
    Servlet生命周期与线程安全
    Servlet初始化及处理HTTP请求
    Servlet及相关类和接口
    web.xml配置文件详解
    递归与斐波那契数列
  • 原文地址:https://www.cnblogs.com/wodo2008/p/5407822.html
Copyright © 2011-2022 走看看