JQuery Ajax Post不能按預期工作

Question

我正在構建一個MVC 5 Web應用程序，它具有包含在佈局模板中的下拉列表。我按照上計算器這個答案，它工作得很好MVC 3 Layout Page, Razor Template, and DropdownList

我需要的是爲用戶從下拉列表中選擇一個項目（人名），以做出一個jQuery調用，然後將選擇的將列表ID下拉到Controller中的一個方法中。

我有一個下拉列表中聲明這樣

@Html.DropDownListFor(x => x.SelectedUserID, Model.UserList, "Select", new { @class = "form-control" }) 

當選擇項目時，下面的JQuery代碼被稱爲

$(document).ready(function() { 

$("#SelectedUserID").change(ChangeEventOfDDL); 

function ChangeEventOfDDL() { 

    alert("test val" + $(this).val()); 

    $.ajax({ 
     type: "POST", 
     url: '/Dashboard/Index/' + $(this).val(), 
     data: { id: $(this).val() }, 
     dataType: "json", 
     error: function() { 
      alert("An error occurred."); 
     }, 
     success: function (data) { 

     } 

    }); 
} 

}); 

這然後將選定的ID傳遞給索引方法在我的控制器

public ActionResult Index(int? id) 
    { 
     DashboardViewModel model = new DashboardViewModel(); 

     if(id == null || id == 0) 
     { 
      User user = _userService.GetUserByID(Convert.ToInt32(User.Identity.GetUserId())); 
      model.SelectedUser = user; 
     } 
     else 
     { 
      model.SelectedUser = _userService.GetUserByID(id.Value); 
     } 

     return View(model); 
    } 

這一切似乎工作正常。當我通過我的代碼進行調試時，我可以看到選定的下拉列表ID正在按照預期一直傳遞到我的控制器中的Index方法。問題是，當我完成遍歷代碼並返回到用戶界面時，出現JQuery錯誤，提示「發生錯誤」。這是我在我的JQuery函數中設置的默認錯誤消息。

因爲發生此錯誤，我的代碼無法正常工作。

我不知道爲什麼會發生這種情況，任何人都可以請幫忙嗎？

謝謝。

UPDATE

使用我用下面的代碼ChangeEventOfDLL功能內的Ajax調用之前，但是，它從來沒有真正打在儀表板的指數方法。

$.post('@Url.Action("Dashboard", "Index")', { id: $(this).val() }, function (result) { 
}); 

UPDATE

我改變我的JQuery這

$(document).ready(function() { 

$("#SelectedUserID").change(ChangeEventOfDDL); 

function ChangeEventOfDDL() { 

    alert("test val" + $(this).val()); 

    $.post('@Url.Action("Index", "Dashboard")', { id: $(this).val() }, function (result) { 
    }); 
} 

}); 

但仍Index方法不會被調用的控制器。

接下來我jQuery代碼更新到這個

$(document).ready(function() { 

$("#SelectedUserID").change(ChangeEventOfDDL); 

function ChangeEventOfDDL() { 

    alert("test val" + $(this).val()); 

    $.ajax({ 
     type: "POST", 
     url: '@Url.Action("Index","Dashboard")', 
     data: { id: $(this).val() }, 
     error: function() { 
      alert("An error occurred."); 
     }, 
     success: function (data) { 

     } 

    }); 

} 

}); 

但仍Index方法未在控制器打來電話，我仍然得到錯誤提示。

Answer 1

你逝去的datatype:json，而你正在返回從動作來看，和另一個錯誤是你逝去的ID在數據屬性，以及在網址爲好，這也是錯誤的： 這應該是：

$.ajax({ 
    type: "POST", 
    url: '/Dashboard/Index/' + $(this).val(), 
    data: { id: $(this).val() }, 
    dataType: "json", 
    error: function() { 
     alert("An error occurred."); 
    }, 
    success: function (data) { 

    } 

}); 

這樣的：

var id = $(this).val(); 
$.ajax({ 
    type: "POST", 
    url: '@Url.Action("Index","Dashboard")', 
    data: { id: id }, 
    error: function() { 
     alert("An error occurred."); 
    }, 
    success: function (data) { 

    } 

}); 

注：始終使用Url.Action幫助您創建動作URL，這樣就不會創建實時部署問題。

public ActionResult Index(int? id) 
    { 
     DashboardViewModel model = new DashboardViewModel(); 

     if(id == null || id == 0) 
     { 
      User user = _userService.GetUserByID(Convert.ToInt32(User.Identity.GetUserId())); 
      model.SelectedUser = user; 
     } 
     else 
     { 
      model.SelectedUser = _userService.GetUserByID(id.Value); 
     } 

     return JsonResult(model,JsonRequestBehavior.AllowGet); 
    } 

，然後你必須把數據類型：：「JSON」在Ajax調用，如果你只想返回對象無法查看再做這樣

。

更新：

製作DDL事件是這樣的：

$("#SelectedUserID").change(function(){ 

ChangeEventOfDDL($(this).val()); 

}); 

你的函數：

function ChangeEventOfDDL(id) 
{ 
$.ajax({ 
     type: "POST", 
     url: '@Url.Action("Index","Dashboard")', 
     data: { id: id }, 
     error: function() { 
      alert("An error occurred."); 
     }, 
     success: function (data) { 

     } 

    }); 
} 

Answer 2

，因爲您所指定的數據類型，因爲它是去到誤差函數JSON 因此dataType: 'json'但是您不會將JSON返回給您的函數重新返回一個視圖，這就是爲什麼錯誤被拋出。將您的Action Result更改爲Json結果並執行此操作。

public JsonResult(int? id) 
{ 
     // blah blah blah 
     return Json(model.SelectedUser, JsonRequestBehavior.AllowGet); 

} 

Answer 3

然後刪除dataType:"json"從你的AJAX設立

而在你的行動使用的return PartialView("ViewName",model)代替​​

如果您返回局部視圖否則返回視圖（）

Answer 4

*>只在你的Mvc控制器中寫入這條線的功能

Configuration.ProxyCreationEnabled = fals *

e;