我一直在尝试向我的 mvc 站点添加一些 Ajax 功能,但是,我遇到了有关页面刷新的问题。我在主页侧边栏上创建了一个 RSS 视图,它允许用户使用下拉列表选择他们想要查看的 RSS 提要。最初我在 mvc 中使用 html.begin 表单选项,但是,我认为刷新 rss feeder 而不是刷新整个页面将是一个很酷的功能。我实现了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>
当用户从下拉菜单中选择提要类型并单击提交按钮时,提要应更新为所选选项。
在 _Layout 视图中加载以下包:
@Scripts.Render("~/bundles/jquery")
任何帮助都会很棒。
为此,我在 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);
}
希望这有帮助。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)