Ajax 请求在 spring-mvc 项目中不起作用答案

【问题标题】：Ajax Request is Not Working in spring-mvc projectAjax 请求在 spring-mvc 项目中不起作用
【发布时间】：2019-07-05 02:33:00
【问题描述】：

我正在处理Spring-Mvc project。我使用DAO 和CONTROLLER 获取DB 数据并设置输出。

我的视图由JSP 和JS 组成。

我必须将DB 数据放入JS 文件中。于是我尝试通过Ajax解决，但失败了。

DAO.java

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

import org.apache.ibatis.session.SqlSession;
import org.apache.ibatis.session.SqlSessionFactory;
import org.springframework.stereotype.Service;

import net.point.service.game.config.SqlSessionFactoryDao;


@Service
public class ADao {

    private SqlSessionFactory sqlSessionFactory;

    public ADao() {
        sqlSessionFactory = SqlSessionFactoryDao.getSqlSessionFactory();
    }




    public List<Map<Object,Object>> selectAllPayment() {
        SqlSession session = sqlSessionFactory.openSession();
        List<Map<Object,Object>> payments = new ArrayList<Map<Object, Object>>();
        try {
        payments =  session.selectList("AdminPaymentDao.selectAllPayment");
        System.out.println("payments: " + payments);
        System.out.println("-----------------------------------------------------");
        }catch (Exception error) {
            error.printStackTrace();
        } finally {
            session.close();
        }
        return payments;
    }

}

Controller.java

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

import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;

import ch.qos.logback.classic.Logger;
import net.point.service.game.admin.payment.collection.ADao;

@Controller
public class Controller {

    private static Logger logger =  (Logger) LoggerFactory.getLogger(AdminPaymentController.class);

    @Autowired
    ADao aDao;

    @ResponseBody
    @RequestMapping(value="/adminRequestCharge", method = RequestMethod.POST)
    public  Map<String, Object> selectAllPayment() {
        Map<String, Object> result = new HashMap<String, Object>();
        logger.info("selectAllPayment start~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~");
        System.out.println("gggggggggggggggggggggggggggggggggggggggggggggg");
        try {
        List<Map<Object, Object>> resultList = new ArrayList<Map<Object, Object>>();
        resultList = aDao.selectAllPayment();
        for (Object list : resultList) {
            System.out.println("resultList:" + resultList);
        }
        result.put("jqgrid_data", resultList);
        }catch (Exception error) {
            error.printStackTrace();
        }
        return result;
    }

}

js 文件

$(function(){

    //ajax
    $("#chargeRequestList").submit(function() {

        let queryData = $(this).serialize();

        $.ajax({
            url:"/adminRequestCharge",
            type: "POST",
            dataType: "json"
            data: queryData
            success: function(result) {
                console.log(result);
            }
        })
    })


    setRequestList(jqgrid_data);

    // grid resize
    $(window).on('resize.jqGrid', function() {
        $("#chargeRequestList").jqGrid('setGridWidth', $(".grid-cover").width());
    })

});



function setRequestList(jqgrid_data){
    jQuery("#chargeRequestList").jqGrid({
        data : jqgrid_data,
...

我想要的价值形式：

var jqgrid_data = [{
    seq: '1512',
    status : '0',
    value : '10,000',
    purchase_means : '1001',
    paid : '20',
    reg_date : '2019-06-24 12:43:33',
    pay_status : '0',
    paid_date : '2019-06-08 10:33:23',
    func : '1'
},
{
...
}

springs 有很多我以前从未熟悉过的东西，而我对Java 和Ajax 并不完全熟悉。

这可能是一个基本的错误，因为缺少很多东西，

我需要你的解决方案

提前谢谢你

【问题讨论】：

标签： javascript java ajax spring-mvc mariadb

【解决方案1】：

您必须插入 url 以匹配控制器的值，如下面的代码所示。 url 不能等于 View 的值。

$.ajax({
url:"/ChargeData",
type: “POST”,
dataType: “json”,
data: data,
success: function(result) {
console.log(result.jqgrid_data);    
setRequestList(result.jqgrid_data)
}
})

【讨论】：

【解决方案2】：

来自您的示例 ajax 数据集：

[
{
   seq: '1512',
    status : '0',
    value : '10,000',
    purchase_means : '1001',
    paid : '20',
    reg_date : '2019-06-24 12:43:33',
    pay_status : '0',
    paid_date : '2019-06-08 10:33:23',
    func : '1'
    },
    ....
    ]

现在创建一个类，声明它的字段与jsonObject的键名相同，即，

public class YourDto{
   private String seq;
   private String status;
   ....
   ...
}

现在用这个替换你的控制器方法声明：

 @ResponseBody
    @RequestMapping(value="/adminRequestCharge", method = RequestMethod.POST)
    public  Map<String, Object> selectAllPayment(HttpServletRequest request, @RequestBody List<YourDto> yourDataList, HttpServletResponse response) {
    //your logic here;
    .....
}

希望这会有所帮助。

【讨论】：