点击按钮生成Partial View是否可行？跨视图展示需求咨询

Absolutely! This is a super common scenario in ASP.NET MVC (and ASP.NET Core) and totally achievable. Let me walk you through two common approaches depending on whether your "another view" is on the same page or a separate one.

Approach 1: Load Partial into the Same Page (Most Common) #

If both your button and the target display area are part of the same page layout, AJAX is the perfect solution here.

Step 1: Create Your Partial View #

First, build the partial view you want to render (let's name it _MyDynamicPartial.cshtml). It's just a snippet of markup without the full page layout:

<!-- _MyDynamicPartial.cshtml -->
<div class="card p-3">
  <h4>Here's Your Dynamic Content!</h4>
  <p>This partial view was loaded when you clicked the button.</p>
</div>

Step 2: Add a Controller Action #

You'll need a simple action in your controller that returns the partial view. This acts as the endpoint your button will call to fetch the content:

public IActionResult GetMyPartial()
{
    // Optional: Pass a model here if your partial needs dynamic data
    // var data = _myService.GetUserInfo();
    // return PartialView("_MyDynamicPartial", data);
    
    return PartialView("_MyDynamicPartial");
}

Step 3: Set Up the Button and Target Container #

• In your current view (where the button lives), add a button that triggers an AJAX request.
• Add an empty container in the section of the page (your "another view" area) where you want the partial to appear.

Current View (Button Section)

<button id="loadPartialBtn" class="btn btn-success">Load Partial Content</button>

<script src="~/lib/jquery/jquery.min.js"></script>
<script>
  $(document).ready(function() {
    $("#loadPartialBtn").click(function() {
      // Make an AJAX call to fetch the partial view HTML
      $.ajax({
        url: "@Url.Action("GetMyPartial", "Home")", // Replace "Home" with your controller name
        type: "GET",
        success: function(partialHtml) {
          // Insert the loaded partial into the target container
          $("#partialDisplayArea").html(partialHtml);
        },
        error: function() {
          alert("Oops, something went wrong loading the partial!");
        }
      });
    });
  });
</script>

Target Section (Where Partial Appears)

<!-- Add this wherever you want the partial view to show up -->
<div id="partialDisplayArea"></div>

Approach 2: Load Partial When Navigating to a Separate View #

If your target is a completely separate page, you can pass a flag to trigger the partial load when that page initializes.

Step 1: Button in Current View #

Make the button navigate to the target view with a query string parameter that signals we want to load the partial:

<button onclick="window.location.href='@Url.Action("TargetPage", "Home")?loadPartial=true'" class="btn btn-info">Go to Target Page with Partial</button>

Step 2: Controller Action for Target Page #

Modify the target page's action to accept the flag and pass it to the view:

public IActionResult TargetPage(bool loadPartial = false)
{
    ViewBag.ShouldLoadPartial = loadPartial;
    return View();
}

Step 3: Target View Logic #

In the target view, check the flag and render the partial if the parameter was set:

<div class="container">
  <h1>Target Page</h1>
  
  @if (ViewBag.ShouldLoadPartial)
  {
    @Html.Partial("_MyDynamicPartial")
  }
  else
  {
    <p>Click the button from the previous page to load dynamic content here.</p>
  }
</div>

Quick Tips #

• If you're using ASP.NET Core, the process is almost identical—just stick with IActionResult and ensure your script references (like jQuery) are set up correctly.
• For vanilla JS fans, you can replace the jQuery AJAX with the native fetch() API if you prefer no external dependencies.
• If your partial needs dynamic data, populate the model in the controller action before returning the partial view.

内容的提问来源于stack exchange，提问作者photosunthesis