0

以下のコードは、都市と州を入力してテキスト ボックスの外側をクリックすると機能しますが、[検索送信] ボタンを直接クリックすることはできません。テキスト ボックスの外側をクリックすると、onblur イベントがトリガーされ、JavaScript コードが起動されて都市と州で bing maps ジオコードが実行され、非表示の 2 つのテキスト ボックスに緯度と経度が入力されます。次に、送信ボタンをクリックすると、コードは緯度と経度をジョブ コントローラーの CityDistanceSort アクションに渡します。このアクションは、渡された緯度と経度からの距離に基づいてデータベース内の都市を並べ替え、並べ替えられたモデルをビューに投稿します。市と州を入力できる必要があることを除いて、すべてが機能します。もちろん、送信ボタンを直接クリックするだけです。しかし、そうすると、JS コードがジオコーディングする時間がなくなり、エラーが発生します。

@using(Html.BeginForm("CityDistanceSort", "Job"))
{     
    <input type="hidden" name="SearchLatitude" id="SearchLatitude"> 
    <input type="hidden" name="SearchLongitude" id="SearchLongitude"> 
    <input type="text" name="CityStateName" id="CityStateName" placeholder="CITY, BY DISTANCE" onblur="GeocodeSearchCityState()">   
    <input type="submit" value="SEARCH" />
}

    [HttpPost]
    public ActionResult CityDistanceSort(double SearchLatitude, double SearchLongitude)
    {
        var model = db.Jobs.ToList();
        foreach (var item in model)
            { item.PickupDistanceSort = ICN.CustomMethods.GetDistance(SearchLatitude, SearchLongitude, item.PickupLatitude, item.PickupLongitude); }
        return View("JobHeadings", model.OrderBy(s => s.PickupDistanceSort));
    }
4

1 に答える 1

1

XMLHttpRequestjQuery (オブジェクトを扱うための優れた抽象化を提供します) を使用できると仮定すると、次のように使用でき$.getます。

$(function(){
    $('#your-submit-button').on('click', function(e){

        e.preventDefault();

        $.get('your-action-url', { /* your data */ }, function(response, status, jqxhr){

            // this is the callback of the request for your geocode info
            // response is whatever your action returns; I recommend JSON

            // bind your values to their relevant inputs
            $('#your-latitude-input').val(response.latitude); // and so on

            $('#your-form-id').submit(); // when called with no parameters, triggers form submission
        });
    });
});

これには明らかにエラー処理が含まれておらず、いくつかの仮定があります...

于 2013-08-17T07:24:08.787 に答える