通过AJAX将表单发布到部分视图

时间:2018-01-22 03:47:56

标签: jquery asp.net-mvc forms partial-views formcollection

我正在尝试将部分视图表单(viewbag)中的数据发布到主控制器上的操作方法。我正在使用Jquery:

$.ajax({
    url: '@Url.Action("displaypreviewformactionmethod", "MyMainController")',
    type: 'post',
    dataType: 'json',
    data: $('form#realform').serialize(),
    success: function (data) {
        $('#DivTagWhereMyPartialViewIs').html(data);
        $('#DivTagWhereMyPartialViewIs').show();
    }

我的表格部分视图如下:

<div id="step-3" class="">
    @using (Html.BeginForm("displaypreviewformactionmethod", "MyMainController"))
    {
        foreach (var frm in Model)
        {
            <tr>
                <td>
                    @Html.LabelFor(model => model.FirstOrDefault().ELabel, frm.SomeText)
                </td>
                <td>
                    @Html.TextBox(frm.FieldName)<br />
                </td>
            </tr>
        }
        <input type="submit" name="Submit" value="Submit" />
    }
</div>

主控制器中的操作方法是:

public ActionResult displaypreviewformactionmethod(FormCollection form)
{
    if (form.Count > 0)
    {
        ViewBag.FormItems = form;
    }
    return PartialView("MyPartialView", form);
}

该动作被调用,但它不会将formcollection中的任何内容传递给局部视图 - 这使我相信我在部分视图中没有正确识别该形式。我尝试在部分视图中添加<form id="realform">,但这不起作用。还有其他方法可以在Jquery中识别表单吗?

任何方向都非常赞赏。

1 个答案:

答案 0 :(得分:0)

@AMorrisey 我知道你想通过ajax提交表单。但是我在你的代码中看到了很多建议......

1。 Razor可以处理ajax表单提交..不需要写外部ajax    使用

@using (Ajax.BeginForm("displaypreviewformactionmethod", "MyMainController",

insted of

@using(Html.BeginForm(“displaypreviewformactionmethod”,“MyMainController”))

这是一篇很好的文章,用于理解Ajax.BeginForm vs Html.BeginForm

之间的区别

2。其次是你的

$.ajax({
    type: 'post',..
由于<input type="submit" name="Submit" value="Submit" />

不会产生任何影响

点击提交按钮,它会直接命中控制器/动作。所以$ ajax部分是没用的

3。应该在动作中进行正确的模型绑定

public ActionResult displaypreviewformactionmethod(FormCollection form)

should have been

public ActionResult displaypreviewformactionmethod(SomeModel model)