0

我的页面与回发完美配合。我的问题是它有点讨厌人们提交的每一个成分或字幕,它会重新加载整个页面。所以,我认为这可能是学习一点 ajax 的好方法......我读了很多文章,我很困惑。有些人正在使用 Ajax.Beginform,而其他人则在 jQuery 事件中使用来自 jQuery 的 $.ajax(例如提交)。我读过第二种方法更好,但我不知道我的表格完成方式是否可行。

这是我的观点的重要部分。总而言之,我有一个字幕列表,每个字幕都可以包含一个成分列表。一种形式可以提交成分,另一种可以提交字幕。第一个可以出现多次(在每个字幕中)。

    <div id="Ingredients">
         <h2>Ingrédients</h2>
         @foreach (RecettesMaison.Models.Subtitle sub in Model.Subtitles)
         {
              <h4>@Html.DisplayFor(modelItem => sub.Name)</h4>
              <ul id="ing@nSubtitle">
              @foreach (RecettesMaison.Models.Ingredient ing in sub.Ingredients)
              {
                  <li>@Html.DisplayFor(modelItem => ing.QuantityAndName)</li>
              }
              </ul>
              using (Html.BeginForm("AddIngredient", "Recipe", new { subname = sub.Name }, FormMethod.Post))
              {
                  @Html.HiddenFor(model => model.IDRecipe)
                  <a name="IngredientSection" ></a>
                  <input class="field required span6 text-box single-line" id="nameingredient" name="nameingredient" />
                  <input type="submit" class="btn btn-success" value="Ajouter un ingrédient" />
              }
              nSubtitle++;
         }

         @using (Html.BeginForm("AddSubtitle", "Recipe", FormMethod.Post))
         {
              @Html.HiddenFor(model => model.IDRecipe)
              <a name="SubtitleSection" ></a>
              <input class="field required span6 text-box single-line" name="Name" />
              <input type="submit" class="btn btn-success" value="Ajouter une catégorie d'ingrédient" />
         }
</div>

我的第一种方法是,如果提交成功,我会用新数据“刷新”这两个 foreach。但是我在必须教程中看到的方法是使用局部视图并仅刷新 div 内的局部视图。但就我而言,我的 Html.BeginForm 将在局部视图内,所以我认为它不会起作用。我还考虑在我的列表末尾附加 html,但它只会对成分起作用。所以最好的方法是为每个都刷新

所以,我的一般问题

我怎样才能做到这一点?:)

谢谢!

4

1 回答 1

0

Ajax.BeginForm 与 .ajax()

两者都完成同样的事情。Ajax.BeginForm将隐藏 javascript 详细信息,因此.ajax()可能会为您理解该模式提供更好的基础,特别是如果您需要在 MS 技术之外工作。

带有部分视图的 AJAX

这是完全可能的,即使在 SO 上,网络上也有很多例子。一般的想法是你只是用通过 AJAX 检索的部分视图内容替换 div。

  • 如果 div 是静态的,那么您的 jquery 选择器非常简单。
  • 如果 div 是动态生成的,那么你需要做一些 DOM 遍历来找到目标 div。

没有看到你的尝试,很难给你具体的帮助。我建议您从一个带有单个局部视图和表单的简单示例开始,然后使用 AJAX 对其进行更新。然后,一旦您了解了机制,您就可以转向具有多种形式的更复杂的情况。

于 2013-05-13T23:49:35.920 回答