在数据库问题中保存模态消息

Question

我的主要想法是显示数据库中的数据，在每一行旁边，都有一个接受和拒绝按钮.onClick，按钮的值被传递到控制器并保存到 database.so 到目前为止很好，问题是当我尝试添加具有输入文本的弹出模式以添加注释时。它应该只在我单击拒绝按钮时出现。我打开开发人员工具，发现它传递了数据行总数的两倍，我不知道如何传递我所在行的 ID、被拒绝按钮的值以及最后的消息将被写入控制器。我试图在控制器的拒绝按钮方法中传递模态，但它传递为 null。我究竟做错了什么？添加 ajax 后，我的脚本部分是否组织有序甚至准确？我感谢任何帮助。我的观点：

@model AllmyTries.Models.fulfillmentVM


<!-- page content -->


                                    @using (Html.BeginForm("Add_Fulfillment_Reject", "Feedback", FormMethod.Post))
                                    {
                                        @Html.AntiForgeryToken()
                                        <td>
                                            <button id="btnReject" class="btn btn-lg btn-danger" name="button" data-toggle="modal" data-target="#exampleModal" type="submit" onclick="reject(0)" value="0">Reject</button>
                                            @Html.Hidden("Request_ID", Model._Requests[i].Request_ID)
                                            @Html.Hidden("Status", Model._Requests[i].Status, new { id = "myEdit", value = "" })
                                        </td>

                                        <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                                            <div class="modal-dialog" role="document">
                                                <div class="modal-content">
                                                    <div class="modal-header">
                                                        <h5 class="modal-title" id="exampleModalLabel">New message</h5>
                                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                            <span aria-hidden="true">&times;</span>
                                                        </button>
                                                    </div>
                                                    <div class="modal-body">
                                                        <form id="myform">

                                                            <div class="form-group">
                                                                <textarea class="form-control" id="message-text"></textarea>
                                                            </div>
                                                        </form>
                                                    </div>
                                                    <div class="modal-footer">
                                                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                                                        <input type="reset" value="submit" class="btn btn-success" id="finalSave" />

                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    }


<!-- /page content -->


@section Scripts {
    <script>

        $('[name = "button"]').click(function () {
            $('[name = "Status"]').val($('[name = "button"]').val());

        })

        $(document).ready(function () {
            $('#finalSave').click(function () {
                var dataform = $('#myform').serialize();
                $.ajax({
                    type: 'POST',
                    url: '/Feedback/Add_Fulfillment_Reject',
                    data: dataform,
                    success: function () {
                        $('#exampleModal').modal('hide');
                    }

                })

            })
        })

    </script>
}

控制器：


        #region fulfillment
        [HttpPost]
        public ActionResult Add_Fulfillment_Accept(int Request_ID, int? Status)
        {
            var user = db.TBL_Request.Find(Request_ID);

            user.Inserted_by = Status ?? 0;

            db.SaveChanges();
            return RedirectToAction("Index");
        }
//this is the one with the issue 
        [HttpPost]
        public ActionResult Add_Fulfillment_Reject(fulfillmentVM vM)
        {
            //save the status
            //save the note


            db.SaveChanges();
            return RedirectToAction("Index");
        }
        #endregion


    }

Answer 1

您的 Javascript 仅将 <form id="myForm"> 中的文本区域提交给需要 fulfillmentVM 对象的控制器操作。将您的 Html.Hidden 字段更改为 Html.HiddenFor。这将在 post.

上绑定这些值

使用 TextAreaFor 而不是文本区域进行模型绑定，并确保您的视图模型具有合适的属性。

@Html.HiddenFor(m => m._Requests[i].Request_ID)
@Html.HiddenFor(m => m._Requests[i].Status, new { id = "myEdit", value = "" })
@Html.TextAreaFor(m => m.RejectMessage, htmlAttributes: new { @class = "form-control" })

删除 <form id="myForm"> 标签，它们是不必要的。

将按钮保留为提交按钮，它将 post 发送到 Add_Fulfillment_Reject 控制器，为您的 fulfillmentVM.

传递所有绑定值

表格放在哪里

就我个人而言，我会把它放在文本框之前，将隐藏字段也移到那里。在提交按钮后立即结束。

@using (Html.BeginForm("Add_Fulfillment_Reject", "Feedback", FormMethod.Post))
{
    @Html.HiddenFor(m => m._Requests[i].Request_ID)
    @Html.HiddenFor(m => m._Requests[i].Status, new { id = "myEdit", value = "" })
    @Html.TextAreaFor(m => m.RejectMessage, htmlAttributes: new { @class = "form-control" })
    // rest of modal code
    <input type="submit" class="btn btn-success" id="finalSave" />
} // end form

在数据库问题中保存模态消息

save a modal message in database issue

javascript

c#

ajax

asp.net-mvc

entity-framework-6