0

如果您输入城市和州,然后在文本框外部单击而不是直接在搜索提交按钮上,则下面的代码有效。在文本框外部单击会触发 onblur 事件,该事件会触发 javascript 代码以在城市和州上运行 bing 地图地理编码,并使用纬度和经度填充两个隐藏的文本框。然后,当您单击提交按钮时,代码将纬度和经度传递给 Job 控制器上的 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

假设你可以使用 jQuery(它为处理XMLHttpRequest对象提供了一个很好的抽象),你可以做这样的事情,使用$.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 回答