我如何可以重新加载使用jQuery的ASP.NET MVC中一个PartialView一个div？ [英] How can I reload a div with a PartialView in ASP.NET MVC using jQuery?
问题描述
我有一个部分一个div内的某处在页面上。我有一个按钮事件。我怎么能写一个JavaScript，是以分区，再重新装入，并重新加载的局部视图。
I have a div with a partial inside somewhere on the page. I have a event on a button. How could i write a Javascript that takes the div and reloads it and also reloads the partial view.
我有这样的另一种看法。但我不能这样做现在这个样子。但我需要同样的事情发生仅一个jQuery不能直接在网页上执行。我可以运行也许simular阿贾克斯code在jqury脚本，因为它的JavaScript太不是它？
I have this in another view. But i can't do it like this now. But i need the same thing to happen only execute by a jquery not directly in the page. Can i run maybe simular ajax code in the jqury script because its javascript too isnt it?.
<% using (Ajax.BeginForm("EditFeiertag", new AjaxOptions { InsertionMode = InsertionMode.Replace, UpdateTargetId = "feiertage" }))
{ %>
<div id="feiertage">
<% Html.RenderPartial("FeiertagTable"); %>
</div>
<% } %>
我会帮助我，如果我可以运行上面的脚本通过启动一个点击事件或者类似的东西。
i would help me if i could run the script above by start a click event or something like that
推荐答案
让我们先从一些基本的控制器操作：
Lets start with some basic controller actions:
public class FeiertagController
{
IFeiertagService feiertagService = new FeiertagService();
public ActionResult EditFeiertag()
{
// ... return your main edit view
return View();
}
// Will be called by your jquery ajax call
public PartialResult GetFeiertagTable()
{
var feiertagData = messageService.getLatestFeiertagData();
var viewModel = new FeiertagViewModel();
feiertagViewModel.feirtagTableData = feiertagData;
return PartialView("FeiertagTableView", viewModel);
}
}
所以，EditFeiertag（）用来渲染你的整个编辑页面，该页面会打电话到GetFeiertagTable（），当它想以异步方式呈现你的部分观点。
So, EditFeiertag() is used to render your whole edit page, and that page will make a call to GetFeiertagTable() when it wants to asynchronously render your partial view.
现在，对你的看法，可以说你有这样的：
Now, on your view, lets say you have something like:
<div id="Container">
<div id="LeftPanel">
// ... Some menu items
</div>
<div id="RightPanel">
<a id="ReloadLink" href="#">Reload Table</a>
<div id="FeiertagTable>
<% Html.RenderPartial("FeiertagTable", Model.feiertagTableData); %>
</div>
</div>
</div>
这工作正常，并会加载你的表一次。但是你想，如果你点击某个元素（在我们的例子中#ReloadLink）的Feiertag表刷新。
This works fine and will load your table once. But you want to make the Feiertag table reload if you click a certain element (in our case the #ReloadLink).
下面添加到您的网页 部分：
Add the following to portion of your page:
<head>
<script src="../../Scripts/Jquery/jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$('#ReloadLink').click(function(e)
{
e.preventDefault(); // stop the links default behavior
$('#FeiertagTable').load('/Feiertag/GetFeiertagTable');
});
});
</script>
</head>
您重载链接，将调用一个jQuery的load（）方法，该方法会再加入上的click事件的事件。这个方法是一个简化AJAX GET请求，它会替换所选分区中的内容（FeiertagTable），与返回什么。
That will then add an event on the click event for your reload link that will call a jquery load() method. This method is a simplified ajax get request and it will replace the contents of the selected div (FeiertagTable), with what is returned.
我们的GetFeiertagTable（）动作控制器将返回局部视图，其被插入该div
Our GetFeiertagTable() controller action will return the partial view, which is then inserted into that div.
我希望这能让你指出正确的方向！
I hope this gets you pointed in the right direction!
这篇关于我如何可以重新加载使用jQuery的ASP.NET MVC中一个PartialView一个div？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
