数组不是'I don’我没有和其他表格一起寄出

array isn't being posted along with the rest of my form

本文关键字:其他 表格 一起 don 数组      更新时间:2023-09-26

我试图从谷歌地图API发布一个带有额外边界数组的表单,我已经研究了其他问题,隐藏表单主要与表单提交挂钩一起使用:

如何在提交前向表单添加其他字段?

在提交之前添加POST参数

所以这就是我一直在尝试做的事情——尽管我不确定为什么会发送默认值而不是我设置的值?

javascript:

var autocomplete = new google.maps.places.Autocomplete(document.getElementById('city'));
var autocomplete2 = new google.maps.places.Autocomplete(document.getElementById('destination'));
var directionsService = new google.maps.DirectionsService();
var rboxer = new RouteBoxer();
$("#form").submit(function(e) {
var req = {
    origin: $('#city').val(),
    destination: $('#destination').val(),
    travelMode: google.maps.TravelMode.DRIVING
};
var boundArray = [];
directionsService.route(req, function (response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
        var path = response.routes[0].overview_path;
        var boxes = rboxer.box(path, 30);
        for (var i = 0; i < boxes.length; i++) {
            boundArray.push(boxes[i].toUrlValue());
        }
        document.getElementById('bounds').setAttribute('value', JSON.stringify(boundArray));
        return true;
    }
});
});

html:

<input id="bounds" type="hidden" name="bounds"/>
<div class="form-group row">
<div class="col-lg-5">
    <button type="submit" value="Submit" id="subBtn" class="btn btn-lg btn-primary sub-btn">Confirm</button>
</div>
</div>

提前感谢

Dan

编辑:我已经更改了代码,所以现在我在POST请求中得到了一些东西——一个空白数组?

$("#form").submit(function(e) {
var req = {
    origin: $('#city').val(),
    destination: $('#destination').val(),
    travelMode: google.maps.TravelMode.DRIVING
};
var boundArray = [];
directionsService.route(req, function (response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
        var path = response.routes[0].overview_path;
        var boxes = rboxer.box(path, 30);
        for (var i = 0; i < boxes.length; i++) {
            boundArray.push(boxes[i].toUrlValue());
        }
    }
});
$('#bounds').val(JSON.stringify(boundArray));
return true;
});

谢谢,我似乎已经成功了:

function doAsync(callback) {
var req = {
    origin: $('#city').val(),
    destination: $('#destination').val(),
    travelMode: google.maps.TravelMode.DRIVING
};
var boundArray = [];
directionsService.route(req, function (response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
        var path = response.routes[0].overview_path;
        var boxes = rboxer.box(path, 30);
        for (var i = 0; i < boxes.length; i++) {
            boundArray.push(boxes[i].toUrlValue());
        }
        $("#bounds").val(JSON.stringify(boundArray));
        callback();
    }
});
}
$("#form").submit(function(e) {
doAsync(function () {
    $('#form').submit();
    return true;
});
//return false;
});

directionsService.route正在进行异步调用。在实际提交表单之前,需要等待服务调用完成。我修改了你的退出代码。希望这对你有用。。

var flag = false;
$("#form").submit(function(e) {
    var req = {
        origin: $('#city').val(),
        destination: $('#destination').val(),
        travelMode: google.maps.TravelMode.DRIVING
    };
    if(!flag)
    directionsService.route(req, function (response, status) {
        var boundArray = [];
        if (status == google.maps.DirectionsStatus.OK) {
            var path = response.routes[0].overview_path;
            var boxes = rboxer.box(path, 30);
            for (var i = 0; i < boxes.length; i++) {
                boundArray.push(boxes[i].toUrlValue());
            }
        }
        $('#bounds').val(JSON.stringify(boundArray));
        flag = true;
        $("#form").submit();
    });
    }else{
        flag = false;
        return true;
    }
    return false;
});