MVC 3 Ajax.beginform提交 - 导致完全回发

嗨，我想尝试使用mvc 3来掌握ajax.beginform .

我有两个表单，一个HTML.BeginForm可以正常工作，一个Ajax.BeginForm在局部视图中 . ajax表单的帖子是为模型添加注释 .

问题是ajax提交是在主视图中提交包括HTML.BeginForm在内的整个页面而不是用note来执行异步帖子 .

谁能看到我做错了什么？

我看了其他问题，并在web.config等中禁用了不显眼的javascript .

视图：

<div id="maincontent">
@using (Html.BeginForm())
{
  @Html.ValidationSummary(true)
  <fieldset>
    <legend>Edit Franchise</legend>
    <div class="editor-label">
      @Html.LabelFor(model => model.Name)
    </div>
    <div class="editor-field">
      @Html.EditorFor(model => model.Name)
      @Html.ValidationMessageFor(model => model.Name)
    </div>
    <div class="editor-label">
      @Html.LabelFor(model => model.FirstLine)
    </div>
    <div class="editor-field">
      @Html.EditorFor(model => model.FirstLine)
      @Html.ValidationMessageFor(model => model.FirstLine)
    </div>
    <div class="editor-label">
      @Html.LabelFor(model => model.SecondLine)
    </div>
    <div class="editor-field">
      @Html.EditorFor(model => model.SecondLine)
      @Html.ValidationMessageFor(model => model.SecondLine)
    </div>
    <div class="editor-label">
      @Html.LabelFor(model => model.City)
    </div>
    <div class="editor-field">
      @Html.EditorFor(model => model.City)
      @Html.ValidationMessageFor(model => model.City)
    </div>
    <div class="editor-label">
      @Html.LabelFor(model => model.Postcode)
    </div>
    <div class="editor-field">
      @Html.EditorFor(model => model.Postcode)
      @Html.ValidationMessageFor(model => model.Postcode)
    </div>
    <div class="editor-label">
      @Html.LabelFor(model => model.Telephone)
    </div>
    <div class="editor-field">
      @Html.EditorFor(model => model.Telephone)
      @Html.ValidationMessageFor(model => model.Telephone)
    </div>
    <p class="clear">
      <input type="submit" value="Save" />
    </p>
  </fieldset>

  @Html.Partial("Partial/_AddNote", new Cash4Schools.Domain.Model.Note())

}

局部视图：

@model Cash4Schools.Domain.Model.Note
<script src="@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/MicrosoftMvcAjax.js")" type="text/javascript"></script>  

@using (Ajax.BeginForm("AddNote", "Franchises", 
  new AjaxOptions {
     HttpMethod = "POST", 
     UpdateTargetId = "note" }, 
     new { id = "ajaxForm" })
     )
{
  @Html.ValidationSummary(true)
   <fieldset>
       <legend>Add a Note</legend>

      <div class="editor-label">
        @Html.LabelFor(model => model.Content)
      </div>
      <div class="editor-field">
        @Html.EditorFor(model => model.Content)
        @Html.ValidationMessageFor(model => model.Content)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.CreationDate)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.CreationDate)
        @Html.ValidationMessageFor(model => model.CreationDate)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.CreatedBy)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.CreatedBy)
        @Html.ValidationMessageFor(model => model.CreatedBy)
    </div>

    <p class="clear">
        <input type="submit" value="Add" />
    </p>
</fieldset>

}

控制器：

[HttpPost]
public ActionResult AddNote(Note model)
{
  var franchise = _franchiseRepository.FindById(model.Id);

  franchise.Notes.Add(
    new Note {
      Content = model.Content,
      CreationDate = DateTime.Now,
      CreatedBy = model.CreatedBy,
      Type = NoteType.Franchise
    }
  );

  _franchiseRepository.Save(franchise);

  return PartialView(franchise.Notes);
}

HTML输出：

<form action="/Franchises/AddNote?Length=10" data-ajax="true" data-ajax-method="POST" data-ajax-mode="replace" data-ajax-update="#note" id="ajaxForm" method="post">    <fieldset>
    <legend>Add a Note</legend>
    <div class="editor-label">
        <label for="Content">Content</label>
    </div>
    <div class="editor-field">
        <input class="text-box single-line" id="Content" name="Content" type="text" value="" />
        <span class="field-validation-valid" data-valmsg-for="Content" data-valmsg-replace="true"></span>
    </div>
    <div class="editor-label">
        <label for="CreationDate">CreationDate</label>
    </div>
    <div class="editor-field">
        <input class="text-box single-line" data-val="true" data-val-required="The CreationDate field is required." id="CreationDate" name="CreationDate" type="text" value="01/01/0001 00:00:00" />
        <span class="field-validation-valid" data-valmsg-for="CreationDate" data-valmsg-replace="true"></span>
    </div>
    <div class="editor-label">
        <label for="CreatedBy">CreatedBy</label>
    </div>
    <div class="editor-field">
        <input class="text-box single-line" id="CreatedBy" name="CreatedBy" type="text" value="" />
        <span class="field-validation-valid" data-valmsg-for="CreatedBy" data-valmsg-replace="true"></span>
    </div>

    <p class="clear">
        <input type="submit" value="Add" />
    </p>

</fieldset>
</form><div id="note"></div>