通過Ajax調用將數據從asp.net MVC控制器傳遞到View

Question

大家好，我嘗試使用Ajax遇到了一些麻煩，我想了解發生了什么。 好吧，我有這個控制器，它正在返回Guider Model的列表，這是我的控制器：

[HttpGet]
        public JsonResult ShowGuiders(string latitude, string longitude)
        {
            double lat = DataTypeConvert.ConvertToDouble(latitude);
            double lon = DataTypeConvert.ConvertToDouble(longitude);
            GeoCoordinate geoCoordinateFrom = new GeoCoordinate(lat, lon);

            var nearbyGuiders = (from guider in db.Guiders.AsEnumerable()
                                 let distance = geoCoordinateFrom.GetDistanceTo(new GeoCoordinate(guider.Latitude.Value, guider.Longitude.Value))
                                 where distance <= 100000
                                 orderby distance ascending
                                 select guider).ToList();
            return Json(nearbyGuiders, JsonRequestBehavior.AllowGet);

        }

這是我的腳本：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#btnGet").click(function () {
                var coordinate = {
                    "Latitude": $("#latitude").val(),
                    "Longitude": $("#longitude").val()
                };
                $.ajax({
                    type: 'GET',
                    url: '@Url.Action("ShowGuiders", "Guider")',
                    data: { latitude: coordinate.Latitude, longitude: coordinate.Longitude },
                    dataType: "json",
                    contentType: "application/json;charset=utf-8",
                    success: function (result) {
                        // Result
                        alert("Succes");
                    },
                    error: function (response) {
                        //do your own thing
                        alert("fail");
                    }
                });
            }); //end .submit()
        });
    </script>

最后是我的指導者模型：

public class Guider
    {
        [Key]
        [ForeignKey("ApplicationUser")]
        public string GuiderID { get; set; }
        //code...
        public double? Latitude { get; set; }
        public double? Longitude { get; set; }
        public bool IsAccepted { get; set; }

        [ForeignKey("CancellationPolicy")]
        public int? CancellationPolicyID { get; set; }

        [ForeignKey("Premium")]
        public int? PremiumID { get; set; }

        public virtual Premium Premium { get; set; }
        public virtual CancellationPolicy CancellationPolicy { get; set; }
        public virtual ApplicationUser ApplicationUser { get; set; }

        public virtual ICollection<UnavailableDate> UnavailableDates { get; set; }

    }

很好的問題是，每當我嘗試返回Guider列表時，都沒有發生任何事情，而ajax的錯誤功能事件也在增加。 因此，我嘗試只返回一個Guided對象，並且evrything運行良好。 該控制器正在正常運行：

[HttpGet]
        public JsonResult ShowGuiders(string latitude, string longitude)
        {

            myGuider.Country = "Greece";
            return Json(myGuider, JsonRequestBehavior.AllowGet);

        }

因此，我發現Json不會支持我的對象層次結構。 所以我用匿名對象解決了我的問題。 我這樣修改了控制器，並返回了所需的屬性：

[HttpGet]
        public JsonResult ShowGuiders(string latitude, string longitude)
        {
            double lat = DataTypeConvert.ConvertToDouble(latitude);
            double lon = DataTypeConvert.ConvertToDouble(longitude);
            GeoCoordinate geoCoordinateFrom = new GeoCoordinate(lat, lon);

            var nearbyGuiders = (from guider in db.Guiders.AsEnumerable()
                                 let distance = geoCoordinateFrom.GetDistanceTo(new GeoCoordinate(guider.Latitude.Value, guider.Longitude.Value))
                                 where distance <= 100000
                                 orderby distance ascending
                                 select new { country = guider.Country } ).ToList();
            return Json(nearbyGuiders, JsonRequestBehavior.AllowGet);

        }

Answer 1

 $("#btnGet").click(function () { var coordinate = { "Latitude": $("#latitude").val(), "Longitude": $("#longitude").val() }; $.ajax({ type: 'GET', url: '@Url.Action("ShowGuiders", "Guider")', data: { latitude: coordinate.Latitude, longitude:coordinate.Longitude }, success: function (result) { // Result alert("Succes"); }, error: function (response) { //do your own thing alert("fail"); } });