我有一個非常簡單的表格——只有三個欄位，其中只有兩個是由用戶通過下拉選單填寫的。第三個自動標記 DateTime.Now。我使用了一些我已經為其他表單準備好的腳手架中的表單提交代碼。當我將該代碼放入 Home 控制器（顯然是在更改了一些代碼之后）并構建了表單時，一切都提交得很好。所以我知道我的人脈和路徑都很好。
但是，提交后，它會重繪 整個頁面。我不能擁有那個。它只需要重繪 頁面上的特定 div。所以，我必須通過 Ajax 運行它。這是我頭上掉了一半頭發的地方...
當我記錄通過 Ajax 傳入的值時，正在獲得正確的值，但隨后我收到“Home/CreateBreak”的 500 錯誤，這正是控制器中的位置。這是控制臺在 Chrome 中的所有代碼和螢屏截圖。預先感謝您的任何幫助。
Home Controller：（創建條目時僅填寫 TimeEntered、EmployeeId 和 EmpPosition）。
//Create//
[HttpPost]
public async Task<IActionResult> CreateBreak([Bind("Id,TimeEntered,TimeCleared,EmpSent,EmployeeId,EmpPosition,RlfPosition")] Break newBreak)
{
if (ModelState.IsValid)
{
newBreak.TimeEntered = DateTime.Now;
_context.Add(newBreak);
await _context.SaveChangesAsync();
return Json(new { success = true, });
}
else
{
return Json(new { success = false });
}
}
阿賈克斯：
//Add Break
$(document).on("click", "#break_submit", function () {
var model = {};
model.EmployeeId = Number($("#EmpId").val());
model.EmpPosition = Number($("#EmployeePosition").val());
console.log("model", model);
$.ajax({
type: "Post",
url: "/Home/CreateBreak",
dataType: 'json',
data: JSON.stringify(model),
success: function (data) {
if (data.success)
{
$(" #headerRefresh ").load(window.location.href " #headerRefresh ");
$(" .dthRefresh ").load(window.location.href " .dthRefresh ");
}
else
alert("Error: Please enter your name AND position");
},
error: function () {
alert("Error: Please enter your name AND position");
}
});
});
形式：
@model Seating.ViewModels.ListsVM
<form id="ajax_submit" class="DthdropdownGroup ml-3">
<div class="btn-group" style="margin-left:-1rem">
<select class="form-group dropdownStyling btn-sm dropdown-toggle d-inline-block btn-outline-light" style="width: 7.4em;" id="EmpId">
<option disabled selected>Dispatcher</option>
@foreach (var item in Model.Employees)
{
<option class="dropdown-item pr-1 form-control" value="@item.Id">@item.DisplayName</option>
}
</select>
</div>
<div class="btn-group">
<select class="form-group dropdownStyling btn-sm dropdown-toggle d-inline-block btn-outline-light" style="width: 7.3em" id="EmployeePosition">
<option disabled selected>Position</option>
@foreach (var item in Model.Positions)
{
<option class="dropdown-item pr-1" value="@item.Id">@item.PositionName</option>
}
</select>
</div>
<button type="button" class="btn btn-sm btn-block dropdownStyling" id="break_submit" style="margin-left: -1rem; width:15rem;">Submit</button>
</form>
填充下拉串列的虛擬機（適用于所有表單 - 不僅僅是這個）：
namespace Seating.ViewModels
{
public class ListsVM
{
public ListsVM()
{
Employees = new List<Employee>();
Positions = new List<Position>();
}
public IEnumerable<Dth> Dths { get; set; }
public IEnumerable<Break> Breaks { get; set; }
public IEnumerable<Lunch> Lunches { get; set; }
public IEnumerable<Employee> Employees { get; set; }
public IEnumerable<Position> Positions { get; set; }
public int EmployeeId { get; set; }
public int EmpPosition { get; set; }
public bool EmpSent { get; set; }
public bool LunchTime { get; set; }
public bool LongerLunch { get; set; }
public bool DblLunch { get; set; }
}
}
還有，截圖。您可以看到日志顯示 Employee Id 3 和 Position 3 - 這是完美的。但隨后它變得混亂，無法弄清楚從那里去哪里——即使我告訴它確切的去哪里。
再次感謝
uj5u.com熱心網友回復：
恕我直言，您Controller使用結構不必要地使您的方法復雜Model化。由于您只需要將您的EmployeeId和EmpPosition變數發送到您的Controller方法，您可以這樣做：
//Add Break
$(document).on("click", "#break_submit", function () {
var EmployeeId = Number($("#EmpId").val());
var EmpPosition = Number($("#EmployeePosition").val());
var json = {
EmployeeId: EmployeeId,
EmpPosition: EmpPosition
};
console.log("Model", json);
$.ajax({
type: "post",
//url: "/Home/CreateBreak",
url: "@Url.Action("CreateBreak", "Home")",
dataType: "json",
data: {"json": JSON.stringify(json)},
success: function (data) {
if (data.success)
{
$(" #headerRefresh ").load(window.location.href " #headerRefresh ");
$(" .dthRefresh ").load(window.location.href " .dthRefresh ");
}
else
alert("Error: Please enter your name AND position");
},
error: function () {
alert("Error: Please enter your name AND position");
}
});
});
您的Controller方法將如下所示：
//Create//
[HttpPost]
public async Task<IActionResult> CreateBreak(string json)
{
Break newBreak=new Break();
int EmployeeId=0;
int EmpPosition=0;
if(!string.IsNullOrEmpty(json))
{
var jsonData = JsonConvert.DeserializeObject<dynamic>(json);
EmployeeId = Convert.ToInt32(jsonData.EmployeeId);
EmpPosition = Convert.ToInt32(jsonData.EmpPosition);
newBreak.EmployeeId = EmployeeId;
newBreak.EmpPosition = EmpPosition;
if (ModelState.IsValid)
{
newBreak.TimeEntered = DateTime.Now;
_context.Add(newBreak);
await _context.SaveChangesAsync();
return Json(new { success = true, });
}
else
{
return Json(new { success = false });
}
}
else
{
return Json(new { success = false });
}
}
uj5u.com熱心網友回復：
你有一個錯誤，因為你的動作輸入引數是空的。從 ajax 中洗掉 JSON.stringify(model)
$.ajax({
type: "Post",
url: "/Home/CreateBreak",
dataType: 'json',
data: model,
success: function (data) {
.....
或者如果你想使用 json 然后添加 contentType: application/json
$.ajax({
type: "Post",
url: "/Home/CreateBreak",
dataType: 'json',
contentType: 'application/json; charset=utf-8',
data: JSON.stringify(model),
success: function (data) {
...
并將 [FromBody] 添加到動作中
public async Task<IActionResult> CreateBreak([FromBody] Break newBreak)
uj5u.com熱心網友回復：
來自 ASP.NET 的 500 可能意味著在處理請求時在某個時間點引發了未處理的例外。我建議您將除錯器附加到網路服務器行程如果您還仔細檢查 URL 是否正確，這將有所幫助。
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/450927.html
標籤：javascript 阿贾克斯 asp.net-mvc asp.net 核心
上一篇：使用Selenium（Python）訪問URL時，JS/AJAX內容未加載
下一篇：我無法使用ajax傳遞img？