在 Modal asp.net mvc 中使用 ajax 添加数据

Posted 2023-05-09

【中文标题】在 Modal asp.net mvc 中使用 ajax 添加数据

【英文标题】：Add data using ajax in Modal asp.net mvc

【发布时间】：2016-07-08 01:46:01

【问题描述】：

我有一个带有引导程序的模式，允许我使用 ajax 在数据库中添加一些数据..之后我在部分视图中加载数据并显示它（经典）

这是我的控制器：

     public ActionResult AjouterCommentaire(TacheViewModel viewModel)
    

        viewModel.NVcommentaire.DateCommentaire = DateTime.Now;
        viewModel.NVcommentaire.UtilisateurId = 4 ;

        db.Commentaires.Add(viewModel.NVcommentaire);
        db.SaveChanges();



        return PartialView("PartialCommentaire", db.Commentaires);
    

当我返回部分视图时的问题PartialCommentaire 那是带有数据的表格..表格占用所有模态空间，就像模态占用表格值..（这是我返回部分视图时的逻辑）

如果我返回：return Json(new success = true ); 它会刷新页面，我不希望这样..

我必须返回，所以唯一需要改变的是带有表格的部分视图

想你

编辑：（添加 html）

      @using (Ajax.BeginForm("AjouterCommentaire", new AjaxOptions  UpdateTargetId = "partialSummaryDiv" ))
      
                <p>
                    <input type="submit" value="Create" />
                </p>
                        <div class="col-md-4">
                            @html.TextAreaFor(model => model.NVcommentaire.TxtCommentaire, new  @class = " form-control", @placeholder = "Ajouter un Commentaire", @rows = "7" )
                        </div>
      
                        <div class="col-md-8" id="partialSummaryDiv">
                            @ Html.RenderPartial("PartialCommentaire", Model.Commentaires); 
                        </div>


            </div>

编辑2： 我试过了，但还是不行！！

  <script>
$(document).ready(function () 
    $.ajax(
        url: "/Tache/AjouterCommentaire",
        type: "POST",
        success: function (result) 
            // refreshes partial view
            $('#partialSummaryDiv').html(result);
        
    );

);

并将 div 更改为：

   <div class="col-md-8" id="partialSummaryDiv">
     @ Html.RenderPartial("PartialCommentaire", Model.Commentaires); 

【问题讨论】：

您必须提供执行 ajax 发布和 dom 替换的 javascript 代码以及模态的 html。

@MenelaosVergis 已编辑：（ps：我没有使用任何 javascript，我只是使用 ajax.beginforms，如果它们不是 Modal，它就可以工作。问题在于将数据返回到模型

【参考方案1】：

在将 Model.Commentaires 对象传递给第二个局部视图之前，您确定它有数据吗？

【讨论】：

问题不在模型中，因为所有数据都通过没有任何问题......问题是当控制器操作返回部分视图时......解决方案将是更改返回类型（但我不知道要返回什么）

你能在这里放一些代码吗？局部视图的操作应该返回 PartialViewResult

是的，部分视图的操作返回部分视图..但问题是部分视图替换了模态中的原始视图（因此表格占据了模态中的所有位置）

如何移除 RenderPartial，将其替换为空 div，然后向控制器操作发送 ajax 请求，并将 div 的内容设置为从局部视图返回的 HTML？

说实话我没明白。我看起来和我一样，因为渲染部分返回 html（据我所知！）