我正在编写一个捕获变量数据列表的程序，我试图将其通过 jQuery 传递到 .Net core 6.0 MVC 控制器。
数据模型是这样的
namespace RTS_RecruiterSystem.Models.ViewModels
{
public class ScreeningViewModel
{
public int CandidateId { get; set; }
public string TypeRequirement { get; set; } = string.Empty;
public int ScreeningId { get; set; }
public bool SelectedOption { get; set; }
}
}
这是表单所在视图的部分
<form id="frmScreeningProcess" method="post" enctype="multipart/form-data" autocomplete="off">
<div class="mt-4">
<!-- Agregar una barra de botones Guardar/Limpiar/Regresar para ventana Modal -->
<div class="row">
<div class="col-md-3 offset-md-9 d-flex justify-content-end">
@*<button type="submit" name="currentTab" value="screening-tab-pane" id="btnSaveScreening" class="btn btn-primary btn-md" title="Save Form"><i class="fa-solid fa-floppy-disk pe-2"></i> Save Result</button>*@
<button type="submit" name="currentTab" value="screening-tab" id="btnSaveScreening" class="btn btn-primary btn-md" title="Save Form"><i class="fa-solid fa-floppy-disk pe-2"></i> Save Result</button>
</div>
</div>
<hr />
<div class="row">
<div class="col-md-6">
<div class="row">
<h4><i class="far fa-circle-check pe-2"></i> Must to have</h4>
<div class="col-md-12">
<hr class="blue-separator" />
<div class="table table-responsive">
<div class="scroll-container" style="max-height: 400px; overflow-y: auto; border: 1px solid #ccc;">
<table id="MustToHaveTable" class="table table-striped table-hover table-responsive">
<thead class="table-blue-sm">
<tr>
<th>@Html.DisplayNameFor(m => m.ListCandidateScrViewModel[0].ScreeningId)</th>
<th>@Html.DisplayNameFor(m => m.ListCandidateScrViewModel[0].ScreeningName)</th>
<th>@Html.DisplayNameFor(m => m.ListCandidateScrViewModel[0].ScreeningValue)</th>
</tr>
</thead>
<tbody class="dataTableBody-md">
@{
for (int i = 0; i < Model.ListCandidateScrViewModel.Count; i++)
{
idYes = "ListCandidateScrViewModel_" + i + "__SelectedOption";
idNo = "ListCandidateScrViewModel_" + i + "__SelectedOptionNo";
if (Model.ListCandidateScrViewModel[i].TypeRequirement == "M")
{
<tr id="ListCandidateScreeningViewModel_@i">
@Html.HiddenFor(m => m.ListCandidateScrViewModel[i].CandidateId, new { @class = "form-control" })
@Html.HiddenFor(m => m.ListCandidateScrViewModel[i].ScreeningId, new { @class = "form-control" })
@Html.HiddenFor(m => m.ListCandidateScrViewModel[i].ScreeningName, new { @class = "form-control" })
@Html.HiddenFor(m => m.ListCandidateScrViewModel[i].TypeRequirement, new { @class = "form-control" })
<td class="text-center" style="width:10%">@Html.DisplayFor(m => m.ListCandidateScrViewModel[i].ScreeningId)</td>
<td style="width:65%">@Html.DisplayFor(m => m.ListCandidateScrViewModel[i].ScreeningName)</td>
<td class="text-center" style="width:25%">
<div class="col-md-12">
<div class="form-check form-check-inline">
<input type="radio" class="form-check-input" asp-for="ListCandidateScrViewModel[i].SelectedOption" value="Yes">
<label class="form-check-label" for="@idYes">Yes</label>
</div>
<div class="form-check form-check-inline">
<input type="radio" class="form-check-input" asp-for="ListCandidateScrViewModel[i].SelectedOption" id="@idNo" value="No">
<label class="form-check-label" for="@idNo">No</label>
</div>
</div>
</td>
</tr>
}
}
}
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</form>
这是控制器
[HttpPost]
public JsonResult SaveScreening(List<ScreeningViewModel> lstScreeningViewModel)
{
// Acciones
return Json(new { success = true, message = "Cambios guardados correctamente" });
}
在我的脚本中
$("#frmScreeningProcess").on("submit", function (e) {
var lstScreeningViewModel = [];
// Obtener el número de filas en la tabla
var totalRows = $('#MustToHaveTable tr').length - 1;
for (i = 0; i < totalRows; i++) {
var candidateId = parseInt($("#ListCandidateScrViewModel_" + i + "__CandidateId").val());
var typeRequirement = $("#ListCandidateScrViewModel_" + i + "__TypeRequirement").val();
var screeningId = parseInt($("#ListCandidateScrViewModel_" + i + "__ScreeningId").val());
var selectedOption = $("#ListCandidateScrViewModel_" + i + "__SelectedOption").prop("checked");
lstScreeningViewModel.push({
CandidateId: candidateId,
TypeRequirement: typeRequirement,
ScreeninigId: screeningId,
SelectedOption: selectedOption
});
};
$.ajax({
type: "POST",
url: "/Candidate/SaveScreening",
contentType: "application/json; charset=utf-8",
dataType: "json",
data: JSON.stringify({ lstScreeningViewModel: lstScreeningViewModel } ),
success: function (response) {
// Maneja la respuesta del servidor
if (response.success) {
console.log("Datos actualizados correctamente");
} else {
alert("Error al guardar los cambios");
}
},
error: function () {
alert("Error en la solicitud AJAX");
}
});
});
这是将 ajax 发送到控制器的数组：
[
{"CandiateId": 1, "TypeRequirement": "M", "ScreeninigId": 1, "SelectedOption": true},
{"CandiateId": 1, "TypeRequirement": "M", "ScreeninigId": 2, "SelectedOption": false},
{"CandiateId": 1, "TypeRequirement": "M", "ScreeninigId": 3, "SelectedOption": true},
{"CandiateId": 1, "TypeRequirement": "M", "ScreeninigId": 4, "SelectedOption": false},
{"CandiateId": 1, "TypeRequirement": "M", "ScreeninigId": 5, "SelectedOption": true},
{"CandiateId": 1, "TypeRequirement": "M", "ScreeninigId": 6, "SelectedOption": false}
]
问题是我无法让控制器正确接收数据，因为它没有接收到任何内容并且不会产生任何错误。
任何解决问题的建议
当您在输入参数中定义列表时，无论如何参数值（lstScreeningViewModel）必须有数据，以防这是空值，所以也许您需要在控制器中的 lstScreeningViewModel 之前添加 [FromBody] 属性
[HttpPost]
public JsonResult SaveScreening([FromBody] List<ScreeningViewModel> lstScreeningViewModel)
{
// Acciones
return Json(new { success = true, message = "Cambios guardados correctamente" });
}
最后我给你一个建议，使用 Postman 应用程序直接测试你的控制器并单独调试它的前端问题（ajax）。所以调试速度比现在更快！