Table数据接口请求异常:error

提问 已结 8 326
墨迹53
墨迹53 2019-10-17
悬赏:20飞吻
版本:layui v2.5.4 浏览器:Chrome 版本 77.0.3865.120(正式版本) (64 位)

MyEclipse SSM 框架,
前端
 <script type="text/javascript" src="${ctx}/layui/layui.js"></script>
<script>
layui.use('table', function(){
var table = layui.table;
//第一个实例
table.render({
elem: '#demo'
,height: 'auto'
,method: 'post'
,url: '${pageContext.request.contextPath}/User/dataGrid' //数据接口
,parseData: function(res){ //res 即为原始返回的数据
return {
"code": res.code, //解析接口状态
"msg": res.msg, //解析提示文本
"count": res.count, //解析数据长度
"data": res.data//解析数据列表
};
}
,page: true //开启分页
,cols: [[ //表头
{field: 'id', title: 'ID', width:80, sort: true, fixed: 'left'}
,{field: 'username', title: '用户名', width:80}
,{field: 'sex', title: '性别', width:80, sort: true}
,{field: 'city', title: '城市', width:80}
]]
});

});
</script>
后台
package com.java.controller;

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

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;



import org.springframework.web.bind.annotation.ResponseBody;

import pagemodel.MsgResut;
import po.Customer;
import po.Table;


