当发布ajax表单时，将重新呈现同级部分视图

Question

我有一个这样的视图：

<div id="basic-information-container">
    @Html.Action("MyBasicInformation")
</div>
<div id="cv-container">
    @Html.Action("MyCv")
</div>
<div id="experiance-container">
    @Html.Action("MyExperiances")
</div>
<div id="academic-background-container">
    @Html.Action("MyAcademicBackgrounds")
</div>

部分视图MyCv是：

@model Model.Profile.CvModel
<script type="text/javascript">
    $(function () {
        $("#cv-container form").submit(function () {
            $(this).ajaxSubmit({
                target: "#cv-container",
                cache: false
            });
            return false;
        });
    });
</script>
@using(Html.BeginForm()) {
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Cv</legend>
        @Html.EditorFor(model => model.File) 
        @* I have working editor template for HttpPostedFileBase, nothing to worry about this*@
        @Html.ValidationMessageFor(model => model.File)
        <p>
            <input type="submit" value="Upload" />
        </p>
    </fieldset>
}

这是CvModel 的代码

public class CvModel {
    public int? Id { get; set; }
    [Required]
    public HttpPostedFileBase File { get; set; }
    public CvModel() {
    }
    public CvModel(int? cvId) {
        Id = cvId;
    }
}

这是MyCv 的发布方法

[HttpPost]
public ActionResult MyCv(CvModel model) {
    // upload cv to database
    return PartialView(model);
}

现在，问题是，当我出于某种未知原因上传CV时，MyBasicInformation, MyExperiances and MyAcademicBackgrounds的部分视图正在重新加载。我找不出我做错了什么。我哪里做错了？

顺便说一句，我已经检查到MyBasicInformation, MyExperiances and MyAcademicBackgrounds的get操作没有被调用。视图正在直接重新加载。

Answer 1

由于您使用的是子操作，因此必须在表单中明确指定要发布到的操作，否则表单可能无法提交到正确的操作。此外，您的表单上缺少上传文件所需的enctype="multipart/form-data"：

因此：

@using(Html.BeginForm()) {

应该变成：

@using (Html.BeginForm("MyCv", "SomeController", FormMethod.Post, new { enctype = "multipart/form-data" }))

还请与FireBug一起检查控制台中的潜在错误。确保AJAX请求发送成功。确保第二次重新附加.submit()事件。