如何根据用户选择的单选按钮展示不同Razor视图？

第一步：完善单选按钮的表单提交逻辑 #

你现在的单选按钮只是静态元素，没有提交能力，这是核心问题。先把它们包裹在表单里，确保后端能接收到用户选择：

<form method="post" asp-action="ProcessTableSelection">
    <h3>欢迎你，@User.Identity.Name！请选择要查看的表格：</h3>
    <div>
        <input type="radio" name="selectedTable" id="tableA" value="Customer" checked>
        <label for="tableA">客户信息表</label>
    </div>
    <div>
        <input type="radio" name="selectedTable" id="tableB" value="Order">
        <label for="tableB">订单信息表</label>
    </div>
    <button type="submit" class="btn btn-primary">确认进入</button>
</form>

关键注意点：

• 所有单选按钮的name属性必须完全相同（比如这里的selectedTable），否则ASP.NET无法识别这是一组选项
• 每个单选按钮的value要设置成唯一标识（比如对应数据库表的实体名）
• asp-action要指向控制器中处理提交的方法名（比如ProcessTableSelection）

第二步：在控制器中添加选择处理与视图跳转逻辑 #

在你的控制器（比如HomeController或专门的TableController）中添加HttpPost方法，接收单选值并跳转对应视图：

private readonly YourDbContext _dbContext;

// 构造函数注入DbContext（确保你已经配置好数据库连接）
public YourController(YourDbContext dbContext)
{
    _dbContext = dbContext;
}

[HttpPost]
public IActionResult ProcessTableSelection(string selectedTable)
{
    switch(selectedTable)
    {
        case "Customer":
            // 查询客户表数据，传给对应视图
            var customers = _dbContext.Customers.ToList();
            return View("CustomerTable", customers); // 跳转到你已创建的客户表视图
        case "Order":
            // 查询订单表数据，传给订单视图
            var orders = _dbContext.Orders.ToList();
            return View("OrderTable", orders); // 跳转到你需要创建的订单表视图
        default:
            // 异常情况返回初始页面
            return RedirectToAction("Index");
    }
}

为什么之前的if没成功？
大概率是没拿到正确的selectedTable值——要么单选按钮name不统一，要么控制器参数名和name不匹配，导致判断条件永远不触发。

第三步：给表格视图添加数据新增功能 #

以CustomerTable.cshtml为例，在表格上方添加新增表单，提交到控制器的新增方法：

1. 视图中的新增表单：

<!-- 新增客户表单 -->
<form method="post" asp-action="AddCustomer">
    <div class="mb-3">
        <label asp-for="Name" class="form-label">客户姓名</label>
        <input asp-for="Name" class="form-control">
    </div>
    <div class="mb-3">
        <label asp-for="Phone" class="form-label">联系电话</label>
        <input asp-for="Phone" class="form-control">
    </div>
    <button type="submit" class="btn btn-success">添加客户</button>
</form>

<!-- 客户表格 -->
<table class="table">
    <thead>
        <tr>
            <th>姓名</th>
            <th>电话</th>
        </tr>
    </thead>
    <tbody>
        @foreach(var customer in Model)
        {
            <tr>
                <td>@customer.Name</td>
                <td>@customer.Phone</td>
            </tr>
        }
    </tbody>
</table>

2. 控制器中的新增方法：

[HttpPost]
public IActionResult AddCustomer(Customer newCustomer)
{
    if(ModelState.IsValid)
    {
        _dbContext.Customers.Add(newCustomer);
        _dbContext.SaveChanges();
    }
    // 新增完成后重新加载表格数据并返回视图
    var customers = _dbContext.Customers.ToList();
    return View("CustomerTable", customers);
}

订单表的新增逻辑完全一致，只需替换实体类和方法名即可。

额外提醒 #

• 确保你的数据库上下文（DbContext）已经正确配置，并且包含对应的数据实体（Customer、Order）
• 如果还没创建OrderTable视图，右键控制器中的跳转代码，选择“添加视图”，选择“列表”模板并绑定Order实体即可

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