用jquery post将表单值null发布到控制器上。

Posted 2021-03-19

在一个Asp.NET MVC项目中，我在cshtml页面中有一个表单。我想用一个jquery post adapter将表单值发送到一个控制器。我使用.serilize()函数来获取表单的值，当我提醒序列化的值时，我可以将其作为一个字符串来获取，但是，当我将其发送到控制器时，它的值是空的。这是我的cshtml页面。

EditPage.cshtml

@model Models.PROJECTS

@using (Html.BeginForm(null,null,FormMethod.Post,new {id="EditForm"}))
{
    @*Html.AntiForgeryToken()*@

    <div class="form-horizontal">

        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        @Html.HiddenFor(model => model.PROJE_NO)

        <div class="form-group">
            @Html.LabelFor(model => model.PROJECTNAME, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.PROJECTNAME, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.PROJECTNAME, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.PROJECTCODE, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.PROJECTCODE, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.PROJECTCODE, "", new { @class = "text-danger" })
            </div>
        </div>
        .
        .
        .



        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <i class="fa fa-save fa-lg" id="saveBtn" style="cursor:pointer;color:green" title="Edit Project"></i>&nbsp;

            </div>
        </div>
    </div>
     }
    @section scripts
     {

    <script language="javascript">

    $(document).ready(function() {


            $(document).on("click", "#saveBtn", function () {


                var formData = $('#EditForm').serialize();

                alert(JSON.stringify(formData));

                $.post('@Url.Action("EditProject", "Home")',
                    {
                        project: JSON.stringify(formData)

                    }).done(function(data) {

                    if (data.success) {

                        alertify.success(data.message);

                    } else {

                        alertify.error(data.message);
                    }
                }).fail(function() {
                    alertify.error('Error while editing project');
                });

            });
        });
   </script>

这里是HomeController。

 [HttpPost]
        public ActionResult EditProject(PROJECTS project)
        {

            try
            {
                using (dbContext = new ProjectsDbContext())
                {
                    dbContext.Entry(project).State = EntityState.Modified;
                    dbContext.SaveChanges();
                    return Json(new { success = true, message = "Project Info is Updated" });
                }
            }
            catch (Exception e)
            {
                return Json(new { success = false, message = "Project Info Cannot be Updated" });
            }
        }

在EditProject动作中，参数project为空。我不知道我哪里做错了，感谢任何帮助。

答案

评论后，为了解决这个问题，你可以使用两个更新。

1 - 你不需要使用 JSON.stringify(formData)因为当你使用 .serialize()它生成的数据就像一个 QueryString，所以需要使用默认的 contentType:application/x-www-form-urlencoded; charset=UTF-8，不作为 JSON.

2 - 改变小的 js 函数，通过替换。

{
    project: JSON.stringify(formData)
}

将其改为： formData. js将是 。

$(document).ready(function () {
    $(document).on("click", "#saveBtn", function () {

        var formData = $('#EditForm').serialize();

        $.post('@Url.Action("EditProject", "Home")', formData)
            .done(function (data) {
                if (data.success) {

                    alertify.success(data.message);

                } else {

                    alertify.error(data.message);
                }
            }).fail(function () {
                //alertify.error('Error while editing project');
            });
    });
});