C# Net核心实体框架如何通过Ajax传递EditorForModel表单数据

我试图使用Ajax将用于创建数据库对象的表单数据传递给create操作。我之所以这样做，是因为我想在部分更新成功后进行更新。然而，我似乎无法从表单中检索数据

我尝试过通过url传递模型，如下所示，但结果为空：

<button type="submit" onclick="javascript: CreateEntity('@Url.Action("CreateItem", "Home", Model)')">Submit</button>

<script>
    function CreateEntity(createAction) {
    $.ajax({
        type: "POST",
        url: createAction,
        dataType: 'html',
        success: function (data) {
            $('#form-container).html(data);
        }
    });
}
</script>

但无论我在表单中输入了什么，所有的models字段都返回为0或null

编辑：

该表单由EntityFramework生成，如下所示：

@Html.EditorForModel()

我需要能够从中获取输入并将其通过ajax传递。

EditorForModel助手方法为模型中的每个属性呈现输入元素。但是您尝试将传递给视图的模型的序列化版本传递给视图，这是没有意义的，因为razor呈现页面时将执行该C行，并且它不会有用户输入的值

如果要使用服务器的输入表单元素进行ajax调用，则需要读取每个表单元素的值，并构建一个与Item类结构匹配的js对象，然后使用该对象进行ajax调用。但有一个简单的方法可以做到这一点。您只需将输入元素保存在表单中，然后使用jQuery serialize方法生成字符串的序列化版本并发送该字符串

@model Item
<form asp-action="Create" id="create-form" method="post">
    @Html.EditorForModel()
    <button type="submit" id="btn-save">Submit</button>
</form>
<div id="form-container"></div>

---

就个人而言，我不会将EditorFor用于EF创建的任何实体类。您应该考虑使用仅具有特定视图所需属性的视图模型。尽管如此，我很少使用EditorForModel，除非它是一个很小的视图模型，我喜欢为我的输入元素编写标记，在这里我可以完全控制标记应该是怎样的

可能重复如何通过JQuery发布表单内容：不是真的。我的问题与@Html.EditorForModel有关，在这种情况下，你实际上不需要给你一个表单id。这很有帮助。然而，给表单一个动作会导致它跳过js直接进入动作。我通过使用按钮的onclick方法将@Url.Action和表单id一起传递给我的js函数，解决了这个问题。如果您能编辑您的答案以反映这一点，我们将非常感谢@Shyju。我将此标记为e.e.的答案；部分应防止正常表单提交。在onclick上删除，并使用我使用的不引人注目的方式有趣，因为它不是。我知道这是应该的，所以我不知道为什么在我的情况下它不起作用。无论如何，我已经把这个标记为答案。

@Html.EditorForModel()

@model Item
<form asp-action="Create" id="create-form" method="post">
    @Html.EditorForModel()
    <button type="submit" id="btn-save">Submit</button>
</form>
<div id="form-container"></div>

$(function() {
    $("#create-form").submit(function (e) {
        var $form = $(this);
        e.preventDefault();
        $.ajax({
            type: "POST",
            url: $form.attr("action"),
            data: $form.serialize()
        }).done(function(data) {
            $('#form-container').html(data);
        });
    });
})