Почему не отображаются данные в календаре (.net core 2.2)

Question

У меня есть таблица базы данных некоторых курсов. Я пытаюсь добавить новый курс в эту базу данных и затем отобразить его в календаре, но я вижу ошибку error3.

function SaveCourse(data) {
                    $.ajax({
                        type: "POST",
                        url: '/home/SaveCourse',
                        data: data,
                        success: function (data) {
                            if (data.any) {
                                //Refresh the calender
                                FetchCourseAndRenderCalendar();
                                $('#myModalSave').modal('hide');
                            }

                        },
                        error: function () {
                            alert('Failed3'); 
                        }
                    });
                }

У меня есть календарь, и мне нужно добавить новый курс. Я нажимаю добавить, появляется форма ... Я заполняю ее и одновременно вижу ошибку (Failed3), при отладке я вижу данные в контроллере (SaveCourse (курс c))

здесьмой индекс

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>
<div id="calender"></div>

<div id="myModal" class="modal fade" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title"><span id="courseTitle"></span></h4>
            </div>
            <div class="modal-body">
                <button id="btnDelete" class="btn btn-default btn-sm pull-right">
                    <span class="glyphicon glyphicon-remove"></span> Remove
                </button>
                <button id="btnEdit" class="btn btn-default btn-sm pull-right" style="margin-right:5px;">
                    <span class="glyphicon glyphicon-pencil"></span> Edit
                </button>
                <p id="pDetails"></p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

<div id="myModalSave" class="modal fade" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Save Course</h4>
            </div>
            <div class="modal-body">
                <form class="col-md-12 form-horizontal">
                    <input type="hidden" id="hdCourseID" value="0" />
                    <div class="form-group">
                        <label>Subject</label>
                        <input type="text" id="txtSubject" class="form-control" />
                    </div>
                    <div class="form-group">
                        <label>Start</label>
                        <div class="input-group date" id="dtp1">
                            <input type="text" id="txtStart" class="form-control" />
                            <span class="input-group-addon">
                                <span class="glyphicon glyphicon-calendar"></span>
                            </span>
                        </div>
                    </div>
                    <div class="form-group" id="divEndDate" style="display:none">
                        <label>End</label>
                        <div class="input-group date" id="dtp2">
                            <input type="text" id="txtEnd" class="form-control" />
                            <span class="input-group-addon">
                                <span class="glyphicon glyphicon-calendar"></span>
                            </span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label>Description</label>
                        <textarea id="txtDescription" rows="3" class="form-control"></textarea>
                    </div>
                    <div class="form-group">
                        <label>Column Color</label>
                        <select id="ddColumnColor" class="form-control">
                            <option value="green">Default</option>
                            <option value="blue">Blue</option>
                        </select>
                    </div>
                    <button type="button" id="btnSave" class="btn btn-success">Save</button>
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </form>
            </div>
        </div>
    </div>
</div>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.min.css" rel="stylesheet" />
<link href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.min.css" rel="stylesheet" />
<link href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.print.css" rel="stylesheet" media="print" />

@section Scripts{
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.min.js"></script>
    <script>
            $(document).ready(function () {
                var courses = [];
                var selectedCourse = null;
                FetchCourseAndRenderCalendar();
                function FetchCourseAndRenderCalendar() {
                    courses = [];
                    $.ajax({
                        type: "GET",
                        url: "/home/GetCourseJsonResults",
                        success: function (data) {
                            $.each(data, function (i, v) {
                                courses.push({
                                    courseID: v.CourseID,
                                    title: v.Subject,
                                    description: v.Description,
                                    start:v.Start,
                                    end: v.End,
                                    color: v.ColumnColor
                                });
                            });

                            GenerateCalender(courses);
                        },
                        error: function () {
                            alert('failed1');
                        }
                    });
                }

                function GenerateCalender(courses) {
                    $('#calender').fullCalendar('delete');
                    $('#calender').fullCalendar({
                        contentHeight: 400,
                        defaultDate: new Date(),
                        timeFormat: 'h(:mm)a',
                        header: {
                            left: 'prev,next today',
                            center: 'title',
                            right: 'month,basicWeek,basicDay,agenda'
                        },
                        courseLimit: true,
                        courseColor: '#378006',
                        courses: courses,
                        courseClick: function (calCourse, jsEvent, view) {
                            selectedCourse = calCourse;
                            $('#myModal #courseTitle').text(calCourse.title);
                            var $description = $('<div/>');
                            $description.append($('<p/>').html('<b>Start:</b>' + calCourse.start.format("DD-MMM-YYYY HH:mm a")));
                            if (calCourse.end != null) {
                                $description.append($('<p/>').html('<b>End:</b>' + calCourse.end.format("DD-MMM-YYYY HH:mm a")));
                            }
                            $description.append($('<p/>').html('<b>Description:</b>' + calCourse.description));
                            $('#myModal #pDetails').empty().html($description);

                            $('#myModal').modal();
                        },
                        selectable: true,
                        select: function (start, end) {
                            selectedCourse = {
                                courseId: 0,
                                title: '',
                                description: '',
                                start: start,
                                end: end,
                                color: ''
                            };
                            openAddEditForm();
                            $('#calendar').fullCalendar('unselect');
                        },
                        editable: true,
                        courseDrop: function (course) {
                            var data = {
                                CourseID: course.courseId,
                                Subject: course.title,
                                Start: course.start.format('DD/MM/YYYY HH:mm A'),
                                End: course.end != null ? course.end.format('DD/MM/YYYY HH:mm A') : null,
                                Description: course.description,
                                ColumnColor: course.color
                            };
                            SaveCourse(data);
                        }
                    });
                }

                $('#btnEdit').click(function () {
                    //Open modal dialog for edit course
                    openAddEditForm();
                });
                $('#btnDelete').click(function () {
                    if (selectedCourse != null && confirm('Are you sure?')) {
                        $.ajax({
                            type: "POST",
                            url: '/home/DeleteCourse',
                            data: { 'courseId': selectedCourse.courseId },
                            success: function (data) {
                                data.status = true;
                                //Refresh the calender
                                FetchCourseAndRenderCalendar();
                                $('#myModal').modal('hide');
                            },
                            error: function () {
                                alert('Failed2');
                            }
                        });
                    }
                });

                //$('#dtp1,#dtp2').datetimepicker({
                //    format: 'DD/MM/YYYY HH:mm A'
                //});

               function openAddEditForm() {
                    if (selectedCourse != null) {
                        $('#hdCourseID').val(selectedCourse.courseId);
                        $('#txtSubject').val(selectedCourse.title);
                        $('#txtStart').val(selectedCourse.start.format('DD/MM/YYYY HH:mm A'));
                        $('#txtEnd').val(selectedCourse.end != null ? selectedCourse.end.format('DD/MM/YYYY HH:mm A') : '');
                        $('#txtDescription').val(selectedCourse.description);
                        $('#ddColumnColor').val(selectedCourse.color);
                    }
                    $('#myModal').modal('hide');
                    $('#myModalSave').modal();
                }

                $('#btnSave').click(function () {
                    //Validation/
                    if ($('#txtSubject').val().trim() == "") {
                        alert('Subject required');
                        return;
                    }
                    if ($('#txtStart').val().trim() == "") {
                        alert('Start date required');
                        return;
                    }
                    else {
                        var startDate = moment($('#txtStart').val(), "DD/MM/YYYY HH:mm A").toDate();
                        var endDate = moment($('#txtEnd').val(), "DD/MM/YYYY HH:mm A").toDate();
                        if (startDate > endDate) {
                            alert('Invalid end date');
                            return;
                        }
                    }

                    var data = {
                        CourseID: $('#hdCourseID').val(),
                        Subject: $('#txtSubject').val().trim(),
                        Description: $('#txtDescription').val(),
                        DateStart: $('#txtStart').val().trim(),
                        DateEnd: $('#chkIsFullDay').is(':checked') ? null : $('#txtEnd').val().trim(),
                        ColumnColor: $('#ddColumnColor').val()
                    };
                    SaveCourse(data);
                    // call function for submit data to the server
                });

                function SaveCourse(data) {
                    $.ajax({
                        type: "POST",
                        url: '/home/SaveCourse',
                        data: data,
                        success: function (data) {
                            if (data.any) {
                                //Refresh the calender
                                FetchCourseAndRenderCalendar();
                                $('#myModalSave').modal('hide');
                            }

                        },
                        error: function () {
                            alert('Failed3');
                        }
                    });
                }
            })
        </script>

}

мой контроллер

using System;
using System.Diagnostics;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using Microsoft.EntityFrameworkCore;
using Newtonsoft.Json;
using UberDrive.Data;
using UberDrive.Models;

namespace My.Controllers
{
    public class HomeController : Controller
    {
        private readonly AppDbContext _context;

        public HomeController(AppDbContext context)
        {
            _context = context;
        }
        public IActionResult Index()
        {
            return View();
        }

        public IActionResult Privacy()
        {
            return View();
        }

        [ResponseCache(Duration = 0, Location = ResponseCacheLocation.None, NoStore = true)]
        public IActionResult Error()
        {
            return View(new ErrorViewModel { RequestId = Activity.Current?.Id ?? HttpContext.TraceIdentifier });
        }
        //todo
        public async Task<JsonResult> GetCourseJsonResults()
        {
            var res = await _context.Сourses.AsNoTracking().ToListAsync();
            return new JsonResult(res);
        }

        [HttpPost]
        public JsonResult SaveCourse(Сourse c)
        {
            // >0
            if (c.СourseId != 0)
            {
                var course = _context.Сourses.FirstOrDefault(x => x.СourseId == c.СourseId);
                // update find course
                if (course != null)
                {
                    course.Subject = c.Subject;
                    course.Description = c.Description;
                    course.DateStart = c.DateStart;
                    course.DateEnd = c.DateEnd;
                    course.ColumnColor = c.ColumnColor;
                }

            }
            else
            {
                _context.Сourses.Add(c);
            }
            _context.SaveChanges();
            return new JsonResult (_context.Сourses.AsNoTracking().ToListAsync()); 
        }

        [HttpPost]
        public JsonResult DeleteCourse(int courseId)
        {
           var c = _context.Сourses.FirstOrDefault(x => x.СourseId == courseId);
            if (c != null)
            {
               _context.Сourses.Remove(c);
               _context.SaveChanges();
            }
            return new JsonResult(_context.Сourses.AsNoTracking().ToListAsync());
        }

    }
}

и класс курса

 public class Сourse
    {
        public int СourseId { get; set; }

        [Required, StringLength(120)]
        public string Subject { get; set; }
        public string Description { get; set; }
        public DateTime DateStart { get; set; }
        public DateTime DateEnd { get; set; }
        [Required, StringLength(20)]
        public string ColumnColor { get; set; }
    }

скажите мне, в чем проблема

Answer 1

Может быть странное предположение, но вы не предоставляете тип контента или не используете [FromBody].

function SaveCourse(data) {
                    $.ajax({
                        type: "POST",
                        url: '/home/SaveCourse',
                        contentType: "application/json",
                        data: data,
                        success: function (data) {
                            if (data.any) {
                                //Refresh the calender
                            }
                        },
                        error: function () {
                            alert('Failed3'); 
                        }
                    });
                }

И украсьте действие вашего контроллера с помощью [FromBody] =>

        [HttpPost]
        public JsonResult SaveCourse([FromBody]Сourse c)
        {
            // Code ommitted
        }