我一直在尝试向我的mvc网站添加一些Ajax功能,但是,我遇到了有关页面刷新的问题。我在我的主页侧边栏上创建了一个RSS视图,允许用户使用下拉列表选择要查看的RSS源。最初我在mvc中使用了html.begin表单选项,但是,我认为让rss进纸器刷新是一个很酷的功能,而不是让整个页面刷新。我实现了ajax.begin表单,但整个页面仍然很新鲜。
以下是我视图中的代码:
<div class="rss_feed">
<h3>RSS Feed</h3>
@using (Ajax.BeginForm("Index", "Home",
new AjaxOptions
{
HttpMethod = "post",
UpdateTargetId = "feedList"
}))
{
@Html.DropDownListFor(x => x.SelectedFeedOption, Model.FeedOptions)
<input type="submit" value="Submit" />
}
<div id="feedList">
@foreach (var feed in Model.Articles)
{
<div class="feed">
<h3><a href="@feed.Url">@feed.Title</a></h3>
<p>@feed.Body</p>
<p><i>Posted @DateTime.Now.Subtract(@feed.PublishDate).Hours hour ago</i></p>
</div>
}
</div>
</div>
当用户从下拉菜单中选择Feed类型并单击提交按钮时,Feed应更新为所选选项。
在_Layout视图中加载以下包:
@Scripts.Render("~/bundles/jquery")
任何帮助都会很棒。
答案 0 :(得分:0)
我在jquery中使用ajax调用这个
$('#SelectedFeedOption').change(function() {
$.ajax({
url: "@(Url.Action("Action", "Controller"))",
type: "POST",
cache: false,
async: true,
data: { data: $('#SelectedFeedOption').val() },
success: function (result) {
$(".feedList").html(result);
}
});
});
然后将feedList div的内容放在局部视图和控制器上
public PartialViewResult FeedList(string data){
Model model = (get search result);
return PartialView("_feedList", model);
}
希望这有帮助。
答案 1 :(得分:0)
您是否尝试将InsertionMode成员初始化为AjaxOptions对象初始化程序?
你还必须包括&#39; jquery.unobtrusive-ajax.js&#39;使Ajax.BeginForm以解答here
的方式工作 @using (Ajax.BeginForm("Index", "Home", null,
new AjaxOptions
{
HttpMethod = "post",
InsertionMode = InsertionMode.Replace,
UpdateTargetId = "feedList"
});
{
@Html.DropDownListFor(x => x.SelectedFeedOption, Model.FeedOptions)
<input type="submit" value="Submit" />
}