Jquery中使用ajax传json参数并从SpringBoot后台Controller返回消息

场景

前端通过ajax提交json格式的数据,后台接受到实现具体的业务后

返回给前端消息提示。

实现

html页面代码

复制代码
 <button id="printBtn" class="btn btn-info " type="button"><i class="fa fa-trash-o"></i> 打印</button>

调用js部分代码

复制代码
//打印按钮点击事件
    $("#printBtn").click(function () {
        var data = t.rows(['.selected']).data()[0];
        if(undefined===data){
            swal({
                type: 'warning',
                title: '提示:',
                text: '请首选选择一行数据!',
                confirmButtonColor: "#1ab394",
            })
        }else{
            printCode(data.id);
        }
    });

ajax请求方法

复制代码
function printCode(id){
    debugger
    $.ajax({
        type: 'POST',
        url: "/wmsReceiveOrder/doPrintPostRequest",
        cache: false,  //禁用缓存
        data:JSON.stringify({"id":id}),
        contentType: "application/json",
        dataType: "json",
        success: function (result) {
            debugger
            alert(result.message)
        }
    })
    return false;
}

来到url所对应的后台Controller中的方法

复制代码
@ResponseBody
    @RequestMapping(value = "/doPrintPostRequest")
    public Map<String, Object> doPrintPostRequest(@RequestBody Map<String, Object> params) {
         Map<String, Object> result = new HashMap<String, Object>();
        Object PrintId = params.get("id");
        String paramID="";
        if(PrintId!=null){
           paramID=PrintId.toString();
        }
        result.put("statusCode",  "200");
        result.put("message", "参数是:"+ paramID);
        return result;
    }

效果

相关推荐
Venuslite3 天前
从 Unexpected token < 到 Extra data:一次讲清 JSON 解析错误的排查思路
json
疯狂SQL9 天前
手写高性能在线 JSON 工具|Web Worker 工程化打包 + 语法自动修复 + 多语言代码生成实战
typescript·json·next.js·web worker·前端性能优化·esbuild·源码实战
学以智用14 天前
jQuery DataTables 完整实用教程
jquery
terry60014 天前
5G视频短信服务商选型全攻略:通道资源、架构能力与成本评估2026最新标准
大数据·人工智能·5g·json·asp.net·信息与通信·数据库架构
前网易架构师-高司机14 天前
带标注的辣椒病叶数据集,识别率95.9%,可识别三种病害和健康叶子,9916张图,支持yolo,coco json,voc xml,文末有模型训练代码
yolo·json·数据集·病害·叶病·病叶·辣椒
PixelBai14 天前
JSON扁平化使用教程:从入门到精通
json
渔舟唱晚,雁阵惊寒15 天前
CSDN博客内容丢失如何恢复?
json
衣乌安、15 天前
JSON-RPC协议
网络协议·rpc·json
PixelBai15 天前
JSON过滤使用教程:从入门到精通
javascript·chrome·json