@Controller
@RequestMapping("/User")
public class UserController {

@RequestMapping("/dataGrid")
public Table dataGrid(HttpServletRequest request){
Customer cus = new Customer();
cus.setId("10000");
cus.setUsername("user-0");
cus.setSex("女");
cus.setCity("城市-0");
Customer cus2 = new Customer();
cus2.setId("20000");
cus2.setUsername("user-2");
cus2.setSex("男");
cus2.setCity("城市-2");

ArrayList<Customer> customer = new ArrayList<Customer>();
customer.add(cus);
customer.add(cus2);

Table table = new Table();
table.setCode(0);
table.setMsg("");
table.setCount(2);
table.setData(customer);
return table;
}

@RequestMapping("/hello.act")
public String hello(){
return "hello";
}

}
public class Table {
private int code;
private String msg;
private int count;
private List data = new ArrayList();

我感觉我返回格式没错啊,试了一晚上了,数据就是出不来。。。求各位路过的大佬帮个忙[可怜]
回帖
  • 执剑断念
    2019-10-18
    @墨迹53 你这个类直接继承hashmap就好了,然后在方法写上 @ResponseBody,这种对于前后端交互是没问题,在报错就是代码逻辑问题
    0 回复
  • saiomeil
    2019-10-18
    首先你调试说404,那说明不是layui-table组件使用的问题。是没有访问到这个请求,由于指定请求为post,@RequestMapping("/dataGrid")修改为
    @RequestMapping(
      method = RequestMethod.POST, // .post
      path = "/dataGrid"
    )
    @RequestBody 增加这个注解返回
    也可以直接写
    @PostMapping("/dataGrid")
    @RequestBody 增加这个注解返回
    0 回复
  • 墨迹53
    2019-10-18
    @saiomeil
    @RequestBody 这个是加在public Table dataGrid(HttpServletRequest request,@RequestBody Table table){
    这样试用的,
    你说的应该是@ResponseBody,加了没有效果,不过控制台提示
    No mapping found for HTTP request with URI [/SSM/User/dataGrid] in DispatcherServlet with name 'SpringMVC'
    可能是我配置问题吧。。。。。
    0 回复
  • 执剑断念
    2019-10-18
    @墨迹53 404就是路径的问题,看看报错的地址和你项目地址的一样么
    0 回复
  • 墨迹53
    2019-10-18
    @执剑断念 一样,不过应该是我搭建环境的问题,换了一个新的环境,没有404
    又有新的问题 数据接口请求异常:parsererror
    实在是不知道后端java对应要返回的类型怎么写,
    写了一个Table类型
    private int code = 0;
    private String msg = "";
    private int count;
    private List data = new ArrayList();
    不行
    又写了一个
    Map<String, Object> params = new HashMap<String, Object>();
    params.put("code", 0);
    params.put("msg", "");
    params.put("count", 2);
    params.put("data", customer);
    也还是不行,
    不过网页倒是不报错了
    0 回复
  • 墨迹53
    2019-10-18
    @执剑断念 hashmap只是个构造函数,可以继承Map<K,V>这个不好也不好继承吧,然后在方法写上 @ResponseBody,也写了,不过还是
    数据接口请求异常:parsererror
    另外,代码逻辑问题
    @RequestMapping(value = "/good.action", method = RequestMethod.GET)
    public @ResponseBody Table login() {
    Customer2 cus = new Customer2();
    cus.setId("10000");
    cus.setUsername("user-0");
    cus.setSex("女");
    cus.setCity("城市-0");
    Customer2 cus2 = new Customer2();
    cus2.setId("20000");
    cus2.setUsername("user-2");
    cus2.setSex("男");
    cus2.setCity("城市-2");

    ArrayList<Customer2> customer = new ArrayList<Customer2>();
    customer.add(cus);
    customer.add(cus2);

    Table table = new Table();
    table.setData(customer);
    table.setCount(2);
    System.out.println(customer.toString());
    return table;

    }
    应该没什么问题吧,对了,控制台并没有输出customer.toString()的值,也很奇怪
    0 回复
  • 墨迹53
    2019-10-18
    已解决
    package com.java.controller;

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

    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;

    import org.springframework.beans.factory.annotation.Autowired;
    import org.springframework.stereotype.Controller;
    import org.springframework.web.bind.annotation.RequestBody;
    import org.springframework.web.bind.annotation.RequestMapping;



    import org.springframework.web.bind.annotation.RequestMethod;
    import org.springframework.web.bind.annotation.ResponseBody;

    import pagemodel.MsgResut;
    import po.Customer2;
    import po.Table;


    @Controller
    @RequestMapping("/User")
    public class UserController {
    @RequestMapping(value = "/good.action", method = RequestMethod.POST)
    public @ResponseBody Table login() {
    Customer2 cus = new Customer2();
    cus.setId("10000");
    cus.setUsername("user-0");
    cus.setSex("女");
    cus.setCity("城市-0");
    Customer2 cus2 = new Customer2();
    cus2.setId("20000");
    cus2.setUsername("user-2");
    cus2.setSex("男");
    cus2.setCity("城市-2");

    ArrayList<Customer2> customer = new ArrayList<Customer2>();
    customer.add(cus);
    customer.add(cus2);

    Table table = new Table();
    table.setData(customer);
    table.setCount(2);

    return table;
    }

    @RequestMapping("/hello.action")
    public String hello(){
    return "hello";
    }

    }
    前端
    <script>
    layui.use('table', function(){
    var table = layui.table;
    //第一个实例
    table.render({
    elem: '#demo'
    ,height: 'auto'
    ,method: 'post'
    ,url: '${pageContext.request.contextPath}/User/good.action' //数据接口
    ,parseData: function(res){ //res 即为原始返回的数据
    return {
    "code": res.code, //解析接口状态
    "msg": res.msg, //解析提示文本
    "count": res.count, //解析数据长度
    "data": res.data//解析数据列表
    };
    }
    ,page: true //开启分页
    ,cols: [[ //表头
    {field: 'id', title: 'ID', width:80, sort: true, fixed: 'left'}
    ,{field: 'username', title: '用户名', width:80}
    ,{field: 'sex', title: '性别', width:80, sort: true}
    ,{field: 'city', title: '城市', width:80}
    ]],
    done:function(res,curr,count){
    console.log(res)
    console.log(curr)
    console.log(count)
    }
    });

    });
    </script>
    <div class="layui-body">
    <!-- 内容主体区域 -->
    <div style="padding: 15px;">
    <table id="demo" lay-filter="test"></table>
    </div>
    </div>
    index.jsp
    <%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <!-- 转发到登录页面 -->
    <jsp:forward page="/WEB-INF/jsp/hello.jsp"/>
    0 回复
  • 墨迹53
    2019-10-18
    可能的原因
    1.web.xml里设置的
    <welcome-filindex>
    <welcome-file>index.jsp</welcome-file>
    </welcome-filindex>
    写为了hello.jsp
    但是该文件在WEB-INF下导致无法正常跳转
    2.jsp里的url
    url: '${pageContext.request.contextPath}/User/good.action'
    ${pageContext.request.contextPath}代表了http:....:8080/项目 位置 注意 项目后面没有 /
    3.controller返回数据
    @ResponseBody 是必须的
    写成
    @RequestMapping(value = "/good.action", method = RequestMethod.POST)
    @ResponseBody
    public Table login() {
    或者
    @RequestMapping(value = "/good.action", method = RequestMethod.POST)
    public @ResponseBody Table login() {
    都是可以的
    4.自己创建的对象
    private int code=0;
    private String msg="";
    private int count;
    private List data = new ArrayList();
    是可以的
    ArrayList<Customer2> customer = new ArrayList<Customer2>();
    customer.add(cus);
    customer.add(cus2);

    Table table = new Table();
    table.setData(customer);
    table.setCount(2);
    以上
    0 回复