ASP.NET Core中Identity脚手架Manage文件夹缺失及页面布局适配问题

1. Generate Missing Identity Manage Pages #

First, you need to scaffold the Account/Manage pages since they're missing:

• Right-click your project in Solution Explorer → Add → New Scaffolded Item
• Pick Identity under ASP.NET Core, click Add
• In the Identity setup window, check the Manage pages you need (Index, ChangePassword, etc.)
• Select your existing _Layout.cshtml as the layout for these pages, then confirm to add them

2. Choose Your Approach for Partial Content Loading #

Option A: Keep Layout During Full Page Load (Simplest) #

If you just want the sidebar/header to stay visible (even if the page refreshes fully), ensure the scaffolded Manage pages use your main layout:

• Open each Manage page (e.g., Index.cshtml) and check the top section:

  @{
      Layout = "_Layout"; // Make sure this points to your layout with sidebar/header
  }
  

This will make the Account Settings page load within your existing layout instead of a blank page.

Option B: Load Content Without Full Page Refresh (AJAX) #

To update only the content area without reloading the whole page:

1. Update the Account Settings Link:

   <a href="/Identity/Account/Manage" id="accountSettingsLink">Account Settings</a>
   

2. Add JavaScript to Handle AJAX Loading:

   document.getElementById('accountSettingsLink').addEventListener('click', function(e) {
       e.preventDefault();
       const contentContainer = document.getElementById('your-content-area-id'); // Replace with your actual content div ID
       
       fetch(this.href, {
           headers: { 'X-Requested-With': 'XMLHttpRequest' }
       })
       .then(res => res.text())
       .then(html => {
           // Extract just the content part from the loaded page
           const tempDiv = document.createElement('div');
           tempDiv.innerHTML = html;
           const content = tempDiv.querySelector('#your-content-area-id').innerHTML;
           contentContainer.innerHTML = content;
       })
       .catch(err => console.log('Load failed:', err));
   });
   

3. Modify Manage Page Models to Return Partial Content:
   Open the code-behind for each Manage page (e.g., Index.cshtml.cs) and update the OnGetAsync method:

   public async Task<IActionResult> OnGetAsync()
   {
       // Your existing code to load user data...
       
       if (Request.Headers["X-Requested-With"] == "XMLHttpRequest")
       {
           return PartialView(); // Return only the page content, not the full layout
       }
       return Page();
   }
   

3. Test It Out #

After setting this up, clicking the Account Settings link should either load the page within your existing layout (Option A) or update just the content area without refreshing the sidebar/header (Option B).

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