I am doing a web application using ASP.NET MVC 5. It seems to me that I did everything as it goes, but ajax is just not working. I see results only after refreshing. This is in my View:
@{
AjaxOptions ajaxOptions = new AjaxOptions {
UpdateTargetId = "CommmentList",
HttpMethod = "Post",
InsertionMode = InsertionMode.Replace};
}
<div id="CommentList">
@using (Ajax.BeginForm("Index", "Comment", ajaxOptions))
{
// some content
<div>
@Html.Action("_AddCommentForItem", "Comment")
</div>
}
</div>
This is in a layout view:
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.8.0.min.js" type="text/javascript"></script>
<script src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.unobtrusive-ajax.js" type="text/javascript"></script>
EDIT:
These are actions in a Comment controller:
// GET: Comment
public async Task<ActionResult> Index()
{
var comments = db.Comments.Include(k => k.Item);
return View(await comments.ToListAsync());
}
// GET
public PartialViewResult _AddCommentForItem()
{
ViewBag.ItemId = new SelectList(db.Items, "Id", "Name");
return PartialView("_AddCommentForItem");
}
// POST
[HttpPost]
public PartialViewResult _AddCommentForItem ([Bind(Include = "Id,ItemId,CommentContent")] Comment comment)
{
if (ModelState.IsValid)
{
db.Comments.Add(commment);
db.SaveChanges();
}
ViewBag.ItemId = new SelectList(db.Items, "Id", "Name", comment.ItemId);
return PartialView("_AddCommentForItem");
}
}
}
I included partial view _AddCommentForItem, which is creating a comment, in an index view of the Comment controller. That's way i want the result to be visible right away, without refreshing.
What am I missing? Thank you.