首页 > 解决方案 > 带有 Razor 页面的 ASP.NET Core:从 DropDownList 返回值

问题描述

我有一个网络应用程序,它允许我从数据库中的客户表中提取名称并在下拉菜单中打印出来。然后我可以在列表中选择名称,但我不知道如何实际实现返回该名称,以便我可以将其插入网站的其他位置。

这是我的 CustomerPage.cshtml.cs 类的代码:

namespace CDInsightsWeb.Pages.Customer
{
public class CustomerPageModel : PageModel
{
    private readonly ConnectionStringClass _db;

    public CustomerPageModel(ConnectionStringClass db)
    {
        _db = db;
    }

    public List<Model.Customer> DisplayData { get; set; }

    public async Task OnGet()
    {
        DisplayData = await _db.Customer.ToListAsync();
    }
    public async Task OnPost()
    {
        return RedirectToPage("/Assessment/AssessmentPage", new { Customer.name });
    }
}
}

在 CustomerPage.cshtml 中,我有一行显示并填充 DropDownList:

@page
@model CDInsightsWeb.Pages.Customer.CustomerPageModel
@{
    ViewData["Title"] = "CustomerPage";
}

<h1>Select A Customer</h1>
<div class="text-center">
    <hr />
    @Html.DropDownList("name", new SelectList(Model.DisplayData, "customer_id", "name"), "Select Name")
</div>
<div>
    <a asp-page="/Customer/CreateCustomer">Create a Customer</a>
</div>

我如何返回从该列表中选择的值?另外,如果需要任何额外的信息,请告诉我,谢谢!

编辑:添加了 CustomerPage.cshtml 的完整代码 Edit2:添加了 OnPost 方法的代码

标签: c#asp.netasp.net-mvcentity-frameworkrazor

解决方案


根据您的需要更改以下代码:

后面的代码:

    [BindProperty]
    public List<Customer> DisplayData { get; set; }

    public IActionResult OnGet()
    {
        DisplayData = new List<Customer>();
        DisplayData.Add(new Customer { customer_id = "101", name = "Arun" });
        DisplayData.Add(new Customer { customer_id = "102", name = "Sonu" });
        return Page();
    }

    public IActionResult OnPost(string name)
    {
        return RedirectToPage("/Assessment/AssessmentPage", new { name });
    }

看法 :

<h1>Select A Customer</h1>
<form method="post">
    <div class="text-center">
        <hr />
        @Html.DropDownList("name", new SelectList(Model.DisplayData, "name", "name"), "Select Name")
    </div>
    <div>
       <input value="submit" type="submit"/>
    </div>
</form>

输出 :

在此处输入图像描述


推荐阅读