如何在ASP.NET Core中通过Telerik Kendo DropDownList Tag Helper获取选中项

我来帮你搞定这个问题，核心原因是你现在的代码里缺少一个用来接收选中值的绑定属性，而且DropDownList没有明确指定值和文本对应的字段，导致模型绑定无法正确识别提交的选中项。

步骤1：在PageModel中添加接收选中值的属性 #

首先，修改你的Login2Model，新增一个BindProperty属性来存储用户选中的组织ID：

public class Login2Model : PageModel
{
    [BindProperty]
    public string UserName { get; set; }

    [BindProperty]
    public string Password { get; set; }

    [BindProperty]
    public IEnumerable<SelectListItem> Organizations { get; set; }

    // 新增：用来接收选中的组织ID
    [BindProperty]
    public string SelectedOrganizationId { get; set; }

    public void OnGet()
    {
        this.Organizations = _getOrganizations();
    }

    // 新增POST处理方法（如果还没有的话）
    public IActionResult OnPost()
    {
        if (!ModelState.IsValid)
        {
            // 验证失败时重新加载组织列表
            Organizations = _getOrganizations();
            return Page();
        }

        // 这里就可以获取到选中的值了
        // 比如：var selectedId = SelectedOrganizationId;
        // 执行你的登录逻辑...

        return RedirectToPage("/Index");
    }

    private IList<SelectListItem> _getOrganizations()
    {
        return new List<SelectListItem> {
            new SelectListItem {Value = Guid.NewGuid().ToString(), Text = "Google"},
            new SelectListItem {Value = Guid.NewGuid().ToString(), Text = "Apple"},
            new SelectListItem {Value = Guid.NewGuid().ToString(), Text = "Microsoft"}
        };
    }
}

步骤2：修改Kendo DropDownList标签助手 #

接下来调整视图中的DropDownList，需要做两个关键修改：

• 使用asp-for绑定到新增的SelectedOrganizationId属性（ASP.NET Core会自动生成正确的name属性）
• 指定value-field和text-field，对应SelectListItem的Value和Text字段

修改后的视图代码：

@page
@model PITS.Areas.Authentication.Pages.Login2Model
@{ }
<form method="post">
    <input class="form-control k-textbox" asp-for="UserName" type="text" />
    <input class="form-control k-textbox" asp-for="Password" type="password" />
    
    <kendo-dropdownlist asp-for="SelectedOrganizationId" 
                        filter="FilterType.Contains" 
                        placeholder="Selecteer Administratie" 
                        style="width: 100%;" 
                        bind-to="Model.Organizations"
                        value-field="Value"
                        text-field="Text">
    </kendo-dropdownlist>
    
    <input type="submit" class="btn btn-primary pull-right" value="Login">
</form>

为什么这样能解决问题？ #

1. 接收属性缺失：原来的代码只有用来渲染下拉选项的Organizations集合，但没有专门存储选中值的属性，模型绑定不知道该把提交的选中值放到哪里。
2. 字段映射不明确：如果不指定value-field和text-field，Kendo DropDownList可能无法正确识别SelectListItem的属性，导致提交的值不符合模型绑定的要求。
3. asp-for的作用：使用asp-for代替手动写name，可以确保表单字段名和PageModel属性名完全一致，避免拼写错误导致的绑定失败。

这样调整之后，当用户提交表单时，选中的组织ID就会自动绑定到SelectedOrganizationId属性里，你就能在OnPost方法中正常获取它了。

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