3

単一のフォームを含むページがあります。フォームには、テキストボックスと送信ボタンが含まれています。

ボタンをクリックするか、テキストボックスでEnterキーを押してフォームを送信するときに、ルックアップ（この場合は、Bing Mapsを使用して郵便番号をジオコーディングする）を実行してから、通常どおりフォームをサーバーに送信します。 。

私の現在のアプローチは、送信イベントのハンドラーを唯一のフォームに追加し、終了したらsubmit（）を呼び出すことですが、これを機能させることができず、実行できませんでした問題をデバッグします。

$(document).ready(function () {
    $("form").submit(function (event) {
        var postcode = $.trim($("#Postcode").val());
        if (postcode.length === 0) {
            return false;
        }

        var baseUrl = "http://dev.virtualearth.net/REST/v1/Locations/UK/";
        var apiKey = "myKey";
        var url = baseUrl + postcode + "?key=" + apiKey + "&jsonp=?";
        $.getJSON(url, function (result) {
            if (result.resourceSets[0].estimatedTotal > 0) {
                var location = result.resourceSets[0].resources[0].point.coordinates;
                $("#latitude").val(location[0]);
                $("#longitude").val(location[1]);
                $("form").submit();
            }
        });
    });
});
4

1 に答える 1

5

event.preventDefault()ここにあなたの友達です。基本的に、ここと同じ問題が発生しています。フォームは、実際のajaxリクエストを実行する前に送信されます。フォームの送信を停止してから、ajaxを実行してから、フォームの送信を実行する必要があります。あなたがそこにいくつかの停止を入れないならば、それはただそれを通り抜けるでしょう、そしてそれがする時間がある唯一のことはフォームを提出することです。

 $(document).ready(function () {
        $("form").submit(function (event) {

// prevent default form submit
    event.preventDefault();
            var postcode = $.trim($("#Postcode").val());
            if (postcode.length === 0) {
                return false;
            }


            var baseUrl = "http://dev.virtualearth.net/REST/v1/Locations/UK/";
            var apiKey = "myKey";
            var url = baseUrl + postcode + "?key=" + apiKey + "&jsonp=?";
            $.getJSON(url, function (result) {
                if (result.resourceSets[0].estimatedTotal > 0) {
                    var location = result.resourceSets[0].resources[0].point.coordinates;
                    $("#latitude").val(location[0]);
                    $("#longitude").val(location[1]);
                    $("form").submit();
                }
            });
        });
    });

ただし、そこに入れると、フォームの送信をpreventDefault続行できなくなり$('form').submit();ます。それをajaxリクエストとして送信するか、条件をに定義する必要がありますpreventDefault。

おそらくこのようなもの：

$(document).ready(function () {

    var submitForReal = false;
        $("form").submit(function (event) {

            var postcode = $.trim($("#Postcode").val());
            if (postcode.length === 0) {
                return false;
            }
    // prevent default form submit
    if(!submitForReal){
    event.preventDefault();
    }else{



            var baseUrl = "http://dev.virtualearth.net/REST/v1/Locations/UK/";
            var apiKey = "myKey";
            var url = baseUrl + postcode + "?key=" + apiKey + "&jsonp=?";
            $.getJSON(url, function (result) {
                if (result.resourceSets[0].estimatedTotal > 0) {
                    var location = result.resourceSets[0].resources[0].point.coordinates;
                    $("#latitude").val(location[0]);
                    $("#longitude").val(location[1]);
                    submitForReal = true;
                    $("form").submit();
                }
            });
          }
        });
    });
于 2011-05-29T10:51:02.127 に答える