Question

如果您输入城市和州，则下面的代码有效，然后在文本框外部单击，但不直接在“搜索”提交按钮上单击。单击文本框外部会触发onblur事件，该事件触发javascript代码以在城市和州上运行bing map地理编码，并使用纬度和经度填充两个隐藏文本框。然后，当您单击提交按钮时，代码会将纬度和经度传递到作业控制器上的CityDistanceSort操作，该操作根据与传入的纬度和经度的距离对数据库中的城市进行排序，然后将已排序的模型发布到视图中。一切正常，除了你需要能够进入城市和州，然后当然只需直接点击提交按钮。但这样做并没有给JS代码时间地理编码并导致错误：参数字典包含非可空类型'System.Double的参数'SearchLatitude'的空条目......

@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));
    }

Answer 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
        });
    });
});

这显然不包括错误处理并做出一些假设......

MVC4从View调用Javascript函数

1 个答案: