我正在研究ASP.NET Mvc项目。我有一个类似于图像的视图:
我在布局中设计了右侧面板。我的布局代码:
<div class="col-md-3 panel panel-info" style="margin-top:20px;">
<div class="panel panel-primary" style="margin-top:8px;">
<div class="panel-heading">Setting</div>
<div class="panel-body">
<div class="list-group">
<a href="#" class="list-group-item active text-center">Lists</a>
<hr />
<a href="#" class="list-group-item">Add Users - Partialview 1</a>
<a href="~/Areas/Admin/Views/Shared/_AddUser.cshtml" class="list-group-item">Edit Users - Partialview 2</a>
<a href="~/Areas/Admin/Views/Shared/_UserList.cshtml" class="list-group-item">User List - Partialview 3</a>
<a href="#" class="list-group-item">Set Password - Partialview 4</a>
<a href="#" class="list-group-item">User Details - Partialview 5</a>
<a href="#" class="list-group-item">Send Message - Partialview 6</a>
</div>
</div>
</div>
</div>
我在右侧面板中有几种模式包含:添加,编辑,列表和... 每种模式都有一个特殊的部分视图。我想,当我点击右侧面板上的每个模式时,左侧会有特殊的部分视图加载。如何在asp mvc中动态加载partialview?
感谢
答案 0 :(得分:1)
方法1
首先,您需要在视图中对控制器进行操作
@{Html.RenderAction("youractionname", "controllername");}
然后在控制器上你需要像这样返回部分视图
public ActionResult youractionname()
{
return PartialView("~/Areas/Admin/Views/Shared/_AddUser.cshtml");
}
通过此方法,您的部分视图将加载到您的视图中。
方法2
您可以使用ajax加载部分视图而无需刷新浏览器。
首先,您需要在需要加载局部视图的位置添加一个div。
<div id="PartialId"></div>
然后你需要添加动作链接(点击链接部分视图将被加载)
<a href="javascript:Details()">Select</a>
您的ajax方法如下所示
<script>
function Details() {
jQuery.ajax({
url: '@Url.Action("index", "Home")', // your action method
method: "POST", // your method
cache: false,
data: { }
}).done(function (result) {
$('#PartialId').html(result);
});
}
</script>
请注意,您需要在项目中添加Unobtrusive-Ajax-jquery脚本。
您可以找到此here