Question

在我试图解释我的问题时，请耐心等待。

我正在发布我的表单返回控制器并更新模型并将其传回视图。如果我使用提交按钮，这可以正常工作，但如果我使用非提交按钮并尝试使用javascript回发，则无法正常工作。

我已经尝试过寻找这个问题，但我不确定如何说出来，以便我可以得到任何结果。

基本上

正确 - 当我点击输入类型=“提交”的AddDetail按钮时，我的控制器被调用并且模型被更新并传递回视图并且元素在页面上正确显示。
INCORRECT - 当我点击输入类型=“按钮”的AddDetail1按钮时，单击按钮调用我的javascript，调用控制器方法，将FormCollection和Model正确传递给控制器。模型会更新并传递回视图，但页面上没有显示任何元素。

我已经完成了100次这段代码，我看到的所有内容都与视图中设置的元素完全相同。唯一的区别是Submit Button将呈现控件，但Other Button不会呈现任何内容。我在点击每个按钮后查看了html源，并且“提交”按钮显示了控件，但是当我单击“其他”按钮时没有控件。

我甚至在页面上添加了@ Model.cases.count - 最初它显示0是正确的，但在回发后它显示1为提交按钮，当我单步执行其他按钮的代码时，它显示1，但是当页面最终完成并且所有内容都被渲染时，它显示0，即使它是1，当我踩过代码时。

非常沮丧

任何想法都将不胜感激。

这是我的简化视图

@model CASA.ViewModels.CaseViewModel

<script type="text/javascript">
    $(function () {
        $("#AddDetail1").click(function () {
            var form = $(':input');
            //var action = form.attr("action");
            var serializedForm = form.serialize();
            var url = '@Url.Action("CreateCase")';
            //$.post(url, serializedForm);
            $.ajax({
                url: url,
                data: serializedForm,
                type: 'POST',
                success: function (response) {
                    alert(response);
                    // process the results from the controller action

                    //  window.location.href = response.Url;
                }

            });
        });
    });
@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)

    @if (Model.cases != null && Model.cases.Count > 0)
        {
            for (int i = 0; i < Model.cases.Count; i++)
            {
                <tr>
                    <td>
                        @Html.TextBoxFor(m => m.cases[i].CaseNumber, new { @class = "textbox" })
                    </td>
                    <td>
                        @Html.TextBoxFor(m => m.cases[i].FirstName, new { @class = "nameTextbox" })
                    </td>
                    <td>
                        @Html.TextBoxFor(m => m.cases[i].LastName, new { @class = "nameTextbox" })
                    </td>
                    <td>
                        @Html.EditorFor(m => m.cases[i].DOB)
                    </td>
                    <td>
                        @Html.RadioButtonListFor(m => m.cases[i].Sex, Model.radiobuttons.RadioButtonListItems)
                    </td>
                </tr>
            }
        }

<input type="submit" value="+" id="AddDetail" class="button" />
<input type="button" value="+" id="AddDetail1" class="button" />
}

这是我的控制器：

[HttpPost]
        public ActionResult CreateCase(FormCollection collection, CaseViewModel model)
        {
            if (ModelState.IsValid)
            {
                model.cases.Add(new CASA_Cases
                {
                    CaseNumber = collection["CaseNumber"],
                    FirstName = collection["FirstName"],
                    LastName = collection["LastName"],
                    DOB = Convert.ToDateTime(collection["DOB"]),
                    Sex = collection["Sex"]
                });

                UpdateModel(model);
                if (submit.Count() > 0)
                {
                    model.cases.ForEach(item =>
                        {
                            if (model.group.ID == null)
                            {
                                model.group.ID = Guid.NewGuid();
                                model.group.UserID = Utilities.Utilities.GetUserID;
                            }

                            item.CASA_CaseGroups_ID = model.group.ID;
                        });
                }
            }
            return View(model);
        }

Answer 1

再次感谢所有建议。

这就解决了我的问题。

我将视图置于PartialView上方并将jQuery更改为

<script type="text/javascript">
    $(function () {
        $("#AddDetail1").click(function () {
            var form = $(':input');
            var serializedForm = form.serialize();
            var url = '@Url.Action("CreatePartialView")';
            $.ajax({
                url: url,
                data: serializedForm,
                type: 'POST',
                success: function (response) {
                    $("#result").html(response);
                }
            });
        });
    });
</script>

接下来，我创建了一个实际视图来保存PartView，如下所示

<div id="result">
@model CASA.ViewModels.CaseViewModel

@using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "result" }))
{
        @Html.Partial("CasePartialView", Model)
}
</div>

最后，我修改了Controller以将PartialView作为Follows

返回

[HttpPost]
        public PartialViewResult CreatePartialView(FormCollection collection, CaseViewModel model)
        {
            //Determine if submit button was clicked
            IEnumerable<string> submit = collection.AllKeys.Where(n => n.ToLower().Equals("submit"));

            model.cases.Add(new CASA_Cases
            {
                CaseNumber = collection["CaseNumber"],
                FirstName = collection["FirstName"],
                LastName = collection["LastName"],
                DOB = Convert.ToDateTime(collection["DOB"]),
                Sex = collection["Sex"]
            });


            return PartialView("CasePartialView",model);
        }

再次感谢所有建议

MVC视图未在页面上显示模型属性

1 个答案: