繁体   English   中英

在ajax调用中遇到解析错误,但数据已成功传递

[英]Getting a parse-error in ajax call but the data is getting passed successfully

因此,我有一个基本形式,该形式需要一个地址,获取经度/纬度,然后我试图将经度/纬度值传递给我的API。 该API正在获取变量,但是在成功传递后,我的ajax调用中出现了解析错误。

<form method="GET">
     <input id="address" type="text">
     <button id='searchRadius' type="submit">Search</button>
</form>  

阿贾克斯电话

$('#searchRadius').on('click', function (e) {

    var lati;
    var lng;
    var rad = 30;
    var address = $('#address').val();


    e.preventDefault(); 


    $.ajax({
        type: "GET",
        url: "http://www.mapquestapi.com/geocoding/v1/address?key=LIhb6pFxB7qAlFC4Aiul9rM9i7R5BcgB&location=" + address,
        beforeSend: function (xhr) {
            xhr.setRequestHeader("Accept", "application/json");
            xhr.setRequestHeader("Content-type", "application/json");
        },
        success: function postForm(response) {
            lati = response.results[0].locations[0].latLng.lat;
            lng = response.results[0].locations[0].latLng.lng;

            console.log(lati, lng, rad);

            $.ajax({
                url: contextRoot + "/map/radius",
                type: "GET",
                data: {"lati": lati},
                dataType: "json",
                beforeSend: function (xhr) {
                    xhr.setRequestHeader("Accept", "application/json");
                    xhr.setRequestHeader("Content-type", "application/json");
                },
                success: function (data, status) {
                    console.log(data);

                },
                error: function (data, status) {
                    alert("bad api call");
                    console.log(status);
                }
            });
        },
        error: function (data, status) {
            console.log(data.errors);
        }}
    );
});  

api调用

 @RequestMapping(value = "/radius", method = RequestMethod.GET)
    @ResponseBody
    public String radiusSearch(HttpServletRequest request, Map model) {

        String n1 = request.getParameter("lati");

        return "redirect: /";
    }  

所以我得到参数“ lati”,但它不会重定向页面,然后在第二个ajax调用中出现错误。 在传递变量之前是否需要JSON.Stringify变量? 我确实需要将变量“ lati”,“ lng”,“ rad”传递给api,但是我试图让它首先与它一起工作。

当您使用Ajax时,Spring控制器假定返回文本,String或json。 为什么?

因为您的Ajax成功方法希望接收文本,字符串或json。

这意味着您不能将重定向作为Ajax响应执行

因此,如果要返回lati变量的文本, lati执行以下操作:

@RequestMapping(value = "/radius", method = RequestMethod.GET)
@ResponseBody
public String radiusSearch(HttpServletRequest request, Map model) {

    String n1 = request.getParameter("lati");

    return n1;
}  

如果您想返回一些参数 ,那么可以,json是一个不错的选择。

您可以使用jackson-databind jar轻松完成此操作,您要做的就是返回一个包含这3个变量的对象,当然,您的控制器@ResponseBody需要@ResponseBody批注。

还有一件事,在客户端Ajax调用上,您需要标记您希望接收json类型。 datatype: "json" ,如下所示:

$.ajax({
        type: "GET",
        url: "http://www.mapquestapi.com/geocoding/v1/address?


        datatype: "json"



key=LIhb6pFxB7qAlFC4Aiul9rM9i7R5BcgB&location=" + address,
        beforeSend: function (xhr) {
            xhr.setRequestHeader("Accept", "application/json");
            xhr.setRequestHeader("Content-type", "application/json");
        },
        success: function postForm(response) {
            lati = response.results[0].locations[0].latLng.lat;
            lng = response.results[0].locations[0].latLng.lng;

            console.log(lati, lng, rad);
});

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM