Asp.Net MVC ajax 向控制器发送空对象？

Question

我正在使用 Asp.Net MVC 开发调查应用程序。

我有一个名为 Index.cshtml 的页面，其中有一个问题 table 和一个 'Add New' button.Once 按钮被点击，一个弹出窗口被打开 jQuery。我正在从控制器调用一个视图来填充名为 AddOrEdit.cshtml（子页面）的 jQuery 对话框。我正在添加新的问题和选项。问题是一个文本字段，它的选项添加在 editable table 中。单击提交按钮后，将触发提交表单事件（保存或更新）。 Asp.Net MVC ajax 将空对象发送到控制器。我的 Question 对象具有 Option list.So 一对多关系。

Index.cshtml 并提交(ajax) 函数

@{
ViewBag.Title = "Soru Listesi";
}

<h2>Soru Oluşturma</h2>
<a class="btn btn-success" style="margin-bottom: 10px" 
onclick="PopupForm('@Url.Action("AddOrEdit","Question")')"><i class="fa fa-plus"></i> Yeni Soru 
Oluştur</a>
 <table id="questionTable" class="table table-striped table-bordered accent-blue" style="width: 
  100%">
<thead>
    <tr>
        <th>Soru No</th>
        <th>Soru Adı</th>
        <th>Oluşturma Tarihi</th>
        <th>Güncelleme Tarihi</th>
        <th>Güncelle/Sil</th>
    </tr>
</thead>
</table>
<link href="https://cdn.datatables.net/1.10.20/css/dataTables.bootstrap4.min.css" rel="stylesheet" />
 <link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" />



@section Scripts{
<script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.20/js/dataTables.bootstrap4.min.js"></script>

<script>


    var Popup, dataTable;
    $(document).ready(function() {

        dataTable = $("#questionTable").DataTable({
            "ajax": {
                "url": "/Question/GetData",
                "type": "GET",
                "datatype": "json"
            },
            "columnDefs": [
                { targets: 2 }
            ],
            "scrollX": true,
            "scrollY": "auto",
            "columns": [
                { "data": "QuestionId" },
                { "data": "QuestionName" },
                {
                    "data": "CreatedDate",
                    "render": function(data) { return getDateString(data); }
                },
                {
                    "data": "UpdatedDate",
                    "render": function(data) { return getDateString(data); }
                },
                {
                    "data": "QuestionId",
                    "render": function(data) {
                        return "<a class='btn btn-primary btn-sm' onclick=PopupForm('@Url.Action("AddOrEdit", "Question")/" +
                            data +
                            "')><i class='fa fa-pencil'></i> Güncelle</a><a class='btn btn-danger btn-sm' style='margin-left:5px' onclick=Delete(" +
                            data +
                            ")><i class='fa fa-trash'></i> Sil</a>";
                    },
                    "orderable": false,
                    "searchable": false,
                    "width": "150px"
                }
            ],
            "language": {
                "emptyTable":
                    "Soru bulunamadı, lütfen <b>Yeni Soru Oluştur</b> butonuna tıklayarak yeni soru oluşturunuz. "
            }
        });
    });


    function getDateString(date) {
        var dateObj = new Date(parseInt(date.substr(6)));
        let year = dateObj.getFullYear();
        let month = (1 + dateObj.getMonth()).toString().padStart(2, '0');
        let day = dateObj.getDate().toString().padStart(2, '0');
        return day + '/' + month + '/' + year;
    };


    function PopupForm(url) {
        var formDiv = $('<div/>');
        $.get(url)
            .done(function(response) {
                formDiv.html(response);
                Popup = formDiv.dialog({
                    autoOpen: true,
                    resizable: true,
                    title: 'Soru Detay',
                    modal: true,
                    height: 'auto',
                    width: '700',
                    close: function() {
                        Popup.dialog('destroy').remove();
                    }

                });
            });
    }

    function SubmitForm(form) {
        event.preventDefault();

        if (form.checkValidity() === false) {
            event.stopPropagation();
        }
        form.classList.add('was-validated');
        if ($(form).valid()) {
            var question = {};
            question.questionId = 1111;
            var options = new Array();
            $("#questionForm TBODY TR").each(function() {
                var row = $(this);
                var option = {};
                option.OptionId = row.find("TD").eq(0).html();
                option.OptionName = row.find("TD").eq(1).html();
                options.push(option);
            });
            question.options = options;
            question.responses = new Array();
            $.ajax({
                type: "POST",
                url: form.action,
                data: JSON.stringify(question),
                success: function(data) {
                    if (data.success) {
                        debugger;
                        Popup.dialog('close');
                        //dataTable.ajax.reload();
                        $.notify(data.message,
                            {
                                globalPosition: "top center",
                                className: "success",
                                showAnimation: "slideDown",
                                gap: 1000
                            });
                    }
                },
                error: function(req, err) {
                    debugger;
                    alert('req : ' + req + ' err : ' + err);
                },
                complete: function(data) {
                    alert('complete : ' + data.status);
                }
            });
        }
    }


    function ResetForm(form) {
        Popup.dialog('close');
        return false;
    }

    function Delete(id) {
        if (confirm('Bu soruyu silmek istediğinizden emin misiniz?')) {
            $.ajax({
                type: "POST",
                url: '@Url.Action("Delete", "Question")/' + id,
                success: function(data) {
                    if (data.success) {
                        dataTable.ajax.reload();
                        $.notify(data.message,
                            {
                                className: "success",
                                globalPosition: "top center",
                                title: "BAŞARILI"
                            })
                    }
                }

            });
        }
    }

</script>
}

QuestionController 添加或编辑操作

    [HttpPost]
    public ActionResult AddOrEdit(Questions question)
    {

        using (MerinosSurveyEntities db = new MerinosSurveyEntities())
        {
            List<Options> options = (List<Options>) question.Options;
            List<Options> existingOptions =  new List<Options>(db.Options.Where(x => x.Status && x.IsActive && x.QuestionId == question.QuestionId));
            foreach (Options existingOption in existingOptions)
            {
                Options optionUpdated = options.FirstOrDefault(x => x.OptionId == existingOption.OptionId);
                if (optionUpdated != null)
                {
                    //Update
                    existingOption.UpdatedDate = DateTime.Now;
                    existingOption.OptionName = optionUpdated.OptionName;
                    existingOption.IsActive = true;
                    existingOption.Status = true;
                    db.Options.Attach(existingOption);
                    db.Entry(existingOption).State = EntityState.Modified;
                    db.SaveChanges();
                    options.RemoveAll(x => x.OptionId == existingOption.OptionId);
                }
                else
                {
                    //Delete
                    existingOption.Status = false;
                    existingOption.UpdatedDate = DateTime.Now;
                    db.Options.Attach(existingOption);
                    db.Entry(existingOption).State = EntityState.Modified;
                    db.SaveChanges();
                }
            }
            foreach (Options optionNew in existingOptions)
            {
                optionNew.IsActive = true;
                optionNew.Status = true;
                optionNew.CreatedDate = DateTime.Now;
                optionNew.UpdatedDate = DateTime.Now;
                db.Options.Add(optionNew);
                db.SaveChanges();
                return Json(new { success = true, message = "Soru ve seçenekleri başarılı şekilde oluşturuldu/güncellendi." }, JsonRequestBehavior.AllowGet);

            }                

          //  db.Questions.Attach(question);
            return Json(new { success = true, message = "Soru başarılı bir şekilde güncellendi." }, JsonRequestBehavior.AllowGet);
        }

    }

问题对象

 //------------------------------------------------------------------------------
 // <auto-generated>
 //------------------------------------------------------------------------------

 namespace MerinosSurvey.Models
 {
 using System;
 using System.Collections.Generic;

 public partial class Questions
 {
    [System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Usage", "CA2214:DoNotCallOverridableMethodsInConstructors")]
    public Questions()
    {
        this.Responses = new HashSet<Responses>();
        this.Options = new HashSet<Options>();
    }

    public int QuestionId { get; set; }
    public string QuestionName { get; set; }
    public int QuestionTypeId { get; set; }
    public System.DateTime CreatedDate { get; set; }
    public int CreatedUserId { get; set; }
    public bool IsActive { get; set; }
    public bool Status { get; set; }
    public System.DateTime UpdatedDate { get; set; }

    [System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Usage", "CA2227:CollectionPropertiesShouldBeReadOnly")]
    public virtual ICollection<Responses> Responses { get; set; }
    [System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Usage", "CA2227:CollectionPropertiesShouldBeReadOnly")]
    public virtual ICollection<Options> Options { get; set; }
  }
 }

选项class

 //------------------------------------------------------------------------------
 // <auto-generated>
 //------------------------------------------------------------------------------

namespace MerinosSurvey.Models
{
using System;
using System.Collections.Generic;

public partial class Options
{
    public int OptionId { get; set; }
    public string OptionName { get; set; }
    public int QuestionId { get; set; }
    public System.DateTime CreatedDate { get; set; }
    public System.DateTime UpdatedDate { get; set; }
    public bool IsActive { get; set; }
    public bool Status { get; set; }

    public virtual Questions Questions { get; set; }
}
}

Answer 1

我终于解决了这个问题。因为我忘记将 'contentType' 添加到我发送 ajax 请求的部分，所以 'ajax' 正在向控制器发送空对象。但是我尝试过的 Pascal 大小写和骆驼大小写都没有改变。我见过 Ajax 在案例中独立工作。

我正在添加我正在编辑的部分。在这种情况下，它可以正常工作。

function SubmitForm(form) {
        event.preventDefault();

        if (form.checkValidity() === false) {
            event.stopPropagation();
        }
        form.classList.add('was-validated');
        if ($(form).valid()) {
            var question = {};
            question.questionId = 1111;
            question.questionName = "Name";
            var options = new Array();
            $("#questionForm TBODY TR").each(function() {
                var row = $(this);
                var option = {};
                option.optionId = row.find("TD").eq(0).html();
                option.optionName = row.find("TD").eq(1).html();
                option.questionId = 0;
                option.isActive = true;
                option.status = true;
                options.push(option);
            });

            question.options = options;
            question.responses = new Array();
            $.ajax({
                type: "POST",
                url: form.action,
                data: JSON.stringify(question),
                contentType: "application/json",//this is the line I forgot to add.
                success: function(data) {
                    if (data.success) {
                        debugger;
                        Popup.dialog('close');
                        //dataTable.ajax.reload();
                        $.notify(data.message,
                            {
                                globalPosition: "top center",
                                className: "success",
                                showAnimation: "slideDown",
                                gap: 1000
                            });
                    }
                },
                error: function(req, err) {
                    debugger;
                    alert('req : ' + req + ' err : ' + err);
                },
                complete: function(data) {
                    alert('complete : ' + data.status);
                }
            });
        }
    }

Asp.Net MVC ajax 向控制器发送空对象？

Asp.Net MVC ajax sends empty object to Controller?

asp.net

ajax

model-view-controller

asp.net-mvc

asp.net-mvc-4