在.NET MVC4中使用Ajax加载部分视图
在.NET MVC4中使用Ajax加载部分视图
提问于 2013-01-26 04:33:21
我正在尝试遵循here的帖子，这很可能是错误的，以了解更多关于MVC中部分视图加载的知识。我知道MVC的基础知识，但是我想做更多我在开始使用MVC之前所做的ajax工作。
的目标是在Div内部加载部分视图。它只是将部分视图加载为整个页面，而不是在Div内部。
代码如下：
控制器：
namespace LDP.WebUI.Controllers
{
public class TestController : Controller
{
//
// GET: /Test/
public ActionResult Index()
{
return View();
}
public PartialViewResult Page1()
{
return PartialView("Page1");
}
public PartialViewResult Page2()
{
return PartialView("Page2");
}
}
}主视图(索引)：(我也尝试了没有井号的"mainDiv“，不知道哪一个是正确的)
<script src="@Url.Content("~/Scripts/libs/jquery-1.8.2.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/libs/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#hideme').click(function () {
$(this).hide();
});
});
</script>
<div>
@Ajax.ActionLink("Parial Page1", "Page1", new AjaxOptions { InsertionMode = InsertionMode.Replace, UpdateTargetId = "mainDiv"})
@Ajax.ActionLink("Parial Page2", "Page2", new AjaxOptions { InsertionMode = InsertionMode.Replace, UpdateTargetId = "mainDiv"})
<div id ='mainDiv'>
</div>
<button id ="hideme">Hide Me</button>
</div>部分视图1 (Page1.cshtml)
@{
ViewBag.Title = "Page1";
}
<h2>Page1</h2>部分视图2 (Page2.cshtml)
@{
ViewBag.Title = "Page2";
}
<h2>Page2</h2>更新:我创建了一个全新的MVC4项目。默认情况下，Jquery 1.7.1和microsoft的unobtrusive-ajax库都提供了这一功能。它仍然在新页面中加载局部视图...
更新:不确定这是否有帮助，但以下确实达到了我想要的结果……但是仍然不能解决为什么这个解决方案不起作用的问题
<button>load about</button>
<script type="text/javascript">
$("button").click(function () {
$("#mainDiv").load("Test/Page2");
});
</script>
enter code here回答 7
Stack Overflow用户
回答已采纳
发布于 2013-01-26 05:12:00
UpdateTargetId = "#mainDiv"
- make中的
- 丢弃
#确保您的页面上引用了jquery.unobtrusive-ajax.min.js脚本。
Stack Overflow用户
发布于 2013-04-03 20:05:14
我将您的代码复制到一个全新的MVC4项目中，它工作得很好。
查看解决方案的屏幕截图：
希望这篇文章能给你一个提示，告诉你哪里可能出了问题。
Stack Overflow用户
发布于 2013-01-26 05:01:48
我通常使用JQuery加载分式，如下所示
$( document ).ready(function() {
$("#lnkPage1").click(function( event ) {
$('#mainDiv').load('Test/Pag1');
});
$("#lnkPage2").click(function( event ) {
$('#mainDiv').load('Test/Pag2');
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/14529936
复制相关文章
相似问题
腾讯云开发者
