在asp.net mvc中使用PartialView返回部分HTML段

在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 的内容,由于字母ac :)

 

假设在这样的情况下想调用 ViewUserControl.cshtml

 

则须要写全路径,return PartialView(~/Views/Home/ViewUserControl.cshtml);

 

当想訪问的 Partial View or View User Control 在不同文件夹时,也能够通过全路径的方式訪问。

 

Hope this helps,

Sandy

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/118428.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 软件架构 设计模式_几种常见软件架构

    软件架构 设计模式_几种常见软件架构什么是架构?  软件体系结构通常被称为架构,指可以预制和可重构的软件框架结构。架构尚处在发展期,对于其定义,学术界尚未形成一个统一的意见,而不同角度的视点也会造成软件体系结构的不同理解,以下是一些主流的标准观点。  ANSI/IEEE610.12-1990软件工程标准词汇对于体系结构定义是:“体系架构是以构件、构件之间的关系、构件与环境之间的关系为内容的某一系统的基本组织结构以及知道上述内容设计与演化的原理(principle)”。  MaryShaw和DavidGarlan认为软件体系结构是软件设

    2022年10月18日
    0
  • html表单验证确认密码_简述html5的表单验证

    html表单验证确认密码_简述html5的表单验证因为最近在做一个项目,需要实现前端表单验证,而这些只是简单的非空和数字之类的简单验证,可能大家都听说过jQueryValidate,但是我觉得引用jQueryValidate太麻烦了。我采用的表单验证不是使用框架来实现,而是直接使用html5的新特性1.实现一个简单的用户名长度验证我想实现表单验证,但是写js又太麻烦,有没有简单实用又灵活的方法需求:用户名限制长度…

    2025年6月23日
    3
  • selenium-PO模式

    selenium-PO模式PO模式:全称pageObject模式,使测试代码具有理想的可维护性参考:​​​​​​PO设计模式|Selenium优点:测试代码与页面的定位代码(如定位器或者其他的映射)相分离. 该页面提供的方法或元素在一个独立的类中,而不是将这些方法或元素分散在整个测试中….

    2022年5月10日
    41
  • WMI远程访问问题解决方法

    WMI远程访问问题解决方法

    2021年8月4日
    52
  • Java内存管理-程序运行过程(一)「建议收藏」

    勿在流沙住高台,出来混迟早要还的。做一个积极的人编码、改bug、提升自己我有一个乐园,面向编程,春暖花开!相信在做Java开发的伙伴一定知道 JVM(Java Virtual Machine(Java虚拟机)!本系列会开启对JVM相关的知识的探索和总结,让我们一起踏入JVM的学习之旅中,去了解和发现更加精彩的Java世界! 正如奥古斯特·罗丹 说过:世界上不是缺少美,而是缺少发现美的眼…

    2022年2月28日
    51
  • gimp中文版教程_GIMP中详细教程.pdf「建议收藏」

    gimp中文版教程_GIMP中详细教程.pdf「建议收藏」GIMP中详细教程GIMP实用系列教程1文件的打开和存储概述打开GIMP软件其初始界面如下:左边是工具,工具箱中每选择一种工具后,通常在其下部会出现一个与其相配的选项栏一起使用的。因此每选好一种工具,首先要把选项栏中的有关选项根据需要选定以后才开始使用。例如:图中选择了画笔,则画笔的选项栏可以选择其不透明度、画笔的笔尖形状、画笔的大小等选项。右边通常可以放置一个图层对话框,如未出现可以在下拉…

    2022年4月19日
    93

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号