Example tutorial on rendering html with asp.net mvc partial view-C#.Net Tutorial-php.cn

Home

Backend Development

C#.Net Tutorial

Example tutorial on rendering html with asp.net mvc partial view

零下一度

Jul 09, 2017 am 11:52 AM

asp.nethtmlrendering

In order to improve the user experience, generally we use ajax to load data and then render html based on the data. Front-end rendering and server-side rendering can be used to render html. Those who are interested can learn more

In order to improve the user experience, generally we Use ajax to load data and then render html based on the data. Front-end rendering and server-side rendering can be used to render html.

Front-end rendering

Use a front-end template engine or MVC framework, such as underscore.js template or use angular.js and other frameworks, of course You can also splice html yourself without any framework.

<!DOCTYPE html>
<html>
  <head>
    <title>underscore.js的template渲染html</title>
  </head>
<body>

<p id="content"></p>

<script src="~/static/js/lib/jquery-3.1.1.js"></script>
<script src="http://www.css88.com/doc/underscore/underscore.js"></script>

<script>
  var data = { name: &#39;john&#39;, age: "18" }
  var compiled = _.template("<p>姓名: <%= name %></p><p>年龄: <%= age %></p>");
  $("#content").append(compiled(data));
</script>
</body>

</html>

Back-end rendering

If you are using asp.net MVC can use partial views, and ajax can directly load partial views rendered on the server side. Please visit my github for the full code of this part.

 public ActionResult News()
  {
    return View();
  }

 public ActionResult RenderNews(int pageIndex = 1, int pageSize = 10)
 {
   return PartialView();
 }

The front-end directly sends an ajax request to RenderNews

$.ajax({
 url: &#39;/Home/RenderNews?pageIndex=3&pageSize=10&#39;,
 type: "POST",
 beforeSend: function() {

 },
 complete: function() {

 },
 success: function(result) {
 if (result.trim() != "") {
   $("#containter").html(result);
 }
 },
 error: function(e) {
   console.log(e);
  }
});

Using this method, the back-end directly outputs rendering. In the final html, sometimes we need to return an error code to the front end, such as {"code":10000,"message":"success","data":"

aaaaa

"}, so we need Dynamically call the distributed view in the controller to get the rendering result. The dynamic calling code is:

public abstract class BaseController : Controller
 {
   /// <summary>
   /// 动态渲染分布视图
   /// </summary>
   /// <param name="viewName">视图名称</param>
   /// <param name="model">模型</param>
   /// <returns>渲染后的html</returns>
   public virtual string RenderPartialViewToString(string viewName, object model)
   {
      if (string.IsNullOrEmpty(viewName))
        viewName = this.ControllerContext.RouteData.GetRequiredString("action");

      this.ViewData.Model = model;

      using (var sw = new StringWriter())
      {
        ViewEngineResult viewResult = System.Web.Mvc.ViewEngines.Engines.FindPartialView(this.ControllerContext, viewName);
        var viewContext = new ViewContext(this.ControllerContext, viewResult.View, this.ViewData, this.TempData, sw);
        viewResult.View.Render(viewContext, sw);

        return sw.GetStringBuilder().ToString();
      }
   }
}

Summary

Because back-end rendering can use the asp.net mvc template engine syntax, it is better than front-end rendering in terms of maintainability and development efficiency. I personally also tend to use back-end rendering, but because it needs to be passed to the browser html, Therefore, the bandwidth usage will be high, and this loss can be solved by increasing the server bandwidth.

The above is the detailed content of Example tutorial on rendering html with asp.net mvc partial view. For more information, please follow other related articles on the PHP Chinese website!

Statement

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

C# and .NET: Understanding the Relationship Between the TwoApr 17, 2025 am 12:07 AM

The relationship between C# and .NET is inseparable, but they are not the same thing. C# is a programming language, while .NET is a development platform. C# is used to write code, compile into .NET's intermediate language (IL), and executed by the .NET runtime (CLR).

The Continued Relevance of C# .NET: A Look at Current UsageApr 16, 2025 am 12:07 AM

C#.NET is still important because it provides powerful tools and libraries that support multiple application development. 1) C# combines .NET framework to make development efficient and convenient. 2) C#'s type safety and garbage collection mechanism enhance its advantages. 3) .NET provides a cross-platform running environment and rich APIs, improving development flexibility.

From Web to Desktop: The Versatility of C# .NETApr 15, 2025 am 12:07 AM

C#.NETisversatileforbothwebanddesktopdevelopment.1)Forweb,useASP.NETfordynamicapplications.2)Fordesktop,employWindowsFormsorWPFforrichinterfaces.3)UseXamarinforcross-platformdevelopment,enablingcodesharingacrossWindows,macOS,Linux,andmobiledevices.

C# .NET and the Future: Adapting to New TechnologiesApr 14, 2025 am 12:06 AM

C# and .NET adapt to the needs of emerging technologies through continuous updates and optimizations. 1) C# 9.0 and .NET5 introduce record type and performance optimization. 2) .NETCore enhances cloud native and containerized support. 3) ASP.NETCore integrates with modern web technologies. 4) ML.NET supports machine learning and artificial intelligence. 5) Asynchronous programming and best practices improve performance.

Is C# .NET Right for You? Evaluating its ApplicabilityApr 13, 2025 am 12:03 AM

C#.NETissuitableforenterprise-levelapplicationswithintheMicrosoftecosystemduetoitsstrongtyping,richlibraries,androbustperformance.However,itmaynotbeidealforcross-platformdevelopmentorwhenrawspeediscritical,wherelanguageslikeRustorGomightbepreferable.

C# Code within .NET: Exploring the Programming ProcessApr 12, 2025 am 12:02 AM

The programming process of C# in .NET includes the following steps: 1) writing C# code, 2) compiling into an intermediate language (IL), and 3) executing by the .NET runtime (CLR). The advantages of C# in .NET are its modern syntax, powerful type system and tight integration with the .NET framework, suitable for various development scenarios from desktop applications to web services.

C# .NET: Exploring Core Concepts and Programming FundamentalsApr 10, 2025 am 09:32 AM

C# is a modern, object-oriented programming language developed by Microsoft and as part of the .NET framework. 1.C# supports object-oriented programming (OOP), including encapsulation, inheritance and polymorphism. 2. Asynchronous programming in C# is implemented through async and await keywords to improve application responsiveness. 3. Use LINQ to process data collections concisely. 4. Common errors include null reference exceptions and index out-of-range exceptions. Debugging skills include using a debugger and exception handling. 5. Performance optimization includes using StringBuilder and avoiding unnecessary packing and unboxing.

Testing C# .NET Applications: Unit, Integration, and End-to-End TestingApr 09, 2025 am 12:04 AM

Testing strategies for C#.NET applications include unit testing, integration testing, and end-to-end testing. 1. Unit testing ensures that the minimum unit of the code works independently, using the MSTest, NUnit or xUnit framework. 2. Integrated tests verify the functions of multiple units combined, commonly used simulated data and external services. 3. End-to-end testing simulates the user's complete operation process, and Selenium is usually used for automated testing.

See all articles

Hot AI Tools

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress images for free

Clothoff.io

AI clothes remover

AI Hentai Generator

Generate AI Hentai for free.

Hot Article

R.E.P.O. Energy Crystals Explained and What They Do (Yellow Crystal)

1 months agoBy尊渡假赌尊渡假赌尊渡假赌

R.E.P.O. Best Graphic Settings

1 months agoBy尊渡假赌尊渡假赌尊渡假赌

Assassin's Creed Shadows: Seashell Riddle Solution

2 weeks agoByDDD

R.E.P.O. How to Fix Audio if You Can't Hear Anyone

1 months agoBy尊渡假赌尊渡假赌尊渡假赌

R.E.P.O. Chat Commands and How to Use Them

1 months agoBy尊渡假赌尊渡假赌尊渡假赌

Hot Tools

MinGW - Minimalist GNU for Windows

This project is in the process of being migrated to osdn.net/projects/mingw, you can continue to follow us there. MinGW: A native Windows port of the GNU Compiler Collection (GCC), freely distributable import libraries and header files for building native Windows applications; includes extensions to the MSVC runtime to support C99 functionality. All MinGW software can run on 64-bit Windows platforms.