Ajax.BeginForm刷新整个页面中的MVC [英] Ajax.BeginForm refreshing the whole page in MVC
问题描述
我一直在尝试一些Ajax功能添加到我的MVC的网站,但是,我遇到一个问题关于页面清爽。我已经创建了我的主页侧边栏,它允许用户选择他们想要使用一个下拉列表来查看哪些RSS订阅的RSS视图。起初我用MVC中html.begin形式的选择,但是,我决定这将是一个很酷的功能有RSS馈线刷新,而不是整个页面刷新。我实现了ajax.begin形式,但整个页面仍然是令人耳目一新。
I've been trying to add some Ajax functionality to my mvc site, however, I run into a problem regarding page refreshing. I've created an rss view on my homepage sidebar, which allows the user to select which rss feed they want to view using a drop down list. Initially I was using the html.begin form option in mvc, however, I decided it would be a cool feature to have the rss feeder refresh, rather than having the whole page refresh. I implemented the ajax.begin form, but the whole page is still refreshing.
下面是我的看法里面的code:
Here is the code inside my view:
<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>
当用户从下拉菜单中选择一个饲料类型,并点击提交按钮,饲料应更新到所选择的选项。
When the user selects a feed type from the drop down menu, and clicks the submit button, the feed should update to the selected option.
在_layout查看下面的包被装入:
In the _Layout view the following bundle is loaded:
@Scripts.Render("~/bundles/jquery")
任何帮助将是巨大的。
Any help would be great.
推荐答案
我使用jQuery的这个Ajax调用
I use an ajax call in jquery for this
$('#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的内容在一个局部视图和控制器上
Then put the contents of your feedList div in a partial view and on your controller
public PartialViewResult FeedList(string data){
Model model = (get search result);
return PartialView("_feedList", model);
}
希望这有助于。
这篇关于Ajax.BeginForm刷新整个页面中的MVC的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!