Javascript Ajax模式不更新目标ID
我有以下模式向博客添加评论,但当我提交表单而不是用所有添加的评论列表更新目标id时,它会重定向到包含评论列表的新页面吗?如何更新目标ID,使其与所有其他注释一起显示新注释Javascript Ajax模式不更新目标ID,javascript,jquery,ajax,asp.net-mvc,bootstrap-modal,Javascript,Jquery,Ajax,Asp.net Mvc,Bootstrap Modal,我有以下模式向博客添加评论,但当我提交表单而不是用所有添加的评论列表更新目标id时,它会重定向到包含评论列表的新页面吗?如何更新目标ID,使其与所有其他注释一起显示新注释 <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal"> Launch demo modal</button> <div class="modal fade" id=
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal"> Launch demo modal</button>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
@using (Ajax.BeginForm("AddComment", "Blog", new AjaxOptions
{
HttpMethod = "POST",
InsertionMode = InsertionMode.Replace,
UpdateTargetId = "comments",
LoadingElementId = "progress",
OnSuccess = "$('#myModal').modal('hide');"
}))
{
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title" id="myModalLabel">Add Comment</h4>
</div>
<div class="modal-body">
@Html.ValidationSummary(true)
@Html.HiddenFor(model => model.Blog.BlogID)
<div class="form-group">
@Html.LabelFor(model => model.BlogComment.Comment)
@Html.TextAreaFor(model => model.BlogComment.Comment, 4, 104, new { @class = "form-control" })
@Html.ValidationMessageFor(model => model.BlogComment.Comment)
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary">Save changes</button>
<button type="button" class="btn btn-primary" data-dismiss="modal">Close</button>
</div>
}
</div>
</div>
</div>
<div id="comments">
@Html.Action("Comments", "Blog", new { id = Model.Blog.ID })
</div>
public PartialViewResult Comments(int id)
{
IEnumerable<BlogComment> CommentList = _repository.GetBlogComments(id);
return PartialView("_BlogComments", CommentList);
}
public ActionResult AddComment(// All Pramameters)
{
if (ModelState.IsValid)
{
// Do Save Comment
if (Request.IsAjaxRequest())
{
return RedirectToAction("Comments", new { id = id });
}
}
else
{
//return to modal with errors
return PartialView("_CreateComment", BlogViewModel);
}
}
启动演示模式
@使用(Ajax.BeginForm(“AddComment”,“Blog”),新的AjaxOptions
{
HttpMethod=“POST”,
InsertionMode=InsertionMode.Replace,
UpdateTargetId=“comments”,
LoadingElementId=“进度”,
OnSuccess=“$('#myModal').modal('hide');”
}))
{
&时代;
添加注释
@Html.ValidationSummary(true)
@Html.HiddenFor(model=>model.Blog.BlogID)
@LabelFor(model=>model.blogcoment.Comment)
@TextAreaFor(model=>model.blogcoment.Comment,4104,新的{@class=“formcontrol”})
@Html.ValidationMessageFor(model=>model.blogcoment.Comment)
保存更改
接近
}
@Action(“评论”,“博客”,新的{id=Model.Blog.id})
公共PartialViewResult注释(int id)
{
IEnumerable CommentList=\u repository.GetBlogComments(id);
返回PartialView(“_blogcoments”,CommentList);
}
public ActionResult AddComment(//所有Pramameters)
{
if(ModelState.IsValid)
{
//请保存评论
if(Request.IsAjaxRequest())
{
返回RedirectToAction(“Comments”,new{id=id});
}
}
其他的
{
//返回带有错误的模式
返回PartialView(“_CreateComment”,BlogViewModel);
}
}
重定向操作将触发客户端重定向
将您的返回改为this,它只调用现有的方法返回PartialViewResult
:
if (Request.IsAjaxRequest())
{
return Comments(id);
}
更新
另一方面,请参见下面的注释,即不引人注目的ajax和jquery验证更新。它与
if(Request.IsAjaxRequest())
无关。我可以完全消除这种情况。它仍然没有更新targetid,这是一个操作。我想问题可能是在添加注释后如何返回视图。除了按照建议更改返回之外,问题在于jquery unobtrusive ajax和jquery validate。已将两者更新为更新版本,解决了此问题。不过还有一个问题。我的观点是片面的。如果出现错误,如何重新显示模式?@ozzii您可以使用javascript进行测试,如果失败,只需使用引导api即可。这里可以看到:我认为modal是通过$('#myModal')调用的。modal(选项)