Не удается отобразить связанные данные с таблицами данных в ASP.NET сердечник
Не знаю, как отобразить связанные данные в моем представлении "подробности" с помощью плагина DataTables, где JobID имеет связанные проблемы. Использование таблиц данных для визуализации данных в 3 таблицах в этой структуре отношений:
Задание 1-м результат М-1 Задача.
Шаги, которые я предпринял, чтобы воспроизвести эту проблему:
Я скачать объекты DataTable здесь и установить в соответствии wwwroot в/в JS/:
Скачать[^]
Вот этот код.
public class JobsController : Controller
{
private readonly TeamContext _context;
public JobsController(TeamContext context)
{
_context = context;
}
// GET: Jobs
// COPY AND PASTE THIS METHOD CUSTOMIZATION INTO OTHER CONTROLLERS. Enables sorting.
public IActionResult Index()
{
return View();
}
public IActionResult GetAllJobs()
{
return Json(_context.Jobs.ToList());
}
public IActionResult GetAllProblemByJobId(int? ID)
{
if (ID == null)
{
return NotFound();
}
var resultlist = _context.Results.Where(r => r.JobID == ID).ToList();
var problemlist = new List<Problem>();
resultlist.ForEach(r =>
{
r.Problem = _context.Problems.Find(r.ProblemID);
if (r.Problem != null)
{ problemlist.Add(r.Problem); }
});
return Json(problemlist);
}
// GET: Jobs/Details/5
// COPY AND PASTE THIS METHOD CUSTOMIZATION INTO OTHER CONTROLLERS.
public IActionResult Details(int? ID)
{
if (ID == null)
{
return NotFound();
}
var job = _context.Jobs.Find(ID);
return View(job);
}
}
public class Job
{
public int ID { get; set; }
[Required]
[StringLength(20, MinimumLength = 3, ErrorMessage = "Job Title must be bettween 3 to 20 characters.")]
[DataType(DataType.Text)]
[Display(Name = "Job Title")]
[Column("JobTitle")]
public string JobTitle { get; set; }
[StringLength(200, MinimumLength = 3, ErrorMessage = "Job Description must be bettween 200 to 3 characters.")]
[DataType(DataType.Text)]
[Display(Name = "Description")]
[Column("JobDescription")]
public string JobDescription { get; set; }
[Required]
[DataType(DataType.Date)]
[DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
[Display(Name = " Start Date")]
[Column("JobStartDate")]
public DateTime JobStartDate {get;set;}
[DataType(DataType.Date)]
[DisplayFormat(DataFormatString = "{0:yyyy-MM-dd}", ApplyFormatInEditMode = true)]
[Display(Name = "Deadline Date")]
[Column("JobDeadlineDate")]
public DateTime JobDeadline {get;set;}
[Display(Name = "Job Is Complete?")]
[Column("JobIsComplete")]
public bool JobIsComplete{get;set;}
public ICollection<Registration> Registrations {get;set;}
public ICollection<Result> Results {get;set;}
}
public class Result
{
[Key]
public int ID {get;set;}
public int JobID {get;set;}
public int ProblemID {get;set;}
public Job Job {get;set;}
public Problem Problem {get;set;}
}
Вакансии\Индекс
@model Pitcher.Models.Job
@{
ViewData["Title"] = "Jobs";
}
<h1>Jobs</h1>
<p>
<a asp-action="Create">Create New</a>
</p>
<table id="jobTable" class="table">
<thead>
<tr>
<th>
@Html.DisplayNameFor(model => model.ID)
</th>
<th>
@Html.DisplayNameFor(model => model.JobTitle)
</th>
<th>
@Html.DisplayNameFor(model => model.JobDescription)
</th>
<th>
@Html.DisplayNameFor(model => model.JobStartDate)
</th>
<th>
@Html.DisplayNameFor(model => model.JobDeadline)
</th>
<th>
@Html.DisplayNameFor(model => model.JobIsComplete)
</th>
<th>
</th>
</tr>
</thead>
<tbody></tbody>
</table>
@section scripts{
<script src="~/js/jquery.dataTables.min.js"></script>
<script>
var oTable = $('#jobTable').DataTable({
"ajax": {
type: 'get',
'dataType': "json",
"url": "@Url.Action("GetAllJobs")",
"dataSrc": function (result) {
return result;
}
},
"columns": [
{ "data": "ID"},
{ "data": "JobTitle"},
{ "data": "JobDescription"},
{ "data": "JobStartDate"},
{ "data": "JobDeadline"},
{
"data": "JobIsComplete",
"render": function (data) {
if (data) {
return "IsComplete";
} else {
return "Not Complete";
}
}
},
{
"data": null,
"render": function (value) {
return
'<a href="/Jobs/Details/' + value.ID + '"button type="button" class="btn btn-primary btn-block">Details</a> <br> '
+
'<a href="/Jobs/Edit/' + value.ID + '"button type="button" class="btn btn-info btn-block">Edit </a> <br> '
+
'<a href="/Jobs/Delete/' + value.ID + '"button type="button" class="btn btn-primary btn-block">Delete</a>';
}
}
]
});
</script>
}
Вакансии\Детали
@model Pitcher.Models.Job
@using Pitcher.Models
@{
var problem = new Problem();
}
@{
ViewData["Title"] = "Details";
}
<h1>Details</h1>
<table id="CurrentJobTable" class="table">
<thead>
<tr>
<th>@Html.DisplayNameFor(model => model.ID)</th>
<th>@Html.DisplayNameFor(model => model.JobTitle)</th>
<th>@Html.DisplayNameFor(model => model.JobDescription)</th>
<th>@Html.DisplayNameFor(model => model.JobStartDate)</th>
<th>@Html.DisplayNameFor(model => model.JobDeadline)</th>
<th>@Html.DisplayNameFor(model => model.JobIsComplete)</th>
</tr>
</thead>
<tbody>
<tr>
<td>@Html.DisplayTextFor(model => model.ID)</td>
<td>@Html.DisplayTextFor(model => model.JobTitle)</td>
<td>@Html.DisplayTextFor(model => model.JobDescription)</td>
<td>@Html.DisplayTextFor(model => model.JobStartDate)</td>
<td>@Html.DisplayTextFor(model => model.JobDeadline)</td>
<td>@Html.DisplayTextFor(model => model.JobIsComplete)</td>
</tr>
</tbody>
</table>
<table id="ProblemsTable" class="table">
<thead>
<tr>
<th>
@Html.DisplayNameFor(problemmodel => problem.ID)
</th>
<th>
@Html.DisplayNameFor(problemmodel => problem.ProblemTitle)
</th>
<th>
@Html.DisplayNameFor(problemmodel => problem.ProblemDescription)
</th>
<th>
@Html.DisplayNameFor(problemmodel => problem.ProblemStartDate)
</th>
<th>
@Html.DisplayNameFor(problemmodel => problem.ProblemFileAttachments)
</th>
<th>
@Html.DisplayNameFor(problemmodel => problem.ProblemSeverity)
</th>
<th>
@Html.DisplayNameFor(problemmodel => problem.ProblemComplete)
</th>
</tr>
</thead>
<tbody></tbody>
</table>
@section scripts{
<script src="~/js/jquery.dataTables.min.js"></script>
<script>
var id=@Model.ID;
$('#ProblemsTable').DataTable({
"ajax": {
'type': 'get',
'data': { ID: id},
'dataType': "json",
"url": "@Url.Action("GetAllProblemByJobId")",
"dataSrc": function (result) {
return result;
}
},
"columns": [
{ "data": "ID"},
{ "data": "ProblemTitle"},
{ "data": "ProblemDescription"},
{ "data": "ProblemStartDate"},
{ "data": "ProblemFileAttachments"},
{ "data": "ProblemSeverity" },
{ "data": "ProblemComplete" }
]
});
</script>
}
Ожидаемое поведение
Это создает проблему.
Фактическое поведение
Ят не передает проблему.
Данные об окружающей среде
`.Объем основной SDK (отражающих какие-либо глобальные.в JSON):
Версия: 2.2
среда выполнения:
Имя операционной системы: Windows
Версия ОС: 10.0.18363
Платформа операционной системы: Windows
RID: win10-x64
Что я уже пробовал:
Искал по всему интернету и не могу найти ответа на свою проблему, к сожалению. Поэтому, чтобы быть явным, я хочу отобразить все записи проблем в подробном представлении, но не уверен, как это сделать правильно.
Я использовал этот учебник, но моя логика отличается, потому что в учебнике они делают это в Индексе, в то время как я делаю это в подробном представлении.
Richard Deeming
Насколько я вижу, в вашем коде нет ничего явно неправильного. Вероятно, это проблема с вашими данными, к которым у нас нет доступа.
Проверьте консоль разработчика Вашего браузера на наличие ошибок. Убедитесь, что запрос XHR для GetAllProblemByJobId действие выполняется и содержит ожидаемые параметры. Проверьте, не возвращает ли он какие-либо ошибки. Отладьте свой серверный код, чтобы увидеть, есть ли что-то не так с запросом.
NB: Вы можете упростить свой запрос и повысить производительность с помощью свойства навигации:
public IActionResult GetAllProblemByJobId(int? ID)
{
if (ID == null) return NotFound();
var problemlist = _context.Results.Where(r => r.JobID == ID).Select(r => r.Problem).ToList();
return Json(problemlist);
}
Jordan Nash
Спасибо. Ваш код фактически решил мою проблему, и теперь появляются все перечисленные проблемы.