在提交表单

时间:2017-03-07 06:25:55

标签: jquery forms geolocation location form-submit

如果离开emtpy,我会尝试以提交格式填写城市名称。我有这个代码来获取用户所在的城市。

    var form = $("form.js-reservation-form");
    form.submit(function(e) {        
            $.getJSON("http://www.geoplugin.net/json.gp?jsoncallback=?", function(data) {
                console.log(data.geoplugin_city);
                $("input.geocity").val(data.geoplugin_city);       
            });
....
rest of code ....
});

问题是表单是在地理编码返回值之前提交的。如何更改代码以先等待geoplugin返回值,然后运行其余代码?

1 个答案:

答案 0 :(得分:0)

我创造了小提琴,以展示它是如何运作的。由于限制我无法查询你json,所以我模拟它,以显示它是如何工作的 - https://jsfiddle.net/skyr9999/w5tun6nz/

这是html:

<form class="js-reservation-form">
  <input class="geocity" type="input">
  <button type="button" id="submit-form">Submit</button>
</form>

和js

$(".js-reservation-form").click(function (e) {
    $.ajax({
        type: "POST",
        url: "/echo/json/",
        data: {"json": JSON.stringify({"geoplugin_city": "Magadan"})},
        cache: false,
        success: function (data) {
            console.log(data.geoplugin_city);
            $("input.geocity").val(data.geoplugin_city);
            //$('form.js-reservation-form').submit();

        }});
});

所以它是如何工作的 - 首先只有普通按钮和绑定它的事件,然后它执行ajax查询以获取JSON,你可以使用你的URL并摆脱data如果不是要求。在为input.geocity设置的JSON加载值和由jquery提交的表单之后。

我评论提交代码,因为它会导致快速错误,在您的代码中,您必须取消注释此字符串//$('form.js-reservation-form').submit();