在asp.net mvc中使用PartialView返回部分HTML段
問題鏈接: MVC怎樣實現異步調用輸出HTML頁面
?
該問題是個常見的 case, 故寫篇文章用于提示新人。
?
在asp.net mvc中返回View時使用的是ViewResult,它繼承自ViewResultBase 同一時候它還有個兄弟PartialViewResult
?
相信聰明的你已經知道了它倆的差別了，沒錯 一個用于返回總體，還有一個返回局部(部分)。
?
如果我有這樣一個需求，輸入username，然后返回相關信息。之前的做法可能會是用json格式來返回用戶的相關信息，然后到頁面去渲染相關
?
的HTML，假設產生的相關HTML比較大的話，我還是建議你沿用之前的方案(返回json)，由于傳輸的數據少，響應快一些。
?
反之，PartialViewResult 則是返回部分HTML 的不錯選擇。
?
以下就讓我們看下怎樣使用PartialViewResult:
?
Layout.cshtml
?
<!DOCTYPE html>
<html>
<head>
??? <title>@ViewBag.Title</title>
??? <script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>
</head>
<body>
??? @RenderBody()
</body>
</html>
?
Index.cshtml
?
@{
??? ViewBag.Title = "Index";
??? Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>
??? PartialView Demo</h2>
<div>
??? Please write your name here
??? <input type='text' id='txtName' />
??? <input type='button' value='submit' id='btnOK' />
</div>
<br />
<div id='content'>
</div>
<script type="text/javascript">
??? $(function () {
??????? $('#btnOK').click(function () {
??????????? var data = { Name: $('#txtName').val()};????????????????
??????????? $.ajax({
??????????????? type: "POST",
??????????????? url: '@Url.Action("PartialViewDemo", "Home")',
??????????????? data: data,
??????????????? datatype: "html",
??????????????? success: function (data) {
??????????????????????? $('#content').html(data);???????????????????
??????????????? },
??????????????? error: function () {
??????????????????? alert("處理失敗!");
??????????????? }
??????????? });
??????? });??????
??? });
</script>
?
ViewUserControl.cshtml （Partial View）
?
@model Sample.Models.PartialViewDemoViewModel?
<div>?
?
?
<h2>ViewUserControl.cshtml</h2>?
?
@Model.dt
<br /><br />
Hello~? @Model.Name?
</div>
?
or ViewUC.ascx?? （View User Control）
?
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<Vancl.Sample.Models.PartialViewDemoViewModel>" %>
?
<div>
?
<h2>ViewUC.ascx</h2>?
?
<%=Model.dt %>
?
<br /><br />
?
Hello~? <%=Model.Name %>
?
</div>
?
Model
?
public class PartialViewDemoViewModel
??? {
??????? public string Name { set; get; }
??????? public DateTime? dt { set; get; }
??? }
?
Action
?
[HttpPost]
??????? public ActionResult PartialViewDemo(PartialViewDemoViewModel model)
??????? {
??????????? model.dt = DateTime.Now;
??????????? return PartialView("ViewUserControl", model);?
??????????? //return PartialView("ViewUC", model);?
??????? }?
?
調用?Controller.PartialView方法時,能夠指定 Partial View or View User Control 效果是一樣的
?
不寫后綴時，會查找同文件夾和Shared文件夾下的文件，也就是在同文件夾或Shared文件夾下時能夠省略后綴名。
?
假設文件夾下存在同名的情況，會找第一個并返回。
?
eg: 同文件夾下有 ViewUserControl.ascx 和 ViewUserControl.cshtml
?
這時使用 return PartialView("ViewUserControl");
?
會返回 ViewUserControl.ascx 的內容，由于字母a在c前 :)
?
假設在這樣的情況下想調用 ViewUserControl.cshtml
?
則須要寫全路徑，return PartialView("~/Views/Home/ViewUserControl.cshtml");
?
當想訪問的 Partial View or View User Control 在不同文件夾時，也能夠通過全路徑的方式訪問。
?
Hope this helps,
Sandy
?
轉載于:https://www.cnblogs.com/zfyouxi/p/4370978.html
總結
以上是生活随笔為你收集整理的在asp.net mvc中使用PartialView返回部分HTML段的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 基于CSS3飘带状3D菜单 菜单带小图标
- 下一篇： JqueryAjax异步加载在ASP.N